API tools faq
paste
Guest User

Untitled

a guest
Jun 23rd, 2018
96
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.49 KB | None | 0 0
raw download clone embed print report
  1. body {
  2. background: #000;
  3. color: #ddd;
  4. }
  5.  
  6. #jqt a > img {
  7. border: none;
  8. }
  9.  
  10. div#jqt > * {
  11. background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#333), to(#5e5e65));
  12. background: -moz-linear-gradient(-90deg, #333, #5e5e65);
  13. }
  14. #jqt h1, #jqt h2 {
  15. font: bold 18px "Helvetica Neue", Helvetica;
  16. text-shadow: rgba(255,255,255,.2) 0 1px 1px;
  17. color: #000;
  18. margin: 10px 20px 5px;
  19. }
  20. /* @group Toolbar */
  21. #jqt .toolbar {
  22. -webkit-box-sizing: border-box;
  23. -moz-box-sizing: border-box;
  24. border-bottom: 1px solid #000;
  25. padding: 10px;
  26. height: 45px;
  27. background: url(img/toolbarBackground.png) #000000 repeat-x;
  28. position: relative;
  29. }
  30. #jqt .black-translucent .toolbar {
  31. margin-top: 20px;
  32. }
  33. div#jqt .toolbar > h1 {
  34. position: absolute;
  35. overflow: hidden;
  36. left: 50%;
  37. top: 10px;
  38. line-height: 1em;
  39. margin: 1px 0 0 -75px;
  40. height: 40px;
  41. font-size: 20px;
  42. width: 150px;
  43. font-weight: bold;
  44. text-shadow: rgba(0,0,0,1) 0 -1px 1px;
  45. text-align: center;
  46. text-overflow: ellipsis;
  47. white-space: nowrap;
  48. color: #fff;
  49. }
  50. div#jqt.landscape .toolbar > h1 {
  51. margin-left: -125px;
  52. width: 250px;
  53. }
  54. #jqt .button, #jqt .back, #jqt .cancel, #jqt .add {
  55. position: absolute;
  56. overflow: hidden;
  57. top: 8px;
  58. right: 10px;
  59. margin: 0;
  60. border-width: 0 5px;
  61. padding: 0 3px;
  62. width: auto;
  63. height: 30px;
  64. line-height: 30px;
  65. font-family: inherit;
  66. font-size: 12px;
  67. font-weight: bold;
  68. color: #fff;
  69. text-shadow: rgba(0, 0, 0, 0.5) 0px -1px 0;
  70. text-overflow: ellipsis;
  71. text-decoration: none;
  72. white-space: nowrap;
  73. background: none;
  74. -webkit-border-image: url(img/button.png) 0 5 0 5;
  75. -moz-border-image: url(img/button.png) 0 5 0 5;
  76. }
  77. #jqt .button.active,
  78. #jqt .button:hover,
  79. #jqt .cancel.active,
  80. #jqt .cancel:hover,
  81. #jqt .add:hover,
  82. #jqt .add.active {
  83. -webkit-border-image: url(img/buttonActive.png) 0 5 0 5;
  84. -moz-border-image: url(img/buttonActive.png) 0 5 0 5;
  85. }
  86. #jqt .back {
  87. left: 6px;
  88. right: auto;
  89. padding: 0;
  90. max-width: 55px;
  91. border-width: 0 8px 0 14px;
  92. -webkit-border-image: url(img/backButton.png) 0 8 0 14;
  93. -moz-border-image: url(img/backButton.png) 0 8 0 14;
  94. }
  95. #jqt .back.active, #jqt .back:hover {
  96. -webkit-border-image: url(img/backButtonActive.png) 0 8 0 14;
  97. -moz-border-image: url(img/backButtonActive.png) 0 8 0 14;
  98. }
  99. #jqt .leftButton, #jqt .cancel {
  100. left: 6px;
  101. right: auto;
  102. }
  103. #jqt .add {
  104. font-size: 24px;
  105. line-height: 24px;
  106. font-weight: bold;
  107. }
  108. #jqt .bigButton {
  109. -webkit-border-image: url(img/bigButton.png) 0 12 0 12;
  110. -moz-border-image: url(img/bigButton.png) 0 12 0 12;
  111. border-width: 0 12px;
  112. color: #000000;
  113. display: block;
  114. font-size: 20px;
  115. font-weight: bold;
  116. line-height: 46px;
  117. height: 46px;
  118. text-align: center;
  119. text-decoration: inherit;
  120. text-shadow: rgba(255,255,255,.8) 0 1px 0;
  121. }
  122. #jqt .bigButton.active,
  123. #jqt .bigButton:active,
  124. #jqt .bigButton:hover {
  125. -webkit-border-image: url(img/bigButtonActive.png) 0 12 0 12;
  126. -moz-border-image: url(img/bigButtonActive.png) 0 12 0 12;
  127. color: #000000;
  128. }
  129.  
  130.  
  131. /* @end */
  132. /* @group Lists */
  133. #jqt h1 + ul, #jqt h2 + ul, #jqt h3 + ul, #jqt h4 + ul, #jqt h5 + ul, #jqt h6 + ul {
  134. margin-top: 0;
  135. }
  136. #jqt ul {
  137. color: #aaa;
  138. border: 1px solid #333333;
  139. font: bold 18px "Helvetica Neue", Helvetica;
  140. padding: 0;
  141. margin: 15px 10px 17px 10px;
  142. }
  143. #jqt ul.rounded {
  144. -webkit-border-radius: 8px;
  145. -moz-border-radius: 8px;
  146. -webkit-box-shadow: rgba(0,0,0,.3) 1px 1px 3px;
  147. -moz-box-shadow: rgba(0,0,0,.3) 1px 1px 3px;
  148. }
  149. #jqt ul.rounded li:first-child, #jqt ul.rounded li:first-child a {
  150. border-top: 0;
  151. -webkit-border-top-left-radius: 8px;
  152. -webkit-border-top-right-radius: 8px;
  153. -moz-border-radius-topleft: 8px;
  154. -moz-border-radius-topright: 8px;
  155. }
  156. #jqt ul.rounded li:last-child, #jqt ul.rounded li:last-child a {
  157. -webkit-border-bottom-left-radius: 8px;
  158. -webkit-border-bottom-right-radius: 8px;
  159. -moz-border-radius-bottomleft: 8px;
  160. -moz-border-radius-bottomright: 8px;
  161. }
  162. #jqt ul li {
  163. color: #666;
  164. border-top: 1px solid #333;
  165. border-bottom: #555858;
  166. list-style-type: none;
  167. padding: 10px 10px 10px 10px;
  168. background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#4c4d4e), to(#404142));
  169. background-image: -moz-linear-gradient(-90deg, #4c4d4e, #404142);
  170. overflow: hidden;
  171. }
  172. #jqt ul li.arrow {
  173. background-color: #4c4d4e !important;
  174. background-image: url(img/chevron.png) !important;
  175. background-position: right center !important;
  176. background-repeat: no-repeat !important;
  177. }
  178.  
  179. #jqt ul li.arrow a {
  180. padding: 12px 22px 12px 10px;
  181. }
  182.  
  183. #jqt ul li.forward {
  184. background-image: url(img/chevronCircle.png), -webkit-gradient(linear, 0% 0%, 0% 100%, from(#4c4d4e), to(#404142));
  185. background-image: url(img/chevronCircle.png), -moz-linear-gradient(-90deg, #4c4d4e, #404142);
  186. background-position: right center;
  187. background-repeat: no-repeat;
  188. }
  189. /* universal links on list */
  190. #jqt ul li a, #jqt li.img a + a {
  191. color: #fff;
  192. text-decoration: none;
  193. text-overflow: ellipsis;
  194. white-space: nowrap;
  195. overflow: hidden;
  196. display: block;
  197. padding: 12px 10px 12px 10px;
  198. margin: -10px;
  199. -webkit-tap-highlight-color: rgba(0,0,0,0);
  200. text-shadow: rgba(0,0,0,.2) 0 1px 1px;
  201. }
  202. #jqt ul li a.active, #jqt ul li a.button {
  203. background-color: #53b401;
  204. color: #fff;
  205. }
  206. #jqt ul li a.active.loading {
  207. background-image: url(img/loading.gif);
  208. background-position: 95% center;
  209. background-repeat: no-repeat;
  210. }
  211. #jqt ul li.arrow a.active {
  212. background-image: url(img/chevronActive.png);
  213. background-position: right center;
  214. background-repeat: no-repeat;
  215. }
  216. #jqt ul li.forward a.active {
  217. background-image: url(img/chevronCircleActive.png);
  218. background-position: right center;
  219. background-repeat: no-repeat;
  220. }
  221. #jqt ul li.img a + a {
  222. margin: -10px 10px -20px -5px;
  223. font-size: 17px;
  224. font-weight: bold;
  225. }
  226. #jqt ul li.img a + a + a {
  227. font-size: 14px;
  228. font-weight: normal;
  229. margin-left: -10px;
  230. margin-bottom: -10px;
  231. margin-top: 0;
  232. }
  233. #jqt ul li.img a + small + a {
  234. margin-left: -5px;
  235. }
  236. #jqt ul li.img a + small + a + a {
  237. margin-left: -10px;
  238. margin-top: -20px;
  239. margin-bottom: -10px;
  240. font-size: 14px;
  241. font-weight: normal;
  242. }
  243. #jqt ul li.img a + small + a + a + a {
  244. margin-left: 0px !important;
  245. margin-bottom: 0;
  246. }
  247. #jqt ul li a + a {
  248. color: #000;
  249. font: 14px "Helvetica Neue", Helvetica;
  250. text-overflow: ellipsis;
  251. white-space: nowrap;
  252. overflow: hidden;
  253. display: block;
  254. margin: 0;
  255. padding: 0;
  256. }
  257. #jqt ul li a + a + a, #jqt ul li.img a + a + a + a, #jqt ul li.img a + small + a + a + a {
  258. color: #666;
  259. font: 13px "Helvetica Neue", Helvetica;
  260. margin: 0;
  261. text-overflow: ellipsis;
  262. white-space: nowrap;
  263. overflow: hidden;
  264. display: block;
  265. padding: 0;
  266. }
  267. /*
  268. @end */
  269. /* @group Forms */
  270. #jqt ul.form li {
  271. padding: 7px 10px;
  272. }
  273. #jqt ul.form li.error {
  274. border: 2px solid red;
  275. }
  276. #jqt ul.form li.error + li.error {
  277. border-top: 0;
  278. }
  279. #jqt ul li input[type="text"],
  280. #jqt ul li input[type="password"],
  281. #jqt ul li input[type="tel"],
  282. #jqt ul li input[type="number"],
  283. #jqt ul li input[type="search"],
  284. #jqt ul li input[type="email"],
  285. #jqt ul li input[type="url"],
  286. #jqt ul li textarea,
  287. #jqt ul li select {
  288. color: #777;
  289. background: transparent url('data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==');
  290. border: 0;
  291. font: normal 17px "Helvetica Neue", Helvetica;
  292. padding: 0;
  293. display: inline-block;
  294. margin-left: 0px;
  295. width: 100%;
  296. -webkit-appearance: textarea;
  297. -moz-appearance: textarea;
  298. }
  299. #jqt ul li textarea {
  300. height: 120px;
  301. padding: 0;
  302. text-indent: -2px;
  303. }
  304. #jqt ul li select {
  305. text-indent: 0px;
  306. background: transparent url(img/chevron.png) no-repeat right center;
  307. -webkit-appearance: textfield;
  308. -moz-appearance: textfield;
  309. margin-left: -6px;
  310. width: 104%;
  311. }
  312. #jqt ul li input[type="checkbox"], #jqt ul li input[type="radio"] {
  313. margin: 0;
  314. padding: 10px 10px;
  315. }
  316. #jqt ul li input[type="checkbox"]:after, #jqt ul li input[type="radio"]:after {
  317. content: attr(title);
  318. font: 17px "Helvetica Neue", Helvetica;
  319. display: block;
  320. width: 246px;
  321. color: #777;
  322. margin: -12px 0 0 17px;
  323. }
  324. /* @end */
  325. /* @group Mini Label */
  326. #jqt ul li small {
  327. color: #64c114;
  328. font: 17px "Helvetica Neue", Helvetica;
  329. text-align: right;
  330. text-overflow: ellipsis;
  331. white-space: nowrap;
  332. overflow: hidden;
  333. display: block;
  334. width: 23%;
  335. float: right;
  336. padding: 0;
  337. }
  338. #jqt ul li.arrow small {
  339. padding: 0 15px;
  340. }
  341. #jqt ul li small.counter {
  342. font-size: 17px;
  343. line-height: 13px;
  344. font-weight: bold;
  345. background: rgba(0,0,0,.15);
  346. color: #fff;
  347. -webkit-border-radius: 11px;
  348. -moz-border-radius: 11px;
  349. padding: 4px 10px 5px 10px;
  350. display: block;
  351. width: auto;
  352. margin-top: -22px;
  353. -webkit-box-shadow: rgba(255,255,255,.1) 0 1px 0;
  354. -moz-box-shadow: rgba(255,255,255,.1) 0 1px 0;
  355. }
  356. #jqt ul li.arrow small.counter {
  357. margin-right: 15px;
  358. }
  359. /* @end */
  360. /* @group Individual */
  361. #jqt ul.individual {
  362. border: 0;
  363. background: none;
  364. clear: both;
  365. overflow: hidden;
  366. padding-bottom: 3px;
  367. -webkit-box-shadow: none;
  368. -moz-box-shadow: none;
  369. }
  370. #jqt ul.individual li {
  371. background: #4c4d4e;
  372. border: 1px solid #333;
  373. font-size: 14px;
  374. text-align: center;
  375. -webkit-border-radius: 8px;
  376. -moz-border-radius: 8px;
  377. -webkit-box-sizing: border-box;
  378. -moz-box-sizing: border-box;
  379. width: 48%;
  380. float: left;
  381. display: block;
  382. padding: 11px 10px 14px 10px;
  383. -webkit-box-shadow: rgba(0,0,0,.2) 1px 1px 3px;
  384. -moz-box-shadow: rgba(0,0,0,.2) 1px 1px 3px;
  385. background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#4c4d4e), to(#404142));
  386. background: -moz-linear-gradient(-90deg, #4c4d4e, #404142);
  387. }
  388. #jqt ul.individual li + li {
  389. float: right;
  390. }
  391. #jqt ul.individual li a {
  392. color: #fff;
  393. line-height: 16px;
  394. margin: -11px -10px -14px -10px;
  395. padding: 11px 10px 14px 10px;
  396. -webkit-border-radius: 8px;
  397. }
  398. /* @end */
  399. /* @group Toggle */
  400. #jqt .toggle {
  401. width: 94px;
  402. position: relative;
  403. height: 27px;
  404. display: block;
  405. overflow: hidden;
  406. float: right;
  407. }
  408. #jqt .toggle input[type="checkbox"]:checked {
  409. left: 0px;
  410. }
  411. #jqt .toggle input[type="checkbox"] {
  412. -webkit-appearance: textarea;
  413. -webkit-border-radius: 5px;
  414. -webkit-tap-highlight-color: rgba(0,0,0,0);
  415. -webkit-transition: left .15s;
  416. -moz-appearance: textarea;
  417. -moz-border-radius: 5px;
  418. -moz-transition: left .15s;
  419. background-color: transparent;
  420. background: #fff url(img/toggleSwitch.png) 0 0 no-repeat;
  421. border: 0;
  422. height: 27px;
  423. left: -55px;
  424. margin: 0;
  425. overflow: hidden;
  426. position: absolute;
  427. top: 0;
  428. width: 149px;
  429. }
  430. /* @end */
  431. /* @group Info */
  432. #jqt .info {
  433. background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ccc), to(#aaa), color-stop(.6,#CCCCCC));
  434. background: -moz-linear-gradient(-90deg, #ccc, #aaa);
  435. border-top: 1px solid rgba(255,255,255,.2);
  436. color: #444;
  437. font-size: 12px;
  438. font-weight: bold;
  439. line-height: 16px;
  440. padding: 15px;
  441. text-align: center;
  442. text-shadow: rgba(255,255,255,.8) 0 1px 0;
  443. }
  444. /* @end */
  445. /* @group Edge to edge */
  446. #jqt ul.edgetoedge {
  447. border-width: 1px 0;
  448. margin: 0;
  449. padding: 0;
  450. }
  451. #jqt ul.edgetoedge li {
  452. background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#1e1f21), to(#272729));
  453. background: -moz-linear-gradient(-90deg, #1e1f21, #272729);
  454. border-bottom: 2px solid #000;
  455. border-top: 1px solid #4a4b4d;
  456. font-size: 20px;
  457. margin-bottom: -1px;
  458. }
  459. #jqt ul.edgetoedge li.arrow {
  460. background-color: #404142 !important;
  461. background-image: url(img/chevron.png);
  462. background-position: right center;
  463. background-repeat: no-repeat;
  464. }
  465. #jqt ul.edgetoedge li.sep {
  466. background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(0,0,0,0)), to(rgba(0,0,0,.5)));
  467. background: -moz-linear-gradient(-90deg, rgba(0,0,0,0), rgba(0,0,0,.5));
  468. border-bottom: 1px solid #111113;
  469. border-top: 1px solid #666;
  470. color: #3e9ac3;
  471. font-size: 16px;
  472. margin: 1px 0 0 0;
  473. padding: 2px 10px;
  474. text-shadow: #000 0 1px 0;
  475. }
  476. #jqt ul.edgetoedge li em {
  477. font-weight: normal;
  478. font-style: normal;
  479. }
  480. /* @end */
  481. /* @group Plastic */
  482. #jqt #plastic {
  483. background: #17181a;
  484. }
  485. #jqt ul.plastic {
  486. background: #17181a;
  487. color: #aaa;
  488. font: bold 18px "Helvetica Neue", Helvetica;
  489. margin: 0;
  490. padding: 0;
  491. border-width: 0 0 1px 0;
  492. }
  493. #jqt ul.plastic li {
  494. border-width: 1px 0;
  495. border-style: solid;
  496. border-top-color: #222;
  497. border-bottom-color: #000;
  498. color: #666;
  499. list-style-type: none;
  500. overflow: hidden;
  501. padding: 10px 10px 10px 10px;
  502. }
  503. #jqt ul.plastic li a.active.loading {
  504. background-image: url(img/loading.gif);
  505. background-position: 95% center;
  506. background-repeat: no-repeat;
  507. }
  508. #jqt ul.plastic li small {
  509. color: #888;
  510. font-size: 13px;
  511. font-weight: bold;
  512. line-height: 24px;
  513. text-transform: uppercase;
  514. }
  515. #jqt ul.plastic li:nth-child(odd) {
  516. background-color: #1c1c1f;
  517. }
  518. #jqt ul.plastic li.arrow {
  519. background-image: url(img/chevron.png);
  520. background-position: right center;
  521. background-repeat: no-repeat;
  522. }
  523. #jqt ul.plastic li.arrow a.active {
  524. background-image: url(img/chevron.png);
  525. background-position: right center;
  526. background-repeat: no-repeat;
  527. }
  528. #jqt ul.plastic li.forward {
  529. background-image: url(img/chevronCircle.png);
  530. background-position: right center;
  531. background-repeat: no-repeat;
  532. }
  533. #jqt ul.plastic li.forward a.active {
  534. background-image: url(img/chevronCircle.png);
  535. background-position: right center;
  536. background-repeat: no-repeat;
  537. }
  538. /* @group Metal */
  539. #jqt ul.metal {
  540. border-bottom: 0;
  541. border-left: 0;
  542. border-right: 0;
  543. border-top: 0;
  544. margin: 0;
  545. }
  546. #jqt ul.metal li {
  547. background-image: none;
  548. border-top: 1px solid #fff;
  549. border-bottom: 1px solid #666;
  550. font-size: 26px;
  551. background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(238,238,238,1)), to(rgba(156,158,160,1)));
  552. background: -moz-linear-gradient(-90deg, rgba(238,238,238,1), rgba(156,158,160,1));
  553. }
  554. #jqt ul.metal li a {
  555. line-height: 26px;
  556. margin: 0;
  557. text-shadow: #fff 0 1px 0;
  558. padding: 13px 0;
  559. }
  560. #jqt ul.metal li a em {
  561. display: block;
  562. font-size: 14px;
  563. font-style: normal;
  564. color: #444;
  565. width: 50%;
  566. line-height: 14px;
  567. }
  568. #jqt ul.metal li a.active {
  569. color: rgb(0,0,0);
  570. }
  571. #jqt ul.metal li small {
  572. float: right;
  573. position: relative;
  574. margin-top: 10px;
  575. font-weight: bold;
  576. }
  577. #jqt ul.metal li.arrow {
  578. background-image: url(img/chevron.png);
  579. background-position: right center;
  580. background-repeat: no-repeat;
  581. background-image: url(img/chevron.png), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(238,238,238,1)), to(rgba(156,158,160,1)));
  582. background-image: url(img/chevron.png), -moz-linear-gradient(-90deg, rgba(238,238,238,1), rgba(156,158,160,1));
  583. background-repeat: no-repeat;
  584. background-position: right center;
  585. }
  586. #jqt ul.metal li.arrow a small {
  587. padding-right: 15px;
  588. line-height: 17px;
  589. }
  590. /* @end */
  591. input[type='submit'] {
  592. -webkit-border-radius: 4px;
  593. -moz-border-radius: 4px;
  594. background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(238,238,238,1)), to(rgba(156,158,160,1)));
  595. background: -moz-linear-gradient(-90deg, rgba(238,238,238,1), rgba(156,158,160,1));
  596. border: 1px outset black;
  597. display: block;
  598. font-size: inherit;
  599. font-weight: inherit;
  600. padding: 10px;
  601. }
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!