You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

common.css 23KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546
  1. /***** Roundcube|Mail basic styles *****/
  2. body
  3. {
  4. font-family: "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
  5. margin: 8px;
  6. background-color: #F6F6F6;
  7. color: #000;
  8. font-size: 12px;
  9. }
  10. body.iframe
  11. {
  12. margin: 20px 0 0 0;
  13. background-color: #FFF;
  14. }
  15. body.extwin
  16. {
  17. margin: 10px;
  18. }
  19. select, input, textarea, button
  20. {
  21. font-size: inherit;
  22. font-family: inherit;
  23. }
  24. html.mozilla select {
  25. padding: 2px 1px;
  26. }
  27. th
  28. {
  29. font-weight: normal;
  30. }
  31. h3
  32. {
  33. font-size: 18px;
  34. }
  35. a, a:active, a:visited
  36. {
  37. color: #000;
  38. outline: none;
  39. }
  40. a.button, a.button:visited, a.tab, a.tab:visited, a.axislist
  41. {
  42. color: #000;
  43. text-decoration: none;
  44. }
  45. a.tab
  46. {
  47. width: 80px;
  48. display: block;
  49. text-align: center;
  50. }
  51. a.disabled
  52. {
  53. color: #999;
  54. text-decoration: none;
  55. cursor: default;
  56. }
  57. hr
  58. {
  59. height: 1px;
  60. background-color: #666;
  61. border-style: none;
  62. }
  63. input[type="text"],
  64. input[type="button"],
  65. input[type="password"],
  66. textarea
  67. {
  68. border: 1px solid #666;
  69. color: #333;
  70. background-color: #FFF;
  71. }
  72. input, textarea
  73. {
  74. color: black;
  75. padding: 1px 3px;
  76. }
  77. input.placeholder,
  78. textarea.placeholder,
  79. input:-moz-placeholder,
  80. textarea:-moz-placeholder
  81. {
  82. color: #aaa;
  83. }
  84. input.button
  85. {
  86. height: 20px;
  87. color: #333333;
  88. font-size: 12px;
  89. padding-left: 8px;
  90. padding-right: 8px;
  91. background: url(images/buttons/bg.gif?v=30b2.196) repeat-x #f0f0f0;
  92. border: 1px solid #a4a4a4;
  93. }
  94. input.button:hover
  95. {
  96. color: black;
  97. }
  98. input.button[disabled],
  99. input.button[disabled]:hover
  100. {
  101. color: #aaa;
  102. border-color: #ccc;
  103. }
  104. input.mainaction
  105. {
  106. font-weight: bold;
  107. border: 1px solid #999;
  108. }
  109. img
  110. {
  111. border: 0;
  112. }
  113. .alttext
  114. {
  115. font-size: 11px;
  116. }
  117. .hint
  118. {
  119. color: #666;
  120. font-size: 11px;
  121. }
  122. .formlinks a,
  123. .formlinks a:visited
  124. {
  125. color: #CC0000;
  126. font-size: 11px;
  127. text-decoration: none;
  128. }
  129. .formlinks a.disabled,
  130. .formlinks a.disabled:visited
  131. {
  132. color: #999999;
  133. }
  134. .voice
  135. {
  136. display: none;
  137. }
  138. /* fixes vertical alignment of checkboxes and labels */
  139. label input,
  140. label span
  141. {
  142. vertical-align: middle;
  143. }
  144. /** common user interface objects */
  145. #mainscreen
  146. {
  147. position: absolute;
  148. top: 85px;
  149. right: 20px;
  150. bottom: 20px;
  151. left: 20px;
  152. }
  153. .extwin #mainscreen
  154. {
  155. top: 43px;
  156. }
  157. body > #logo
  158. {
  159. margin-left: 12px;
  160. cursor: pointer;
  161. }
  162. #taskbar
  163. {
  164. position: absolute;
  165. top: 0px;
  166. right: 0px;
  167. height: 24px;
  168. left: 250px;
  169. background: url(images/taskbar.png?v=3878.1902) top right no-repeat;
  170. padding: 10px 6px 5px 0px;
  171. text-align: right;
  172. white-space: nowrap;
  173. z-index: 2;
  174. }
  175. #taskbar a
  176. {
  177. font-size: 11px;
  178. color: #666666;
  179. text-decoration: none;
  180. padding: 6px 12px 6px 26px;
  181. background: url(images/taskicons.gif?v=b8e0.1519) no-repeat;
  182. }
  183. #taskbar a:hover
  184. {
  185. color: #333333;
  186. }
  187. #taskbar a.button-mail
  188. {
  189. background-position: 0 0;
  190. }
  191. #taskbar a.button-addressbook
  192. {
  193. background-position: 0 -25px;
  194. }
  195. #taskbar a.button-settings
  196. {
  197. background-position: 0 -50px;
  198. }
  199. #taskbar a.button-logout
  200. {
  201. background-position: 0 -75px;
  202. }
  203. body > #message
  204. {
  205. position: absolute;
  206. display: none;
  207. top: -1px;
  208. margin-left: -225px;
  209. left: 50%;
  210. z-index: 5000;
  211. opacity: 0.85;
  212. }
  213. body > #message div
  214. {
  215. width: 400px;
  216. margin: 0px;
  217. min-height: 22px;
  218. padding: 8px 10px 8px 46px;
  219. }
  220. body > #message div.notice,
  221. body > #messagebody .part-notice,
  222. body > #mainscreen #messagebody .part-notice,
  223. #message-objects div.notice
  224. {
  225. background: url(images/display/icons.png?v=e866.4201) 6px 3px no-repeat;
  226. background-color: #F7FDCB;
  227. border: 1px solid #C2D071;
  228. }
  229. body > #message div.error,
  230. body > #message div.warning,
  231. #message-objects div.warning,
  232. #message-objects div.error
  233. {
  234. background: url(images/display/icons.png?v=e866.4201) 6px -97px no-repeat;
  235. background-color: #EF9398;
  236. border: 1px solid #DC5757;
  237. }
  238. body > #message div.confirmation,
  239. #message-objects div.confirmation
  240. {
  241. background: url(images/display/icons.png?v=e866.4201) 6px -47px no-repeat;
  242. background-color: #A6EF7B;
  243. border: 1px solid #76C83F;
  244. }
  245. body > #message div.loading,
  246. body > #message div.uploading,
  247. #message-objects div.loading
  248. {
  249. background: url(images/display/loading.gif?v=9bae.2710) 6px 3px no-repeat;
  250. background-color: #EBEBEB;
  251. border: 1px solid #CCCCCC;
  252. }
  253. body > #message div.voice
  254. {
  255. position: absolute;
  256. top: -1000px;
  257. clip: rect(0 0 0 0);
  258. }
  259. body > #message a
  260. {
  261. cursor: pointer;
  262. text-decoration: underline;
  263. }
  264. body.extwin #closelink
  265. {
  266. position: absolute;
  267. top: 5px;
  268. right: 20px;
  269. text-align: right;
  270. z-index:100;
  271. }
  272. .box
  273. {
  274. border: 1px solid #999;
  275. }
  276. .boxtitle
  277. {
  278. height: 12px !important;
  279. padding: 3px 10px 4px 5px;
  280. border-bottom: 1px solid #999;
  281. color: #333;
  282. font-size: 11px;
  283. font-weight: bold;
  284. overflow: hidden;
  285. text-overflow: ellipsis;
  286. -o-text-overflow: ellipsis;
  287. white-space: nowrap;
  288. background: url(images/listheader.gif?v=ab42.314) top left repeat-x #CCC;
  289. }
  290. .boxtitle .rightalign
  291. {
  292. float: right;
  293. }
  294. body.iframe .boxtitle
  295. {
  296. position: fixed;
  297. top: 0;
  298. left: 0;
  299. width: 100%;
  300. }
  301. .boxcontent
  302. {
  303. padding: 15px 10px 10px 10px;
  304. background-color: #F2F2F2;
  305. }
  306. .boxcontent .boxwarning
  307. {
  308. margin: 0 0 10px;
  309. display: block;
  310. min-height: 22px;
  311. background: url(images/display/icons.png?v=e866.4201) #EF9398 6px -95px no-repeat;
  312. border: 1px solid #DC5757;
  313. padding: 8px 10px 8px 46px;
  314. }
  315. .boxcontent table td.title
  316. {
  317. color: #666;
  318. padding-right: 10px;
  319. }
  320. .boxlistcontent
  321. {
  322. position: absolute;
  323. top: 20px;
  324. bottom: 22px;
  325. left: 0;
  326. right: 0;
  327. width: 100%;
  328. overflow-y: auto;
  329. overflow-x: hidden;
  330. }
  331. .boxsubject
  332. {
  333. position: absolute;
  334. top: 0px;
  335. left: 0px;
  336. right: 0px;
  337. overflow: hidden;
  338. height: 22px;
  339. border-bottom: 1px solid #999;
  340. background: url(images/listheader.gif?v=ab42.314) top left repeat-x #CCC;
  341. }
  342. .boxfooter
  343. {
  344. position: absolute;
  345. bottom: 0px;
  346. left: 0px;
  347. right: 0px;
  348. overflow: hidden;
  349. height: 22px;
  350. border-top: 1px solid #999;
  351. background: url(images/listheader.gif?v=ab42.314) top left repeat-x #CCC;
  352. }
  353. .boxfooter a.button,
  354. .boxfooter a.buttonPas
  355. {
  356. display: block;
  357. float: left;
  358. width: 34px;
  359. height: 22px;
  360. padding: 0px;
  361. margin: 0;
  362. overflow: hidden;
  363. background: url(images/icons/groupactions.png?v=ace6.1092) 0 0 no-repeat transparent;
  364. opacity: 0.99; /* this is needed to make buttons appear correctly in Chrome */
  365. }
  366. .boxfooter a.groupactions
  367. {
  368. background-position: 0 -26px;
  369. }
  370. .boxfooter a.delgroup {
  371. background-position: 0 -49px;
  372. }
  373. .boxfooter a.buttonPas
  374. {
  375. opacity: 0.35;
  376. }
  377. .pagenav span
  378. {
  379. color: #444;
  380. font-size: 11px;
  381. text-shadow: white 1px 1px;
  382. white-space: nowrap;
  383. }
  384. .pagenav a.button,
  385. .pagenav a.buttonPas
  386. {
  387. display: block;
  388. float: left;
  389. width: 11px;
  390. height: 11px;
  391. padding: 0;
  392. margin: 1px;
  393. margin-top: 2px;
  394. overflow: hidden;
  395. background: url(images/pagenav.gif?v=2e75.355) 0 0 no-repeat transparent;
  396. opacity: 0.99; /* this is needed to make buttons appear correctly in Chrome */
  397. }
  398. .pagenav a.buttonPas {
  399. opacity: 0.35;
  400. }
  401. .pagenav a.firstpageSel {
  402. background-position: 0 -11px;
  403. }
  404. .pagenav a.prevpage {
  405. background-position: -11px 0;
  406. }
  407. .pagenav a.prevpageSel {
  408. background-position: -11px -11px;
  409. }
  410. .pagenav a.nextpage {
  411. background-position: -22px 0;
  412. }
  413. .pagenav a.nextpageSel {
  414. background-position: -22px -11px;
  415. }
  416. .pagenav a.lastpage {
  417. background-position: -33px 0;
  418. }
  419. .pagenav a.lastpageSel {
  420. background-position: -33px -11px;
  421. }
  422. #rcmcountdisplay
  423. {
  424. float: left;
  425. margin-right: 10px;
  426. }
  427. #countcontrols #pagejumper
  428. {
  429. margin: 0 5px;
  430. float: right;
  431. text-align: center;
  432. padding: 0;
  433. cursor: default;
  434. font-size: 10px;
  435. }
  436. .splitter
  437. {
  438. user-select: none;
  439. -moz-user-select: none;
  440. -khtml-user-select: none;
  441. position: absolute;
  442. background: url(images/dimple.png?v=42a0.158) center no-repeat;
  443. }
  444. .splitter-h
  445. {
  446. cursor: n-resize; cursor: row-resize;
  447. background-position: center 2px;
  448. }
  449. .splitter-v
  450. {
  451. cursor: e-resize; cursor: col-resize;
  452. background-position: 2px center;
  453. }
  454. .popupmenu
  455. {
  456. position: absolute;
  457. top: 32px;
  458. left: 90px;
  459. width: auto;
  460. max-height: 70%;
  461. overflow: -moz-scrollbars-vertical;
  462. overflow-y: auto;
  463. display: none;
  464. background-color: #fff;
  465. background-color: rgba(255, 255, 255, 0.95);
  466. border: 1px solid #999;
  467. padding: 4px;
  468. z-index: 240;
  469. border-radius: 3px;
  470. -moz-border-radius: 3px;
  471. -webkit-border-radius: 3px;
  472. box-shadow: 1px 1px 12px #999;
  473. -moz-box-shadow: 1px 1px 12px #999;
  474. -webkit-box-shadow: #999 1px 1px 12px;
  475. }
  476. .popupmenu ul
  477. {
  478. margin: -4px 0;
  479. padding: 0;
  480. list-style: none;
  481. }
  482. .popupmenu ul li
  483. {
  484. font-size: 11px;
  485. white-space: nowrap;
  486. min-width: 100px;
  487. margin: 3px -4px;
  488. }
  489. .popupmenu li a,
  490. .popupmenu li label
  491. {
  492. display: block;
  493. color: #a0a0a0;
  494. padding: 3px 16px 3px 10px;
  495. text-decoration: none;
  496. min-height: 14px;
  497. line-height: 14px;
  498. background: transparent;
  499. }
  500. .popupmenu li label.comment
  501. {
  502. color: #999;
  503. font-style: italic;
  504. padding-top: 4px;
  505. padding-bottom: 3px;
  506. }
  507. .popupmenu li a.active,
  508. .popupmenu li a.active:active,
  509. .popupmenu li a.active:visited
  510. {
  511. color: #333;
  512. cursor: pointer;
  513. }
  514. .popupmenu li a.active:hover,
  515. .popupmenu.selectable li a.selected:hover
  516. {
  517. color: #fff;
  518. background-color: #c00;
  519. }
  520. .popupmenu li.block input
  521. {
  522. float: left;
  523. }
  524. .popupmenu.selectable li a.selected
  525. {
  526. background: url(images/messageicons.png?v=16cb.2581) 2px -372px no-repeat;
  527. }
  528. .popupmenu.selectable li a
  529. {
  530. padding-left: 20px;
  531. }
  532. .darkbg
  533. {
  534. background-color: #F2F2F2 !important;
  535. }
  536. .dropbutton,
  537. .dropbutton span
  538. {
  539. float: left;
  540. height: 32px;
  541. }
  542. .dropbutton:hover
  543. {
  544. /* background: url(images/dbutton.png?v=7bba.240) 0 0 no-repeat transparent; */
  545. }
  546. .dropbutton span
  547. {
  548. width: 9px;
  549. background: url(images/dbutton.png?v=7bba.240) -53px 0 no-repeat transparent;
  550. }
  551. .dropbutton span:hover
  552. {
  553. cursor: pointer;
  554. background-position: -74px 0;
  555. }
  556. img.uploading
  557. {
  558. width: 16px;
  559. height: 16px;
  560. }
  561. .popup label > input {
  562. margin-left: 10px;
  563. }
  564. /***** common table settings ******/
  565. table.records-table thead tr th,
  566. table.records-table thead tr td
  567. {
  568. height: 20px;
  569. padding: 0px 4px 0px 4px;
  570. vertical-align: middle;
  571. border-bottom: 1px solid #999999;
  572. color: #333333;
  573. background: url(images/listheader.gif?v=ab42.314) top left repeat-x #CCC;
  574. font-size: 11px;
  575. font-weight: bold;
  576. text-align: left;
  577. }
  578. table.records-table tbody tr td
  579. {
  580. height: 16px;
  581. padding: 2px 4px 2px 4px;
  582. font-size: 11px;
  583. white-space: nowrap;
  584. border-bottom: 1px solid #EBEBEB;
  585. overflow: hidden;
  586. text-align: left;
  587. outline: none;
  588. }
  589. table.records-table tr
  590. {
  591. background-color: #FFFFFF;
  592. }
  593. table.records-table tr.selected td
  594. {
  595. color: #FFFFFF;
  596. background-color: #CC3333;
  597. }
  598. table.records-table tr.focused td
  599. {
  600. }
  601. table.records-table tr.unfocused td
  602. {
  603. color: #FFFFFF;
  604. background-color: #929292;
  605. }
  606. ul.treelist li
  607. {
  608. position: relative;
  609. }
  610. ul.treelist li div.treetoggle
  611. {
  612. position: absolute;
  613. left: 8px;
  614. top: 2px;
  615. width: 14px;
  616. height: 16px;
  617. cursor: pointer;
  618. }
  619. ul.treelist ul li div.treetoggle
  620. {
  621. left: 25px;
  622. }
  623. ul.treelist ul ul li div.treetoggle
  624. {
  625. left: 42px;
  626. }
  627. ul.treelist li div.collapsed
  628. {
  629. background: url(images/icons/collapsed.png?v=45aa.97) bottom right no-repeat;
  630. }
  631. ul.treelist li div.expanded
  632. {
  633. background: url(images/icons/expanded.png?v=f647.107) bottom right no-repeat;
  634. }
  635. ul.treelist,
  636. ul.treelist li ul
  637. {
  638. list-style: none;
  639. margin: 0;
  640. padding: 0;
  641. background-color: #FFFFFF;
  642. }
  643. ul.treelist li ul
  644. {
  645. border-top: 1px solid #EBEBEB;
  646. }
  647. ul.treelist li
  648. {
  649. display: block;
  650. font-size: 11px;
  651. border-bottom: 1px solid #EBEBEB;
  652. white-space: nowrap;
  653. overflow: hidden;
  654. }
  655. ul.treelist li a
  656. {
  657. cursor: default;
  658. display: block;
  659. padding-left: 25px;
  660. padding-top: 2px;
  661. padding-bottom: 2px;
  662. height: 16px;
  663. line-height: 16px;
  664. text-decoration: none;
  665. white-space: nowrap;
  666. }
  667. ul.treelist li ul li a
  668. {
  669. padding-left: 45px;
  670. }
  671. ul.treelist ul ul li a
  672. {
  673. padding-left: 65px;
  674. }
  675. ul.treelist li ul li:last-child
  676. {
  677. border-bottom: 0;
  678. }
  679. ul.treelist li.selected > a,
  680. ul.treelist li.selected > div a
  681. {
  682. color: #FFF;
  683. font-weight: bold;
  684. background-color: #929292;
  685. }
  686. ul.treelist li.droptarget
  687. {
  688. background-color: #FFFFA6;
  689. }
  690. /***** folders list *****/
  691. .folderlist li ul li:last-child
  692. {
  693. border-bottom: 0 none;
  694. }
  695. .folderlist li.inbox a
  696. {
  697. background-position: 5px -18px;
  698. }
  699. .folderlist li.drafts a
  700. {
  701. background-position: 5px -36px;
  702. }
  703. .folderlist li.sent a
  704. {
  705. background-position: 5px -53px;
  706. }
  707. .folderlist li.junk a
  708. {
  709. background-position: 5px -72px;
  710. }
  711. .folderlist li.trash a
  712. {
  713. background-position: 5px -180px;
  714. }
  715. .folderlist li.trash.empty a
  716. {
  717. background-position: 5px -90px;
  718. }
  719. .folderlist li a
  720. {
  721. cursor: default;
  722. display: block;
  723. position: relative;
  724. padding-left: 25px;
  725. padding-top: 2px;
  726. padding-bottom: 2px;
  727. text-decoration: none;
  728. height: 15px;
  729. background: url(images/icons/folders.png?v=d9d2.5356) 5px 1px no-repeat;
  730. }
  731. .folderlist li.virtual > a
  732. {
  733. color: #666;
  734. }
  735. .folderlist li.selected,
  736. .folderlist li.droptarget li.selected
  737. {
  738. background-color: #929292;
  739. }
  740. .folderlist li.selected > a,
  741. .folderlist li.droptarget li.selected a
  742. {
  743. color: #FFF;
  744. font-weight: bold;
  745. }
  746. .folderlist li.droptarget
  747. {
  748. background-color: #FFFFA6;
  749. }
  750. /* styles for nested folders */
  751. .folderlist ul {
  752. list-style: none;
  753. padding: 0;
  754. margin: 0;
  755. border-top: 1px solid #EBEBEB;
  756. background-color: #FFF;
  757. font-weight: normal;
  758. }
  759. .folderlist li.mailbox ul li a {
  760. padding-left: 40px; /* 24 + 1 x 16 */
  761. background-position: 20px 1px; /* 4 + 1 x 16 */
  762. }
  763. .folderlist li.mailbox ul li div.treetoggle {
  764. left: 23px !important;
  765. }
  766. .folderlist li.mailbox ul ul li.mailbox a {
  767. padding-left: 56px; /* 2x */
  768. background-position: 36px 1px;
  769. }
  770. .folderlist li.mailbox ul ul li div.treetoggle {
  771. left: 39px !important;
  772. }
  773. .folderlist li.mailbox ul ul ul li.mailbox a {
  774. padding-left: 72px; /* 3x */
  775. background-position: 52px 1px;
  776. }
  777. .folderlist li.mailbox ul ul ul li div.treetoggle {
  778. left: 55px !important;
  779. }
  780. .folderlist li.mailbox ul ul ul ul li.mailbox a {
  781. padding-left: 88px; /* 4x */
  782. background-position: 68px 1px;
  783. }
  784. .folderlist li.mailbox ul ul ul ul li div.treetoggle {
  785. left: 71px !important;
  786. }
  787. /* indent folders on levels > 4 */
  788. .folderlist li.mailbox ul ul ul ul ul li {
  789. padding-left: 16px;
  790. }
  791. .folderlist li.mailbox ul ul ul ul ul li div.treetoggle {
  792. left: 87px !important;
  793. }
  794. .folderlist li.mailbox ul li.drafts a
  795. {
  796. background-position: 21px -36px;
  797. }
  798. .folderlist li.mailbox ul li.sent a
  799. {
  800. background-position: 21px -53px;
  801. }
  802. .folderlist li.mailbox ul li.junk a
  803. {
  804. background-position: 21px -72px;
  805. }
  806. .folderlist li.mailbox ul li.trash a
  807. {
  808. background-position: 21px -180px;
  809. }
  810. .folderlist li.mailbox ul li.trash.empty a
  811. {
  812. background-position: 21px -90px;
  813. }
  814. /***** mac-style quicksearch field *****/
  815. div.searchbox,
  816. #quicksearchbar
  817. {
  818. position: relative;
  819. width: 190px;
  820. height: 20px;
  821. text-align: right;
  822. background: url(images/searchfield.gif?v=aaf8.313) top left no-repeat;
  823. }
  824. #quicksearchbar
  825. {
  826. position: absolute;
  827. top: 55px;
  828. right: 10px;
  829. }
  830. #searchreset,
  831. div.searchbox a.searchreset
  832. {
  833. position: absolute;
  834. top: 3px;
  835. right: 12px;
  836. text-decoration: none;
  837. }
  838. #searchmenulink,
  839. div.searchbox a.searchmenu,
  840. div.searchbox a.searchicon
  841. {
  842. position: absolute;
  843. top: 3px;
  844. right: 168px;
  845. }
  846. div.searchbox a.searchreset
  847. {
  848. display: block;
  849. width: 14px;
  850. height: 14px;
  851. overflow: hidden;
  852. white-space: nowrap;
  853. text-indent: 50000px;
  854. background: url(images/icons/reset.gif?v=a31d.164) top left no-repeat;
  855. }
  856. div.searchbox a.searchicon
  857. {
  858. display: inline-block;
  859. width: 16px;
  860. height: 16px;
  861. overflow: hidden;
  862. background: url(images/icons/glass.png?v=6b06.406) top left no-repeat;
  863. }
  864. #quicksearchbar img
  865. {
  866. vertical-align: middle;
  867. }
  868. #quicksearchbox,
  869. div.searchbox > input
  870. {
  871. position: absolute;
  872. top: 2px;
  873. left: 24px;
  874. width: 140px;
  875. height: 15px;
  876. font-size: 11px;
  877. padding: 0px;
  878. border: none;
  879. outline: none;
  880. }
  881. .propform div.prop
  882. {
  883. margin-bottom: 0.5em;
  884. }
  885. .propform div.prop.block label
  886. {
  887. display: block;
  888. margin-bottom: 2px;
  889. }
  890. .propform div.prop.block input,
  891. .propform div.prop.block textarea
  892. {
  893. width: 97%;
  894. }
  895. .listsearchbox
  896. {
  897. border-bottom: solid 1px #ddd;
  898. padding: 2px 4px 1px;
  899. display: none;
  900. background-color: #f2f2f2;
  901. }
  902. .listsearchbox a.iconbutton.reset
  903. {
  904. background: url(images/icons/reset.gif?v=a31d.164) no-repeat 0 0;
  905. width: 13px;
  906. height: 13px;
  907. text-indent: 50000px;
  908. position: absolute;
  909. top: 3px;
  910. left: 165px;
  911. overflow: hidden;
  912. }
  913. /***** roundcube webmail pre-defined classes *****/
  914. #rcmversion
  915. {
  916. position: absolute;
  917. bottom: 10px;
  918. right: 20px;
  919. text-align: right;
  920. white-space: nowrap;
  921. font-size: 8pt;
  922. color: #999;
  923. }
  924. #rcmdraglayer
  925. {
  926. min-width: 300px;
  927. width: auto !important;
  928. width: 300px;
  929. border: 1px solid #999999;
  930. background-color: #fff;
  931. padding-left: 8px;
  932. padding-right: 8px;
  933. padding-top: 3px;
  934. padding-bottom: 3px;
  935. font-size: 11px;
  936. white-space: nowrap;
  937. opacity: 0.82;
  938. border-radius: 3px;
  939. -moz-border-radius: 3px;
  940. -webkit-border-radius: 3px;
  941. box-shadow: 1px 1px 12px #999;
  942. -moz-box-shadow: 1px 1px 12px #999;
  943. -webkit-box-shadow: #999 1px 1px 12px;
  944. }
  945. .draglayercopy:before
  946. {
  947. position: absolute;
  948. bottom: -5px;
  949. left: -6px;
  950. content: " ";
  951. width: 14px;
  952. height: 14px;
  953. background: url(images/messageactions.png?v=d93e.3223) -2px -128px no-repeat;
  954. }
  955. a.rcmContactAddress
  956. {
  957. text-decoration: none;
  958. }
  959. a.rcmContactAddress:hover
  960. {
  961. text-decoration: underline;
  962. }
  963. #rcmKSearchpane
  964. {
  965. background-color: #F9F9F9;
  966. border: 1px solid #CCCCCC;
  967. }
  968. #rcmKSearchpane ul
  969. {
  970. margin: 0px;
  971. padding: 2px;
  972. list-style-image: none;
  973. list-style-type: none;
  974. }
  975. #rcmKSearchpane ul li
  976. {
  977. display: block;
  978. height: 16px;
  979. font-size: 11px;
  980. padding-left: 6px;
  981. padding-top: 2px;
  982. padding-right: 6px;
  983. white-space: nowrap;
  984. cursor: pointer;
  985. }
  986. #rcmKSearchpane ul li.selected,
  987. #pagejump-selector ul li.selected
  988. {
  989. color: #ffffff;
  990. background-color: #CC3333;
  991. }
  992. #login-form
  993. {
  994. margin-left: auto;
  995. margin-right: auto;
  996. margin-top: 50px;
  997. width: 400px;
  998. border: 1px solid #999;
  999. }
  1000. #login-form table td.title
  1001. {
  1002. text-align: right;
  1003. white-space: nowrap;
  1004. }
  1005. #login-form table
  1006. {
  1007. width: 1%;
  1008. margin: auto;
  1009. }
  1010. #login-form table td.input input
  1011. {
  1012. width: 200px;
  1013. }
  1014. #login-bottomline
  1015. {
  1016. width: 400px;
  1017. margin: 5em auto;
  1018. font-size: 85%;
  1019. text-align: center;
  1020. color: #666;
  1021. }
  1022. #login-noscriptwarning
  1023. {
  1024. margin: 2em auto 0 auto;
  1025. width: 400px;
  1026. color: #cf2734;
  1027. font-weight: bold;
  1028. }
  1029. .disabled,
  1030. a.disabled
  1031. {
  1032. color: #999;
  1033. }
  1034. font.bold
  1035. {
  1036. font-weight: bold;
  1037. }
  1038. .formbuttons
  1039. {
  1040. text-align: center;
  1041. }
  1042. /***** onclick menu list *****/
  1043. ul.toolbarmenu
  1044. {
  1045. margin: -4px 0 -4px 0;
  1046. padding: 0;
  1047. list-style: none;
  1048. }
  1049. ul.toolbarmenu li
  1050. {
  1051. font-size: 11px;
  1052. white-space: nowrap;
  1053. min-width: 130px;
  1054. margin: 2px -4px;
  1055. }
  1056. ul.toolbarmenu li a
  1057. {
  1058. display: block;
  1059. color: #a0a0a0;
  1060. padding: 3px 12px 3px 28px;
  1061. text-decoration: none;
  1062. min-height: 14px;
  1063. line-height: 14px;
  1064. }
  1065. ul.toolbarmenu li a.active,
  1066. ul.toolbarmenu li a.active:active,
  1067. ul.toolbarmenu li a.active:visited
  1068. {
  1069. color: #333;
  1070. }
  1071. ul.toolbarmenu li input
  1072. {
  1073. vertical-align: middle;
  1074. }
  1075. ul.toolbarmenu li hr
  1076. {
  1077. color: #ccc;
  1078. width: 130px;
  1079. height: 1px;
  1080. margin: 2px 1px 2px 1px;
  1081. }
  1082. ul.toolbarmenu li img
  1083. {
  1084. float: left;
  1085. margin: 0 2px;
  1086. }
  1087. div.popupmenu ul li.separator_below,
  1088. ul.toolbarmenu li.separator_below
  1089. {
  1090. border-bottom: 1px solid #ccc;
  1091. margin-bottom: 2px;
  1092. padding-bottom: 2px;
  1093. }
  1094. div.popupmenu ul li.separator_above,
  1095. ul.toolbarmenu li.separator_above
  1096. {
  1097. border-top: 1px solid #ccc;
  1098. margin-top: 2px;
  1099. padding-top: 2px;
  1100. }
  1101. #searchmenu
  1102. {
  1103. width: 160px;
  1104. }
  1105. #searchmenu ul.toolbarmenu
  1106. {
  1107. margin: 0;
  1108. }
  1109. #searchmenu ul.toolbarmenu li
  1110. {
  1111. margin: 1px 4px 1px;
  1112. }
  1113. #searchmenu ul.toolbarmenu li label
  1114. {
  1115. padding: 2px 0;
  1116. color: black;
  1117. }
  1118. #searchmenu ul.toolbarmenu li label.comment
  1119. {
  1120. color: #999;
  1121. }
  1122. #searchmenu select
  1123. {
  1124. width: 100%;
  1125. }
  1126. #pagejump-selector
  1127. {
  1128. max-height: 250px;
  1129. overflow-x: hidden;
  1130. }
  1131. #pagejump-selector ul li
  1132. {
  1133. min-width: 45px;
  1134. padding: 2px 5px;
  1135. cursor: default;
  1136. }
  1137. /*** folder selector ***/
  1138. #folder-selector li a
  1139. {
  1140. padding: 0;
  1141. }
  1142. #folder-selector li a span
  1143. {
  1144. background: url(images/icons/folders.png?v=d9d2.5356) no-repeat 6px 0;
  1145. display: block;
  1146. height: 15px;
  1147. min-height: 14px;
  1148. padding: 2px 4px 2px 28px;
  1149. overflow: hidden;
  1150. max-width: 120px;
  1151. text-overflow: ellipsis;
  1152. }
  1153. #folder-selector li a.virtual
  1154. {
  1155. color: #A0A0A0;
  1156. }
  1157. #folder-selector li a.active:hover span
  1158. {
  1159. color: white;
  1160. }
  1161. #folder-selector li a.inbox span
  1162. {
  1163. background-position: 6px -18px;
  1164. }
  1165. #folder-selector li a.drafts span
  1166. {
  1167. background-position: 6px -37px;
  1168. }
  1169. #folder-selector li a.sent span
  1170. {
  1171. background-position: 6px -54px;
  1172. }
  1173. #folder-selector li a.trash span
  1174. {
  1175. background-position: 6px -91px;
  1176. }
  1177. #folder-selector li a.junk span
  1178. {
  1179. background-position: 6px -73px;
  1180. }
  1181. /***** tabbed interface elements *****/
  1182. div.tabsbar,
  1183. #tabsbar
  1184. {
  1185. position: absolute;
  1186. top: 50px;
  1187. left: 220px;
  1188. right: 20px;
  1189. height: 22px;
  1190. border-bottom: 1px solid #999999;
  1191. white-space: nowrap;
  1192. }
  1193. div.tabsbar
  1194. {
  1195. top: 35px;
  1196. left: 12px;
  1197. right: 12px;
  1198. }
  1199. span.tablink,
  1200. span.tablink-selected
  1201. {
  1202. float: left;
  1203. height: 23px !important;
  1204. height: 22px;
  1205. overflow: hidden;
  1206. background: url(images/tabs-left.gif?v=0541.219) top left no-repeat;
  1207. }
  1208. span.tablink
  1209. {
  1210. cursor: pointer;
  1211. }
  1212. span.tablink-selected
  1213. {
  1214. cursor: default;
  1215. background-position: 0px -23px;
  1216. }
  1217. span.tablink a,
  1218. span.tablink-selected a
  1219. {
  1220. display: inline-block;
  1221. padding: 5px 10px 0 5px;
  1222. margin-left: 5px;
  1223. height: 23px;
  1224. color: #555555;
  1225. max-width: 185px;
  1226. text-decoration: none;
  1227. overflow: hidden;
  1228. text-overflow: ellipsis;
  1229. -o-text-overflow: ellipsis;
  1230. background: url(images/tabs-right.gif?v=5414.733) top right no-repeat;
  1231. }
  1232. span.tablink-selected a
  1233. {
  1234. cursor: inherit;
  1235. color: #000000;
  1236. background-position: right -23px;
  1237. }
  1238. fieldset
  1239. {
  1240. margin-bottom: 1em;
  1241. border: 1px solid #999999;
  1242. padding: 4px 8px 9px 8px;
  1243. }
  1244. legend
  1245. {
  1246. color: #999999;
  1247. }
  1248. fieldset.tabbed
  1249. {
  1250. margin-top: 22px;
  1251. padding-top: 12px;
  1252. }
  1253. .quota_text {
  1254. text-align: center;
  1255. font-size: 10px;
  1256. color: #666;
  1257. border: 1px solid #999;
  1258. cursor: default;
  1259. }
  1260. .quota_bg { background-color: white; }
  1261. .quota_high { background: url(images/quota-colors.png?v=c1e9.287) repeat-x 0 -28px #f90509; }
  1262. .quota_mid { background: url(images/quota-colors.png?v=c1e9.287) repeat-x 0 -14px #e3e909; }
  1263. .quota_low { background: url(images/quota-colors.png?v=c1e9.287) repeat-x 0 0px #05f905; }
  1264. .quota_text_high { color: white; }
  1265. .quota_text_mid { color: #666; }
  1266. .quota_text_low { color: #666; }
  1267. table.quota-info {
  1268. border-spacing: 0;
  1269. border-collapse: collapse;
  1270. table-layout: fixed;
  1271. margin: 2px;
  1272. }
  1273. table.quota-info td,
  1274. table.quota-info th {
  1275. border: 1px solid #999;
  1276. padding: 2px 3px;
  1277. text-align: center;
  1278. min-width: 80px;
  1279. color: #333;
  1280. font-size: 11px;
  1281. }
  1282. table.quota-info th {
  1283. font-weight: bold;
  1284. background-color: #ddd;
  1285. }
  1286. table.quota-info td.name {
  1287. text-align: left;
  1288. }
  1289. table.quota-info td.root {
  1290. font-style: italic;
  1291. }
  1292. /********** TinyMCE styles **********/
  1293. .mce-btn-small button
  1294. {
  1295. height: 22px;
  1296. }
  1297. .mce-btn-small i
  1298. {
  1299. line-height: 16px !important;
  1300. vertical-align: text-top !important;
  1301. }
  1302. .mce-combobox button
  1303. {
  1304. padding: 6px 8px !important;
  1305. }
  1306. .mce-tinymce
  1307. {
  1308. border-radius: 0 !important;
  1309. {
  1310. .mce-panel.mce-toolbar-grp
  1311. {
  1312. border: 0 !important;
  1313. }
  1314. #image-selector-form.droptarget {
  1315. background: url(images/filedrop.png?v=deab.605) center bottom no-repeat;
  1316. }
  1317. #image-selector-form.droptarget.hover
  1318. {
  1319. background-color: #F0F0EE;
  1320. box-shadow: 0 0 5px 0 #999;
  1321. -moz-box-shadow: 0 0 5px 0 #999;
  1322. -o-box-shadow: 0 0 5px 0 #999;
  1323. }