Actions

J1.5

Difference between revisions of "Customising the JA Purity template/template.css"

From Joomla! Documentation

< J1.5:Customising the JA Purity template
(Added Template CSS files source)
 
m
Line 2,293: Line 2,293:
 
}
 
}
 
</source>
 
</source>
 +
<noinclude>
 +
[[Category:Beginners]]
 +
[[Category:JA Purity template]]
 +
[[Category:Tutorials]]
 +
</noinclude>

Revision as of 08:38, 13 June 2009

Replacement filing cabinet.png
This Namespace has been archived - Please Do Not Edit or Create Pages in this namespace. Pages contain information for a Joomla! version which is no longer supported. It exists only as a historical reference, will not be improved and its content may be incomplete.


CSS Files

ja_purity/css/template.css

  1. /* COMMON STYLE
    
  2. --------------------------------------------------------- */
    
  3. html, body, form, fieldset {
    
  4.         margin: 0;
    
  5.         padding: 0;
    
  6. }
    
  7.  
    
  8. body {
    
  9.         color: #000000;
    
  10.         background: #FFFFFF;
    
  11.         font-family: Arial, Helvetica, sans-serif;
    
  12.         line-height: 150%;
    
  13. }
    
  14.  
    
  15. body#bd {
    
  16.         color: #333333;
    
  17.         background: #F2F2F2;
    
  18. }
    
  19.  
    
  20. body.contentpane {
    
  21.         width: auto; /* Printable Page */
    
  22.         margin: 1em 2em;
    
  23.         line-height: 1.3em;
    
  24.         margin: 0px 0px 0px 0px;
    
  25.         font-size: 12px;
    
  26.         color: #333;
    
  27. }
    
  28.  
    
  29. body.fs1 {
    
  30.         font-size: 10px;
    
  31. }
    
  32.  
    
  33. body.fs2{
    
  34.         font-size: 11px;
    
  35. }
    
  36.  
    
  37. body.fs3{
    
  38.         font-size: 12px;
    
  39. }
    
  40.  
    
  41. body.fs4{
    
  42.         font-size: 13px;
    
  43. }
    
  44.  
    
  45. body.fs5{
    
  46.         font-size: 14px;
    
  47. }
    
  48.  
    
  49. body.fs6{
    
  50.         font-size: 15px;
    
  51. }
    
  52.  
    
  53. /* Normal link */
    
  54. a {
    
  55.         color: #006699;
    
  56.         text-decoration: underline;
    
  57. }
    
  58.  
    
  59. a:hover, a:active, a:focus {
    
  60.         color: #333333;
    
  61.         text-decoration: underline;
    
  62. }
    
  63.  
    
  64. /* Title text */
    
  65. .contentheading, .componentheading, .blog_more strong, h1, h2, h3, h4 {
    
  66.         font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    
  67. }
    
  68.  
    
  69. /* Small text */
    
  70. small, .small, .smalldark, .mosimage_caption, .createby, .createdate, .modifydate, a.readon, .img_caption {
    
  71.         color: #666666;
    
  72.         font-size: 92%;
    
  73. }
    
  74.  
    
  75. /* Heading */
    
  76. h1 {
    
  77.         font-size: 180%;
    
  78. }
    
  79.  
    
  80. h2 {
    
  81.         font-size: 150%;
    
  82. }
    
  83.  
    
  84. h3 {
    
  85.         font-size: 125%;
    
  86. }
    
  87.  
    
  88. h4 {
    
  89.         font-size: 100%;
    
  90.         text-transform: uppercase;
    
  91. }
    
  92.  
    
  93. p, pre, blockquote, ul, ol, h1, h2, h3, h4, h5, h6 {
    
  94.         margin: 1em 0;
    
  95.         padding: 0;
    
  96. }
    
  97.  
    
  98. ul {
    
  99.         list-style: none;
    
  100. }
    
  101.  
    
  102. ul li {
    
  103.         padding-left: 30px;
    
  104.         background: url(../images/bullet.gif) no-repeat 18px 8px;
    
  105.         line-height: 180%;
    
  106. }
    
  107.  
    
  108. ol li {
    
  109.         margin-left: 35px;
    
  110.         line-height: 180%;
    
  111. }
    
  112.  
    
  113. th {
    
  114.         padding: 5px;
    
  115.         font-weight: bold;
    
  116.         text-align: left;
    
  117. }
    
  118.  
    
  119. fieldset {
    
  120.         border: none;
    
  121.         padding: 10px 5px;
    
  122.         background: url(../images/hdot2.gif) repeat-x top;
    
  123. }
    
  124.  
    
  125. fieldset a {
    
  126.         font-weight: bold;
    
  127. }
    
  128.  
    
  129. hr {
    
  130.         border-top: 1px solid #CCCCCC;
    
  131.         border-right: 0;
    
  132.         border-left: 0;
    
  133.         border-bottom: 0;
    
  134.         height: 1px;
    
  135. }
    
  136.  
    
  137. td, div {
    
  138.         font-size: 100%;
    
  139. }
    
  140.  
    
  141. img {
    
  142.         border: none;
    
  143. }
    
  144. /* FORM
    
  145. --------------------------------------------------------- */
    
  146. form {
    
  147.         margin: 0;
    
  148.         padding: 0;
    
  149. }
    
  150.  
    
  151. form label {
    
  152.         cursor: pointer;
    
  153. }
    
  154.  
    
  155. input, select, textarea, .inputbox {
    
  156.         padding: 3px 5px;
    
  157.         font-family: Tahoma, Arial, Helvetica, sans-serif;
    
  158.         font-size: 100%;
    
  159. }
    
  160.  
    
  161. .button {
    
  162.         padding: 3px 5px;
    
  163.         border: 1px solid #333333;
    
  164.         background: url(../images/grad1.gif) repeat-x top #333333;
    
  165.         color: #CCCCCC;
    
  166.         font-size: 85%;
    
  167.         text-transform: uppercase;
    
  168. }
    
  169.  
    
  170. .button:hover, .button:focus {
    
  171.         border: 1px solid #999999;
    
  172.         background: #333333;
    
  173.         color: #FFFFFF;
    
  174. }
    
  175.  
    
  176. * html .button {
    
  177.         padding: 2px 0 !important; /*IE 6*/
    
  178. }
    
  179.  
    
  180. *+html .button {
    
  181.         padding: 2px 0 !important; /*IE 7*/
    
  182. }
    
  183.  
    
  184. .inputbox {
    
  185.         border: 1px solid #CCCCCC;
    
  186.         background: #FFFFFF;
    
  187. }
    
  188.  
    
  189. .inputbox:hover, .inputbox:focus {
    
  190.         background: #FFFFCC;
    
  191. }
    
  192.  
    
  193. /* BONUS TYPOGRAPHY STYLES
    
  194. --------------------------------------------------------- */
    
  195. pre, .code {
    
  196.         padding: 10px 15px;
    
  197.         margin: 5px 0 15px;
    
  198.         border-left: 5px solid #999999;
    
  199.         background: #FFFFFF;
    
  200.         font: 1em/1.5 "Courier News", monospace;
    
  201. }
    
  202.  
    
  203. blockquote {
    
  204.         padding: 1em 40px 1em 15px;
    
  205. }
    
  206.  
    
  207. blockquote span.open {
    
  208.         padding: 0 0 0 20px;
    
  209.         background: url(../images/so-q.gif) no-repeat left top;
    
  210. }
    
  211.  
    
  212. blockquote span.close {
    
  213.         padding: 0 20px 0 0;
    
  214.         background: url(../images/sc-q.gif) no-repeat bottom right;
    
  215. }
    
  216.  
    
  217. /* Quote hilight */
    
  218. .quote-hilite {
    
  219.         padding: 10px 15px;
    
  220.         margin: 0;
    
  221.         border: 1px solid #CACACC;
    
  222.         background: #FFFFFF;
    
  223. }
    
  224.  
    
  225. /* Small quote */
    
  226. .small-quote {
    
  227.         margin: 0;
    
  228.         padding: 0;
    
  229.         background: none;
    
  230. }
    
  231.  
    
  232. .small-quote span.open-quote {
    
  233.         margin: 0;
    
  234.         padding-left: 20px;
    
  235.         background: url(../images/so-q.gif) no-repeat center left;
    
  236. }
    
  237.  
    
  238. .small-quote span.close-quote {
    
  239.         margin: 0;
    
  240.         padding-right: 20px;
    
  241.         background: url(../images/sc-q.gif) no-repeat center right;
    
  242. }
    
  243.  
    
  244. .small-quote span.author {
    
  245.         padding: 2px 5px 2px 20px;
    
  246.         border-top: 1px solid #DCDDE0;
    
  247.         margin: 0.5em 0 0;
    
  248.         display: block;
    
  249.         background: url(../images/author.gif) no-repeat 5px 4px #EAEBEE;
    
  250.         font-size: 90%;
    
  251.         text-transform: uppercase;
    
  252. }
    
  253.  
    
  254. /* Rropcap */
    
  255. .dropcap {
    
  256.         float: left;
    
  257.         padding: 4px 8px 0 0;
    
  258.         display: block;
    
  259.         color: #999999;
    
  260.         font: 50px/40px Georgia, Times, serif;
    
  261. }
    
  262.  
    
  263. /* Tips, Error, Message, Hightlight*/
    
  264. p.error {
    
  265.         padding-left: 25px;
    
  266.         color: #BF0000;
    
  267.         background: url(../images/icon-error.gif) no-repeat top left;
    
  268. }
    
  269.  
    
  270. p.message {
    
  271.         padding-left: 25px;
    
  272.         color: #006699;
    
  273.         background: url(../images/icon-info.gif) no-repeat top left;
    
  274. }
    
  275.  
    
  276. p.tips {
    
  277.         padding-left: 25px;
    
  278.         color: #EE9600;
    
  279.         background: url(../images/icon-tips.gif) no-repeat top left;
    
  280. }
    
  281.  
    
  282. .highlight {
    
  283.         padding: 1px 5px;
    
  284.         background: #FFFFCC;
    
  285.         font-weight: bold;
    
  286. }
    
  287.  
    
  288. /* Note Style */
    
  289. p.stickynote {
    
  290.         padding: 10px 0px 10px 40px;
    
  291.         border: 1px solid #CACACC;
    
  292.         background: url(../images/sticky-bg.gif) no-repeat 5px center #FFFFFF;
    
  293. }
    
  294.  
    
  295. p.download {
    
  296.         padding: 10px 0px 10px 40px;
    
  297.         border: 1px solid #CACACC;
    
  298.         background: url(../images/download-bg.gif) no-repeat 5px center #FFFFFF;
    
  299. }
    
  300.  
    
  301. .blocknumber {
    
  302.         clear: both;
    
  303.         padding: 5px 15px 10px;
    
  304.         position: relative;
    
  305. }
    
  306.  
    
  307. /* Check list */
    
  308. ul.checklist {
    
  309.         list-style: none;
    
  310. }
    
  311.  
    
  312. ul.checklist li {
    
  313.         margin-left: 15px;
    
  314.         padding: 0 0 5px 20px;
    
  315.         background: url(../images/checklist-bg.gif) no-repeat 0 3px;
    
  316. }
    
  317.  
    
  318. /* Small checklist */
    
  319. ul.small-checklist {
    
  320.         list-style: none;
    
  321. }
    
  322.  
    
  323. ul.small-checklist li {
    
  324.         margin-left: 15px;
    
  325.         padding: 0 0 5px 20px;
    
  326.         background: url(../images/icon_list.gif) no-repeat 0 3px;
    
  327. }
    
  328.  
    
  329. /* Check list */
    
  330. ul.stars {
    
  331.         list-style: none;
    
  332. }
    
  333.  
    
  334. ul.stars li {
    
  335.         margin-left: 15px;
    
  336.         padding: 0px 0 5px 20px;
    
  337.         background: url(../images/star-bg.gif) no-repeat 0 3px;
    
  338. }
    
  339.  
    
  340. /* Bignumber */
    
  341. .bignumber {
    
  342.         float: left;
    
  343.         margin-right: 8px;
    
  344.         padding: 6px 7px;
    
  345.         display: block;
    
  346.         background: url(../images/ol-bg.gif) no-repeat top left;
    
  347.         color: #7BA566;
    
  348.         font: bold 20px/normal Arial, sans-serif;
    
  349. }
    
  350.  
    
  351. /* Talking box. Thinking box. */
    
  352. div.bubble1, div.bubble2, div.bubble3, div.bubble4 {
    
  353.         margin: 15px 0;
    
  354. }
    
  355.  
    
  356. div.bubble1 span.author,
    
  357. div.bubble2 span.author,
    
  358. div.bubble3 span.author,
    
  359. div.bubble4 span.author {
    
  360.         padding-left: 15px;
    
  361.         margin-left: 15px;
    
  362.         background: url(../images/author.gif) no-repeat center left;
    
  363.         font-weight: bold;
    
  364. }
    
  365.  
    
  366. div.bubble1 div {
    
  367.         margin: 0;
    
  368.         width: 100%;
    
  369.         background: url(../images/bub1-br.gif) no-repeat bottom right;
    
  370. }
    
  371.  
    
  372. div.bubble1 div div {
    
  373.         background: url(../images/bub1-bl.gif) no-repeat bottom left;
    
  374. }
    
  375.  
    
  376. div.bubble1 div div div {
    
  377.         background: url(../images/bub1-tr.gif) no-repeat top right;
    
  378. }
    
  379.  
    
  380. div.bubble1 div div div div {
    
  381.         background: url(../images/bub1-tl.gif) no-repeat top left;
    
  382. }
    
  383.  
    
  384. div.bubble1 div div div div div {
    
  385.         margin: 0;
    
  386.         padding: 15px 15px 30px 15px;
    
  387.         width: auto;
    
  388. }
    
  389.  
    
  390. div.bubble2 div {
    
  391.         margin: 0;
    
  392.         width: 100%;
    
  393.         background: url(../images/bub2-br.gif) no-repeat bottom right;
    
  394. }
    
  395.  
    
  396. div.bubble2 div div {
    
  397.         background: url(../images/bub2-bl.gif) no-repeat bottom left;
    
  398. }
    
  399.  
    
  400. div.bubble2 div div div {
    
  401.         background: url(../images/bub2-tr.gif) no-repeat top right;
    
  402. }
    
  403.  
    
  404. div.bubble2 div div div div {
    
  405.         background: url(../images/bub2-tl.gif) no-repeat top left;
    
  406. }
    
  407.  
    
  408. div.bubble2 div div div div div {
    
  409.         margin: 0;
    
  410.         padding: 15px 15px 35px 15px;
    
  411.         width: auto;
    
  412. }
    
  413.  
    
  414. div.bubble3 div {
    
  415.         margin: 0;
    
  416.         width: 100%;
    
  417.         background: url(../images/bub3-br.gif) no-repeat bottom right;
    
  418. }
    
  419.  
    
  420. div.bubble3 div div {
    
  421.         background: url(../images/bub3-bl.gif) no-repeat bottom left;
    
  422. }
    
  423.  
    
  424. div.bubble3 div div div {
    
  425.         background: url(../images/bub3-tr.gif) no-repeat top right;
    
  426. }
    
  427.  
    
  428. div.bubble3 div div div div {
    
  429.         background: url(../images/bub3-tl.gif) no-repeat top left;
    
  430. }
    
  431.  
    
  432. div.bubble3 div div div div div {
    
  433.         margin: 0;
    
  434.         padding: 15px 15px 50px 15px;
    
  435.         width: auto;
    
  436. }
    
  437.  
    
  438. div.bubble4 div {
    
  439.         margin: 0;
    
  440.         width: 100%;
    
  441.         background: url(../images/bub4-br.gif) no-repeat bottom right;
    
  442. }
    
  443.  
    
  444. div.bubble4 div div {
    
  445.         background: url(../images/bub4-bl.gif) no-repeat bottom left;
    
  446. }
    
  447.  
    
  448. div.bubble4 div div div {
    
  449.         background: url(../images/bub4-tr.gif) no-repeat top right;
    
  450. }
    
  451.  
    
  452. div.bubble4 div div div div {
    
  453.         background: url(../images/bub4-tl.gif) no-repeat top left;
    
  454. }
    
  455.  
    
  456. div.bubble4 div div div div div {
    
  457.         margin: 0;
    
  458.         padding: 15px 15px 55px 15px;
    
  459.         width: auto;
    
  460. }
    
  461.  
    
  462. /* Legend */
    
  463. .legend-title {
    
  464.         margin: 0;
    
  465.         padding: 0 3px;
    
  466.         float: left;
    
  467.         display: block;
    
  468.         background: #F6F6F6;
    
  469.         font-weight: bold;
    
  470.         position: absolute;
    
  471.         top: -10px;
    
  472.         left: 7px;
    
  473. }
    
  474.  
    
  475. .legend {
    
  476.         margin: 20px 0;
    
  477.         padding: 0 10px;
    
  478.         border: 1px solid #CACACC;
    
  479.         background: #FFFFFF;
    
  480.         position: relative;
    
  481. }
    
  482.  
    
  483. /* JOOMLA STYLE
    
  484. --------------------------------------------------------- */
    
  485. table.blog {
    
  486. }
    
  487.  
    
  488. .article_separator {
    
  489.         clear: both;
    
  490.         display: block;
    
  491.         height: 20px;
    
  492. }
    
  493.  
    
  494. .article_column {
    
  495. }
    
  496.  
    
  497. .column_separator {
    
  498.         padding: 0 25px;
    
  499. }
    
  500.  
    
  501. /* content tables */
    
  502. td.sectiontableheader {
    
  503.   padding: 4px;
    
  504.   border-right: 1px solid #fff;
    
  505. }
    
  506.  
    
  507. tr.sectiontableentry0 td,
    
  508. tr.sectiontableentry1 td,
    
  509. tr.sectiontableentry2 td {
    
  510.   padding: 4px;
    
  511. }
    
  512.  
    
  513. td.sectiontableentry0,
    
  514. td.sectiontableentry1,
    
  515. td.sectiontableentry2 {
    
  516.   padding: 3px;
    
  517. }
    
  518.  
    
  519. table.contentpane {
    
  520.         border: none;
    
  521.         width: 100%;
    
  522. }
    
  523.  
    
  524. table.contentpaneopen {
    
  525.         border: none;
    
  526.         border-collapse: collapse;
    
  527.         border-spacing: 0;
    
  528. }
    
  529.  
    
  530. table.contenttoc {
    
  531.         margin: 0 0 10px 10px;
    
  532.         padding: 0;
    
  533.         width: 35%;
    
  534.         float: right;
    
  535. }
    
  536.  
    
  537. table.contenttoc a {
    
  538.         text-decoration: none;
    
  539. }
    
  540.  
    
  541. table.contenttoc td {
    
  542.         padding: 1px 5px 1px 25px;
    
  543.         background: url(../images/bullet-list.gif) no-repeat 5% 50%;
    
  544. }
    
  545.  
    
  546. table.contenttoc th {
    
  547.         padding: 0 0 3PX;
    
  548.         border-bottom: 1px solid #CCCCCC;
    
  549.         text-indent: 5px;
    
  550. }
    
  551.  
    
  552. table.poll {
    
  553.         padding: 0;
    
  554.         width: 100%;
    
  555.         border-collapse: collapse;
    
  556. }
    
  557.  
    
  558. table.pollstableborder {
    
  559.         padding: 0;
    
  560.         width: 100%;
    
  561.         border: none;
    
  562.         text-align: left;
    
  563. }
    
  564.  
    
  565. table.pollstableborder img {
    
  566.         vertical-align: baseline;
    
  567. }
    
  568.  
    
  569. table.pollstableborder td {
    
  570.         padding: 4px!important;
    
  571.         border-collapse: collapse;
    
  572.         border-spacing: 0;
    
  573. }
    
  574.  
    
  575. table.pollstableborder tr.sectiontableentry1 td {
    
  576.         background: #ECECEC;
    
  577. }
    
  578.  
    
  579. table.searchintro {
    
  580.         padding: 10px 0;
    
  581.         width: 100%;
    
  582. }
    
  583.  
    
  584. table.searchintro td {
    
  585.         padding: 5px!important;
    
  586. }
    
  587.  
    
  588. table.adminform {
    
  589. }
    
  590.  
    
  591. .adminform .inputbox {
    
  592. }
    
  593.  
    
  594. .blog_more {
    
  595.         padding: 10px 0;
    
  596.         background: url(../images/hdot.gif) repeat-x top;
    
  597. }
    
  598.  
    
  599. .blog_more strong {
    
  600.         margin: 0 0 5px;
    
  601.         display: block;
    
  602.         font-size: 125%;
    
  603. }
    
  604.  
    
  605. .blog_more ul {
    
  606.         margin: 0;
    
  607.         padding: 0;
    
  608. }
    
  609.  
    
  610. .blog_more ul li {
    
  611.         margin: 0;
    
  612.         padding: 0 0 0 17px;
    
  613.         background: url(../images/bullet.gif) no-repeat 6px 8px;
    
  614. }
    
  615.  
    
  616. .category {
    
  617.         font-weight: bold;
    
  618. }
    
  619.  
    
  620. h1.componentheading, .componentheading {
    
  621.         padding: 5px 0 15px;
    
  622.         margin: 0 0 10px;
    
  623.         background: url(../images/hdot.gif) repeat-x bottom;
    
  624. }
    
  625.  
    
  626. .componentheading {
    
  627.         font-size: 200%;
    
  628.         font-weight: bold;
    
  629. }
    
  630.  
    
  631. .contentdescription {
    
  632.         padding-bottom: 30px;
    
  633. }
    
  634.  
    
  635. h2.contentheading, .contentheading {
    
  636.         padding: 5px 0 8px;
    
  637.         margin: 0;
    
  638.         font-weight: normal;
    
  639. }
    
  640.  
    
  641. table.blog .contentheading {
    
  642.         font-size: 150%;
    
  643. }
    
  644.  
    
  645. .contentheading {
    
  646.         font-size: 200%;
    
  647. }
    
  648.  
    
  649. a.contentpagetitle,
    
  650. a.contentpagetitle:hover,
    
  651. a.contentpagetitle:active,
    
  652. a.contentpagetitle:focus {
    
  653.         text-decoration: none !important;
    
  654. }
    
  655.  
    
  656. a.readon {
    
  657.         float: left;
    
  658.         margin-top: 10px;
    
  659.         padding: 1px 5px 1px 14px;
    
  660.         border: 1px solid #F6F6F6;
    
  661.         display: block;
    
  662.         background: url(../images/arrow.png) no-repeat 5px 48%;
    
  663.         color: #006699;
    
  664.         font-weight: bold;
    
  665.         text-decoration: none;
    
  666.         text-transform: uppercase;
    
  667. }
    
  668.  
    
  669. a.readon:hover, a.readon:active, a.readon:focus {
    
  670.         border: 1px solid #ECECEC;
    
  671.         background: url(../images/arrow.png) no-repeat 5px 48% #FFFFFF;
    
  672. }
    
  673.  
    
  674. table.contentpaneopen td, table.contentpane td {
    
  675. }
    
  676.  
    
  677. table.contentpaneopen, table.contentpane, table.blog {
    
  678.         width: 100%;
    
  679. }
    
  680.  
    
  681. .moduletable {
    
  682.         padding: 0;
    
  683. }
    
  684.  
    
  685. ul.pagination {
    
  686.         margin: 15px auto;
    
  687.         padding: 10px 0;
    
  688.         background: url(../images/hdot.gif) repeat-x top;
    
  689. }
    
  690.  
    
  691. ul.pagination li {
    
  692.         margin: 0;
    
  693.         padding: 0;
    
  694.         display: inline;
    
  695.         background: none;
    
  696. }
    
  697.  
    
  698. ul.pagination li span{
    
  699.         padding: 2px 5px;
    
  700. }
    
  701.  
    
  702. ul.pagination a {
    
  703.         padding: 2px 5px;
    
  704.         border: 1px solid #F6F6F6;
    
  705. }
    
  706.  
    
  707. ul.pagination a:hover, ul.pagination a:active, ul.pagination a:focus {
    
  708.         border: 1px solid #ECECEC;
    
  709.         background: #FFFFFF;
    
  710. }
    
  711.  
    
  712. .pagenavbar {
    
  713.         padding-left: 14px;
    
  714. }
    
  715.  
    
  716. .pagenavcounter {
    
  717.         padding: 8px 14px 0 14px;
    
  718. }
    
  719.  
    
  720. .sectiontableheader {
    
  721.         padding: 8px 5px;
    
  722.         background: #444444;
    
  723.         color: #FFFFFF;
    
  724. }
    
  725.  
    
  726. .sectiontableheader a {
    
  727.         color: #FFFFFF;
    
  728. }
    
  729.  
    
  730. tr.sectiontableentry1 td {
    
  731.         padding: 8px 5px;
    
  732.         background: url(../images/hdot2.gif) repeat-x bottom;
    
  733. }
    
  734.  
    
  735. tr.sectiontableentry2 td {
    
  736.         padding: 8px 5px;
    
  737.         background: url(../images/hdot2.gif) repeat-x bottom #ECECEC;
    
  738. }
    
  739.  
    
  740. tr.sectiontableentry1:hover td,
    
  741. tr.sectiontableentry2:hover td {
    
  742.         background: url(../images/hdot2.gif) repeat-x bottom #FFFFCC;
    
  743. }
    
  744.  
    
  745. .smalldark {
    
  746.         text-align: left;
    
  747. }
    
  748.  
    
  749. div.syndicate div {
    
  750.         text-align: center;
    
  751. }
    
  752.  
    
  753. .pollstableborder tr.sectiontableentry1 td,
    
  754. .pollstableborder tr.sectiontableentry2 td {
    
  755.         background: none;
    
  756. }
    
  757.  
    
  758. /* META
    
  759. --------------------------------------------------------- */
    
  760. .article-tools {
    
  761.         border-top: 1px solid #DDDDDD;
    
  762.         width: 100%;
    
  763.         float: left;
    
  764.         clear: both;
    
  765.         margin-bottom: 15px;
    
  766.         display: block;
    
  767.         background: #ECECEC;
    
  768. }
    
  769.  
    
  770. .article-meta {
    
  771.         padding: 5px;
    
  772.         width: 80%;
    
  773.         float: left;
    
  774. }
    
  775.  
    
  776. .createby {
    
  777.         padding: 3px 3px 3px 20px;
    
  778.         background: url(../images/icon-user.gif) no-repeat 0 2px;
    
  779. }
    
  780.  
    
  781. .createdate {
    
  782.         padding: 3px 3px 3px 20px;
    
  783.         background: url(../images/icon-date.gif) no-repeat 0 2px;
    
  784. }
    
  785.  
    
  786. .modifydate {
    
  787.         width: 100%;
    
  788.         float: left;
    
  789. }
    
  790.  
    
  791. div.buttonheading {
    
  792.         float: right;
    
  793.         width: 15%;
    
  794. }
    
  795.  
    
  796. .buttonheading img {
    
  797.         margin: 7px 5px 0 0;
    
  798.         border: 0;
    
  799.         float: right;
    
  800. }
    
  801.  
    
  802. /* MAIN LAYOUT DIVS
    
  803. --------------------------------------------------------- */
    
  804. #ja-wrapper {
    
  805.         width: 100%;
    
  806.         margin: 0;
    
  807.         background: #F2F2F2;
    
  808. }
    
  809.  
    
  810. #ja-containerwrap {
    
  811.         background: url(../images/cw-bg1.gif) repeat-y 50% 0;
    
  812. }
    
  813.  
    
  814. #ja-containerwrap2 {
    
  815.         background: url(../images/cw-bg2.gif) no-repeat 50% 0;
    
  816. }
    
  817.  
    
  818. #ja-container {
    
  819.         background: url(../images/c-bg1.gif) repeat-y 18% 0;
    
  820. }
    
  821.  
    
  822. #ja-container2 {
    
  823.         padding: 20px 0;
    
  824.         background: url(../images/c-bg2.gif) no-repeat 18% 0;
    
  825. }
    
  826.  
    
  827. #ja-mainbody-fr #ja-col1 {
    
  828.         width: 20%;
    
  829. }
    
  830.  
    
  831. #ja-mainbody-fr #ja-contentwrap {
    
  832.         width: 80%;
    
  833. }
    
  834.  
    
  835. #ja-mainbody, #ja-mainbody-fl {
    
  836.         float: left;
    
  837.         width: 80%;
    
  838. }
    
  839.  
    
  840. #ja-mainbody #ja-contentwrap {
    
  841.         float: right;
    
  842.         width: 75%;
    
  843. }
    
  844.  
    
  845. #ja-mainbody-fl #ja-contentwrap {
    
  846.         float: left;
    
  847.         width: 100%;
    
  848. }
    
  849.  
    
  850. #ja-mainbody-f, #ja-mainbody-fr {
    
  851.         float: none;
    
  852.         width: 100%;
    
  853. }
    
  854.  
    
  855. #ja-mainbody-fr #ja-contentwrap {
    
  856.         width: 74.8%;
    
  857.         float: right;
    
  858. }
    
  859.  
    
  860. #ja-mainbody-fr #ja-col1 {
    
  861.         width: 20%;
    
  862.         float: left;
    
  863. }
    
  864.  
    
  865. #ja-mainbody-fr #ja-contentwrap {
    
  866.         width: 80%;
    
  867. }
    
  868.  
    
  869. #ja-content {
    
  870.         padding: 0 20px 0 40px;
    
  871. }
    
  872. #ja-contentwrap {
    
  873.         min-height: 300px;
    
  874.         height: auto;
    
  875. }
    
  876. * html #ja-contentwrap {
    
  877.         height: 300px;
    
  878. }
    
  879. #ja-mainbody-fl #ja-content {
    
  880.         padding-left: 0;
    
  881. }
    
  882.  
    
  883. #ja-mainbody-f #ja-content {
    
  884.         padding: 0;
    
  885. }
    
  886.  
    
  887. /* Full */
    
  888. #ja-containerwrap-f {
    
  889.         background: url(../images/cwf-bg.gif) repeat-x top left #F6F6F6;
    
  890. }
    
  891.  
    
  892. #ja-containerwrap-f #ja-containerwrap2 {
    
  893.         background: none;
    
  894. }
    
  895.  
    
  896. #ja-containerwrap-f #ja-container,
    
  897. #ja-containerwrap-f #ja-container2 {
    
  898.         background: none;
    
  899. }
    
  900.  
    
  901. /* Full left */
    
  902. #ja-containerwrap-fl {
    
  903.         background: url(../images/cwf-bg.gif) repeat-x top left #F6F6F6;
    
  904. }
    
  905.  
    
  906. #ja-containerwrap-fl #ja-containerwrap2,
    
  907. #ja-containerwrap-fl #ja-container,
    
  908. #ja-containerwrap-fl #ja-container2 {
    
  909.         background: none;
    
  910. }
    
  911.  
    
  912. /* Full right */
    
  913. #ja-containerwrap-fr {
    
  914.         background: url(../images/cw-bg1.gif) repeat-y 50% 0;
    
  915. }
    
  916.  
    
  917. #ja-containerwrap-fr #ja-containerwrap2 {
    
  918.         background: url(../images/cw-bg2.gif) no-repeat 50% 0;
    
  919. }
    
  920.  
    
  921. /* HEADER
    
  922. --------------------------------------------------------- */
    
  923. #ja-headerwrap {
    
  924.         background: #333333;
    
  925.         color: #CCCCCC;
    
  926.         line-height: normal;
    
  927.         height: 80px;
    
  928. }
    
  929.  
    
  930. #ja-header {
    
  931.         position: relative;
    
  932.         height: 80px;
    
  933. }
    
  934.  
    
  935. .ja-headermask {
    
  936.         width: 602px;
    
  937.         display: block;
    
  938.         background: url(../images/header-mask.png) no-repeat top right;
    
  939.         height: 80px;
    
  940.         position: absolute;
    
  941.         top: 0;
    
  942.         right: -1px;
    
  943. }
    
  944.  
    
  945. #ja-header a {
    
  946.         color: #CCCCCC;
    
  947. }
    
  948.  
    
  949. h1.logo, h1.logo-text {
    
  950.         margin: 0 0 0 5px;
    
  951.         padding: 0;
    
  952.         font-size: 180%;
    
  953.         text-transform: uppercase;
    
  954. }
    
  955.  
    
  956. h1.logo a {
    
  957.         width: 208px;
    
  958.         display: block;
    
  959.         background: url(../images/logo.png) no-repeat;
    
  960.         height: 80px;
    
  961.         position: relative;
    
  962.         z-index: 100;
    
  963. }
    
  964.  
    
  965. h1.logo a span {
    
  966.         position: absolute;
    
  967.         top: -1000px;
    
  968. }
    
  969.  
    
  970. h1.logo-text a {
    
  971.         color: #CCCCCC !important;
    
  972.         text-decoration: none;
    
  973.         outline: none;
    
  974.         position: absolute;
    
  975.         bottom: 40px;
    
  976.         left: 5px;
    
  977. }
    
  978.  
    
  979. p.site-slogan {
    
  980.         margin: 0;
    
  981.         padding: 0;
    
  982.         padding: 2px 5px;
    
  983.         color: #FFFFFF;
    
  984.         background: #444444;
    
  985.         font-size: 92%;
    
  986.         position: absolute;
    
  987.         bottom: 20px;
    
  988.         left: 0;
    
  989. }
    
  990.  
    
  991. /* Search */
    
  992. #ja-search {
    
  993.         padding-left: 20px;
    
  994.         background: url(../images/icon-search.gif) no-repeat center left;
    
  995.         position: absolute;
    
  996.         bottom: 15px;
    
  997.         right: 0;
    
  998. }
    
  999.  
    
  1000. #ja-search .inputbox {
    
  1001.         width: 120px;
    
  1002.         border: 1px solid #333333;
    
  1003.         padding: 3px 5px;
    
  1004.         color: #999999;
    
  1005.         background: #444444;
    
  1006.         font-size: 92%;
    
  1007. }
    
  1008.  
    
  1009. /* MAIN NAVIGATION
    
  1010. --------------------------------------------------------- */
    
  1011.  
    
  1012. #ja-pathway {
    
  1013.         font-size: 92%;
    
  1014. }
    
  1015.  
    
  1016. #ja-pathway strong {
    
  1017.         margin-right: 5px;
    
  1018.         font-weight: normal;
    
  1019. }
    
  1020.  
    
  1021. #ja-pathway a {
    
  1022.         text-decoration: none;
    
  1023. }
    
  1024.  
    
  1025. #ja-pathway img {
    
  1026.         margin: 1px 5px;
    
  1027. }
    
  1028.  
    
  1029. /* MODULE
    
  1030. --------------------------------------------------------- */
    
  1031. div.moduletable,
    
  1032. div.moduletable_menu,
    
  1033. div.moduletable_text {
    
  1034.         padding: 0 0 20px;
    
  1035.         margin-bottom: 15px;
    
  1036.         background: url(../images/hdot.gif) repeat-x bottom;
    
  1037. }
    
  1038.  
    
  1039. div.moduletable h3,
    
  1040. div.moduletable_menu h3,
    
  1041. div.moduletable_text h3 {
    
  1042.         padding: 0 0 8px;
    
  1043.         margin: 0;
    
  1044.         color: #7BA566;
    
  1045.         font-size: 125%;
    
  1046.         font-weight: bold;
    
  1047.         text-transform: uppercase;
    
  1048. }
    
  1049.  
    
  1050. /* Module rounded */
    
  1051. div.module h3 {
    
  1052.         margin: 0 -15px 10px;
    
  1053.         padding: 8px 15px 5px;
    
  1054.         border-bottom: 2px solid #F6F6F6;
    
  1055.         color: #7BA566;
    
  1056.         font-size: 125%;
    
  1057.         font-weight: bold;
    
  1058.         text-transform: uppercase;
    
  1059. }
    
  1060.  
    
  1061. div.module_black,
    
  1062. div.module_green,
    
  1063. div.module_blue,
    
  1064. div.module_red,
    
  1065. div.module {
    
  1066.         margin-bottom: 20px;
    
  1067.         float: left;
    
  1068.         clear: both;
    
  1069.         width: 100%;
    
  1070.         background: url(../images/b-br.gif) no-repeat bottom right #FFFFFF;
    
  1071. }
    
  1072.  
    
  1073. div.module div {
    
  1074.         background: url(../images/b-bl.gif) no-repeat bottom left;
    
  1075. }
    
  1076.  
    
  1077. div.module div div {
    
  1078.         background: url(../images/b-tr.gif) no-repeat top right;
    
  1079. }
    
  1080.  
    
  1081. div.module div div div {
    
  1082.         padding: 0 15px 10px;
    
  1083.         background: url(../images/b-tl.gif) no-repeat top left;
    
  1084. }
    
  1085.  
    
  1086. div.module_black div div div div,
    
  1087. div.module_green div div div div,
    
  1088. div.module_blue div div div div,
    
  1089. div.module_red div div div div,
    
  1090. div.module_text div div div div,
    
  1091. div.module div div div div {
    
  1092.         margin: 0;
    
  1093.         padding: 0;
    
  1094.         float: none;
    
  1095.         width: 99%;
    
  1096.         background: none;
    
  1097. }
    
  1098.  
    
  1099. div.module_text h3 {
    
  1100.         margin: 0 0 10px;
    
  1101.         width: 100%;
    
  1102.         clear: both;
    
  1103.         display: block;
    
  1104.         overflow: hidden;
    
  1105. }
    
  1106.  
    
  1107. div.module_text span {
    
  1108.         padding: 0 3px 0 0;
    
  1109.         float: left;
    
  1110.         clear: both;
    
  1111.         display: block;
    
  1112.         background: #F6F6F6;
    
  1113.         font-weight: bold;
    
  1114. }
    
  1115.  
    
  1116. div.module_text {
    
  1117.         margin-bottom: 20px;
    
  1118.         padding: 0;
    
  1119.         float: left;
    
  1120.         clear: both;
    
  1121.         width: 100%;
    
  1122.         background: url(../images/bt-br.gif) no-repeat bottom right #F6F6F6;
    
  1123. }
    
  1124.  
    
  1125. div.module_text div {
    
  1126.         background: url(../images/bt-bl.gif) no-repeat bottom left;
    
  1127. }
    
  1128.  
    
  1129. div.module_text div div {
    
  1130.         background: url(../images/bt-tr.gif) no-repeat top right;
    
  1131. }
    
  1132.  
    
  1133. div.module_text div div div {
    
  1134.         padding: 0 15px 10px;
    
  1135.         display: block;
    
  1136.         background: url(../images/bt-tl.gif) no-repeat top left;
    
  1137. }
    
  1138.  
    
  1139. div.banneritem_text {
    
  1140.         padding: 5px 0 !important;
    
  1141. }
    
  1142.  
    
  1143. /* red */
    
  1144. div.module_black h3,
    
  1145. div.module_green h3,
    
  1146. div.module_blue h3,
    
  1147. div.module_red h3 {
    
  1148.         margin: 0 -15px 10px;
    
  1149.         padding: 8px 15px 5px;
    
  1150.         border-bottom: 1px solid #F6F6F6;
    
  1151.         color: #FFFFFF;
    
  1152.         font-size: 125%;
    
  1153.         font-weight: bold;
    
  1154.         text-transform: uppercase;
    
  1155. }
    
  1156.  
    
  1157. div.module_red {
    
  1158.         background: url(../images/br-br.gif) no-repeat bottom right #BF0000;
    
  1159.         color: #FFFFFF;
    
  1160. }
    
  1161.  
    
  1162. div.module_red div {
    
  1163.         background: url(../images/br-bl.gif) no-repeat bottom left;
    
  1164. }
    
  1165.  
    
  1166. div.module_red div div {
    
  1167.         background: url(../images/br-tr.gif) no-repeat top right;
    
  1168. }
    
  1169.  
    
  1170. div.module_red div div div {
    
  1171.         padding: 0 15px 10px;
    
  1172.         background: url(../images/br-tl.gif) no-repeat top left;
    
  1173. }
    
  1174.  
    
  1175. /* blue */
    
  1176. div.module_blue {
    
  1177.         background: url(../images/bb-br.gif) no-repeat bottom right #006699;
    
  1178.         color: #FFFFFF;
    
  1179. }
    
  1180.  
    
  1181. div.module_blue div {
    
  1182.         background: url(../images/bb-bl.gif) no-repeat bottom left;
    
  1183. }
    
  1184.  
    
  1185. div.module_blue div div {
    
  1186.         background: url(../images/bb-tr.gif) no-repeat top right;
    
  1187. }
    
  1188.  
    
  1189. div.module_blue div div div {
    
  1190.         padding: 0 15px 10px;
    
  1191.         background: url(../images/bb-tl.gif) no-repeat top left;
    
  1192. }
    
  1193.  
    
  1194. /* green */
    
  1195. div.module_green {
    
  1196.         background: url(../images/bg-br.gif) no-repeat bottom right #7BA566;
    
  1197.         color: #FFFFFF;
    
  1198. }
    
  1199.  
    
  1200. div.module_green div {
    
  1201.         background: url(../images/bg-bl.gif) no-repeat bottom left;
    
  1202. }
    
  1203.  
    
  1204. div.module_green div div {
    
  1205.         background: url(../images/bg-tr.gif) no-repeat top right;
    
  1206. }
    
  1207.  
    
  1208. div.module_green div div div {
    
  1209.         padding: 0 15px 10px;
    
  1210.         background: url(../images/bg-tl.gif) no-repeat top left;
    
  1211. }
    
  1212.  
    
  1213. /* black */
    
  1214. div.module_black {
    
  1215.         background: url(../images/bl-br.gif) no-repeat bottom right #333333;
    
  1216.         color: #FFFFFF;
    
  1217. }
    
  1218.  
    
  1219. div.module_black div {
    
  1220.         background: url(../images/bl-bl.gif) no-repeat bottom left;
    
  1221. }
    
  1222.  
    
  1223. div.module_black div div {
    
  1224.         background: url(../images/bl-tr.gif) no-repeat top right;
    
  1225. }
    
  1226.  
    
  1227. div.module_black div div div {
    
  1228.         padding: 0 15px 10px;
    
  1229.         background: url(../images/bl-tl.gif) no-repeat top left;
    
  1230. }
    
  1231.  
    
  1232. div.module_blue ul,
    
  1233. div.module_blue ol,
    
  1234. div.module_red ul,
    
  1235. div.module_red ol,
    
  1236. div.module_black ul,
    
  1237. div.module_black ol,
    
  1238. div.module_green ul,
    
  1239. div.module_green ol {
    
  1240.         margin: 0;
    
  1241.         padding: 0;
    
  1242. }
    
  1243.  
    
  1244. div.module_blue li,
    
  1245. div.module_red li,
    
  1246. div.module_black li,
    
  1247. div.module_green li {
    
  1248.         margin-left: 20px;
    
  1249.         padding: 0;
    
  1250.         line-height: 150%;
    
  1251. }
    
  1252.  
    
  1253. div.module_blue a,
    
  1254. div.module_red a,
    
  1255. div.module_black a,
    
  1256. div.module_green a {
    
  1257.         color: #FFFFFF;
    
  1258. }
    
  1259.  
    
  1260. div.advs {
    
  1261.         float: left;
    
  1262.         width: 100%;
    
  1263.         clear: both;
    
  1264.         display: block;
    
  1265. }
    
  1266.  
    
  1267. /* LEFT COLUMN + RIGHT COLUMN
    
  1268. --------------------------------------------------------- */
    
  1269. #ja-col1 {
    
  1270.         float: left;
    
  1271.         width: 24.99%;
    
  1272.         padding-top: 10px;
    
  1273.         overflow: hidden;
    
  1274. }
    
  1275.  
    
  1276. #ja-col2 {
    
  1277.         float: right;
    
  1278.         width: 20%;
    
  1279.         overflow: hidden;
    
  1280. }
    
  1281.  
    
  1282. #ja-col1 table,
    
  1283. #ja-col2 table {
    
  1284.         border-collapse: collapse;
    
  1285.         border-spacing: 0;
    
  1286. }
    
  1287.  
    
  1288. #ja-col1 ul li,
    
  1289. #ja-col2 ul li {
    
  1290.         padding-left: 15px;
    
  1291.         margin: 0;
    
  1292.         background: url(../images/bullet.gif) no-repeat 5px 50%;
    
  1293. }
    
  1294.  
    
  1295. #ja-col1 ul, #ja-col2 ul {
    
  1296.         margin: 0;
    
  1297. }
    
  1298.  
    
  1299. #ja-col1 ol, #ja-col2 ol {
    
  1300.         margin-left: 5px;
    
  1301. }
    
  1302.  
    
  1303. #ja-col1 .article_separator,
    
  1304. #ja-col2 .article_separator {
    
  1305.         display: none;
    
  1306. }
    
  1307.  
    
  1308. /* SPOTLIGHT
    
  1309. --------------------------------------------------------- */
    
  1310. /* Spotlight Box Style */
    
  1311. .ja-box-full, .ja-box-left, .ja-box-center, .ja-box-right {
    
  1312.         float: left;
    
  1313.         overflow: hidden;
    
  1314. }
    
  1315.  
    
  1316. .ja-box-left div.moduletable,
    
  1317. .ja-box-full div.moduletable {
    
  1318.         padding-right: 30px;
    
  1319.         background: none;
    
  1320. }
    
  1321.  
    
  1322. .ja-box-right div.moduletable {
    
  1323.         padding-left: 30px;
    
  1324.         background: url(../images/vdot2.gif) repeat-y left;
    
  1325. }
    
  1326.  
    
  1327. .ja-box-center div.moduletable {
    
  1328.         padding: 0 30px;
    
  1329.         background: url(../images/vdot2.gif) repeat-y left;
    
  1330. }
    
  1331.  
    
  1332. #ja-botsl h3 {
    
  1333.         background: none;
    
  1334. }
    
  1335.  
    
  1336. #ja-botslwrap {
    
  1337.         border-top: 5px solid #CCCCCC;
    
  1338.         background: #444444;
    
  1339.         color: #CCCCCC;
    
  1340. }
    
  1341.  
    
  1342. #ja-botsl {
    
  1343.         padding: 15px 0;
    
  1344. }
    
  1345.  
    
  1346. #ja-botsl div.moduletable {
    
  1347.         padding-top: 0;
    
  1348.         padding-bottom: 0;
    
  1349.         margin: 0;
    
  1350. }
    
  1351.  
    
  1352. #ja-botsl h3 {
    
  1353.         margin: 0 0 12px;
    
  1354.         padding: 0;
    
  1355.         color: #FFFFFF;
    
  1356. }
    
  1357.  
    
  1358. #ja-botsl a {
    
  1359.         color: #CCCCCC;
    
  1360. }
    
  1361.  
    
  1362. #ja-botsl a:hover, #ja-botsl a:active, #ja-botsl a:focus {
    
  1363.         color: #FFFFFF;
    
  1364. }
    
  1365.  
    
  1366. #ja-botsl ul, #ja-botsl p, #ja-botsl ol {
    
  1367.         padding: 0;
    
  1368.         margin: 0 !important;
    
  1369. }
    
  1370.  
    
  1371. #ja-botsl ul li {
    
  1372.         padding: 0 0 0 15px;
    
  1373.         margin: 0;
    
  1374.         background: url(../images/bullet2.gif) no-repeat 3px 8px;
    
  1375. }
    
  1376.  
    
  1377. #ja-botsl ol li {
    
  1378.         margin-left: 25px;
    
  1379.         padding: 0 !important;
    
  1380. }
    
  1381.  
    
  1382. #ja-botsl td {
    
  1383.         padding: 0;
    
  1384. }
    
  1385.  
    
  1386. #ja-botsl .article_separator {
    
  1387.         display: none;
    
  1388. }
    
  1389.  
    
  1390. #ja-botsl table {
    
  1391.         border-spacing: 0;
    
  1392.         border-collapse: collapse;
    
  1393. }
    
  1394.  
    
  1395. /* FOOTER
    
  1396. --------------------------------------------------------- */
    
  1397. #ja-footerwrap {
    
  1398.         border-top: 5px solid #CCCCCC;
    
  1399.         padding: 20px 0 30px;
    
  1400.         clear: both;
    
  1401.         background: url(../images/grad3.gif) repeat-x bottom #F6F6F6;
    
  1402. }
    
  1403.  
    
  1404. #ja-footer {
    
  1405.         padding: 0;
    
  1406.         color: #666666;
    
  1407.         background: url(../images/vdot.gif) repeat-y 22% 0;
    
  1408.         position: relative;
    
  1409. }
    
  1410.  
    
  1411. #ja-footer .copyright {
    
  1412.         clear: both;
    
  1413.         display: block;
    
  1414.         padding-left: 25%;
    
  1415.         color: #666666;
    
  1416.         font-style: normal;
    
  1417.         font-size: 92%;
    
  1418. }
    
  1419.  
    
  1420. #ja-footnav {
    
  1421.         padding-left: 25%;
    
  1422. }
    
  1423.  
    
  1424. #ja-footer ul {
    
  1425.         margin: 0 0 5px;
    
  1426.         padding: 0;
    
  1427. }
    
  1428.  
    
  1429. #ja-footer li {
    
  1430.         margin: 0;
    
  1431.         padding: 0;
    
  1432.         display: inline;
    
  1433.         background: none;
    
  1434. }
    
  1435.  
    
  1436. #ja-footer li a {
    
  1437.         padding: 0 15px 0 0;
    
  1438.         display: inline;
    
  1439.         color: #666666;
    
  1440.         font-weight: bold;
    
  1441.         font-size: 92%;
    
  1442.         line-height: normal;
    
  1443.         text-decoration: none;
    
  1444.         text-transform: uppercase;
    
  1445. }
    
  1446.  
    
  1447. #ja-footer li a:hover, #ja-footer li a:active, #ja-footer li a:focus {
    
  1448.         color: #333333;
    
  1449.         text-decoration: none;
    
  1450. }
    
  1451.  
    
  1452. .ja-cert {
    
  1453.         font-size: 92%;
    
  1454.         position: absolute;
    
  1455.         right: 0;
    
  1456.         top: 18px;
    
  1457. }
    
  1458.  
    
  1459. .ja-cert a {
    
  1460.         margin: 0 0 0 5px;
    
  1461.         padding: 0;
    
  1462.         border: none;
    
  1463.         border: none;
    
  1464.         text-decoration: none;
    
  1465. }
    
  1466.  
    
  1467. .ja-cert a span {
    
  1468.         display: none;
    
  1469. }
    
  1470.  
    
  1471. .ja-cert a img {
    
  1472.         border: none;
    
  1473. }
    
  1474.  
    
  1475. .banneritem {
    
  1476.         display: block;
    
  1477.         margin-top: 15px;
    
  1478. }
    
  1479.  
    
  1480. /* MISCELLANOUS
    
  1481. ----------------------------------------------------------- */
    
  1482. ul.accessibility {
    
  1483.         position: absolute;
    
  1484.         top: -100%;
    
  1485. }
    
  1486.  
    
  1487. /*usertool*/
    
  1488. ul.ja-usertools-font {
    
  1489.         font-size: 11px;
    
  1490.         position: absolute;
    
  1491.         top: 8px;
    
  1492.         right: 70px;
    
  1493. }
    
  1494.  
    
  1495. ul.ja-usertools-font li {
    
  1496.         padding: 0;
    
  1497.         margin: 0;
    
  1498.         display: inline;
    
  1499.         background: none;
    
  1500. }
    
  1501.  
    
  1502. /*collapsible h3*/
    
  1503. h3.show {
    
  1504.         background: url(../images/arrow2.png) no-repeat 90% 60%;
    
  1505.         cursor: pointer;
    
  1506. }
    
  1507.  
    
  1508. h3.hide {
    
  1509.         background: url(../images/arrow3.png) no-repeat 90% 60%;
    
  1510.         cursor: pointer;
    
  1511. }
    
  1512.  
    
  1513. /*others*/
    
  1514. #ja-banner {
    
  1515.         margin: 15px 0;
    
  1516.         text-align: center;
    
  1517. }
    
  1518.  
    
  1519. div.back_button a,
    
  1520. div.back_button a:hover,
    
  1521. div.back_button a:active {
    
  1522.         margin: 10px 0;
    
  1523.         display: block;
    
  1524.         background: none!important;
    
  1525.         text-decoration: none!important;
    
  1526. }
    
  1527.  
    
  1528. #form-login p {
    
  1529.         margin: 0 0 5px;
    
  1530. }
    
  1531.  
    
  1532. #form-login ul {
    
  1533.         margin: 10px 0 0;
    
  1534. }
    
  1535.  
    
  1536. #form-login .inputbox {
    
  1537.         width: 90%;
    
  1538. }
    
  1539.  
    
  1540. .clr {
    
  1541.         clear: both;
    
  1542. }
    
  1543.  
    
  1544. .hasTip img {
    
  1545.         margin: 10px 5px 0 0;
    
  1546.         border: none;
    
  1547. }
    
  1548.  
    
  1549. /* Tooltips */
    
  1550. .tool-tip {
    
  1551.         float: left;
    
  1552.         border: 1px solid #D4D5AA;
    
  1553.         padding: 5px;
    
  1554.         background: #FFFFCC;
    
  1555.         max-width: 200px;
    
  1556. }
    
  1557.  
    
  1558. .tool-title {
    
  1559.         padding: 0;
    
  1560.         margin: 0;
    
  1561.         margin-top: -15px;
    
  1562.         padding-top: 15px;
    
  1563.         padding-bottom: 5px;
    
  1564.         background: url(../../system/images/selector-arrow.png) no-repeat;
    
  1565.         font-size: 100%;
    
  1566.         font-weight: bold;
    
  1567. }
    
  1568.  
    
  1569. .tool-text {
    
  1570.         margin: 0;
    
  1571.         font-size: 100%;
    
  1572. }
    
  1573.  
    
  1574. #system-message dd.message ul,
    
  1575. #system-message dd.error ul,
    
  1576. #system-message dd.notice ul {
    
  1577.         padding: 0;
    
  1578.         margin: 0;
    
  1579. }
    
  1580.  
    
  1581. #system-message dd.message ul li,
    
  1582. #system-message dd.error ul li,
    
  1583. #system-message dd.notice ul li {
    
  1584.         background: none;
    
  1585.         padding: 5px;
    
  1586.         margin: 0;
    
  1587.         color: #FFFFFF;
    
  1588. }
    
  1589.  
    
  1590. /* System Standard Messages */
    
  1591. #system-message dd.message ul {
    
  1592.         background: #006699;
    
  1593.         border: none;
    
  1594. }
    
  1595.  
    
  1596. /* System Error Messages */
    
  1597. #system-message dd.error ul {
    
  1598.         background: #BF0000;
    
  1599.         border: none;
    
  1600. }
    
  1601.  
    
  1602. /* System Notice Messages */
    
  1603. #system-message dd.notice ul {
    
  1604.         background: #EE9600;
    
  1605.         border: none;
    
  1606. }
    
  1607.  
    
  1608. /* Clearfix */
    
  1609. .clearfix:after {
    
  1610.         clear: both;
    
  1611.         display: block;
    
  1612.         content: ".";
    
  1613.         height: 0;
    
  1614.         visibility: hidden;
    
  1615. }
    
  1616.  
    
  1617. * html > body .clearfix {
    
  1618.         width: 100%;
    
  1619.         display: block;
    
  1620. }
    
  1621.  
    
  1622. * html .clearfix {
    
  1623.         height: 1%;
    
  1624. }
    
  1625.  
    
  1626. /* Firefox Scrollbar Hack - Do not remove */
    
  1627. html {
    
  1628.         margin-bottom: 1px;
    
  1629.         height: 100%!important;
    
  1630.         height: auto;
    
  1631. }
    

ja_purity/css/template_rtl.css

  1. /* COMMON STYLE
    
  2. --------------------------------------------------------- */
    
  3. html {
    
  4.         direction: rtl;
    
  5. }
    
  6.  
    
  7. ul li {
    
  8.         padding-right: 30px;
    
  9.         background-position: 98% 8px;
    
  10. }
    
  11.  
    
  12. ol li {
    
  13.         margin-right: 35px;
    
  14.         margin-left: -35px;
    
  15.         padding: 0;
    
  16. }
    
  17.  
    
  18. th {
    
  19.         text-align: right;
    
  20. }
    
  21.  
    
  22. /* JOOMLA STYLE
    
  23. --------------------------------------------------------- */
    
  24. td.sectiontableheader {
    
  25.   border-left: 1px solid #fff;
    
  26.   border-right: none;
    
  27. }
    
  28.  
    
  29. table.contenttoc {
    
  30.         float:left;
    
  31.         margin: 0 10px 10px 0px;
    
  32. }
    
  33.  
    
  34. table.contenttoc td {
    
  35.         padding: 1px 25px 1px 5px;
    
  36.         background-position: 95% 50%;
    
  37. }
    
  38.  
    
  39. table.pollstableborder {
    
  40.         text-align: right;
    
  41. }
    
  42.  
    
  43. .blog_more ul li {
    
  44.         padding: 0 17px 0 0;
    
  45.         background-position: 98% 8px;
    
  46. }
    
  47.  
    
  48. a.readon {
    
  49.         float: right;
    
  50.         padding: 1px 14px 1px 5px;
    
  51.         background: url(../images/rtl/arrow.png) no-repeat 95% 48%;
    
  52. }
    
  53.  
    
  54. a.readon:hover, a.readon:active, a.readon:focus {
    
  55.         background: url(../images/rtl/arrow.png) no-repeat 95% 48% #FFFFFF;
    
  56. }
    
  57.  
    
  58. ul.pagination li span{
    
  59.         padding: 0;
    
  60. }
    
  61.  
    
  62. .pagenavbar {
    
  63.         padding-right: 14px;
    
  64.         background-position: center right;
    
  65. }
    
  66.  
    
  67. .pagenavcounter {
    
  68.         padding: 8px 14px 0 14px;
    
  69.         background-position: 0 11px;
    
  70. }
    
  71.  
    
  72. .smalldark {
    
  73.         text-align: right;
    
  74. }
    
  75.  
    
  76. /* META
    
  77. --------------------------------------------------------- */
    
  78. .article-tools {
    
  79.         float: right;
    
  80. }
    
  81.  
    
  82. .article-meta {
    
  83.         float: right;
    
  84. }
    
  85.  
    
  86. .createby {
    
  87.         padding: 3px 20px 3px 3px;
    
  88.         background-position: 100% 5px;
    
  89.         float: right;
    
  90. }
    
  91.  
    
  92. .createdate {
    
  93.         padding: 3px 20px 3px 3px;
    
  94.         background-position: 100% 5px;
    
  95.         float: right;
    
  96. }
    
  97.  
    
  98. .buttonheading img {
    
  99.         margin: 7px 0 0 5px;
    
  100.         float: left;
    
  101. }
    
  102.  
    
  103. /* MAIN LAYOUT DIVS
    
  104. --------------------------------------------------------- */
    
  105. #ja-containerwrap {
    
  106.         background: url(../images/rtl/cw-bg12.gif) repeat-y 50% 0;
    
  107. }
    
  108.  
    
  109. #ja-containerwrap-fr {
    
  110.         background: url(../images/rtl/cw-bg12.gif) repeat-y 50% 0;
    
  111. }
    
  112.  
    
  113. #ja-containerwrap2 {
    
  114.         background: url(../images/rtl/cw-bg2.gif) no-repeat 50% 0;
    
  115. }
    
  116.  
    
  117. #ja-container {
    
  118.         background: url(../images/rtl/c-bg1.gif) repeat-y 82% 0;
    
  119.         padding: 0;
    
  120. }
    
  121.  
    
  122. #ja-container2 {
    
  123.         background: url(../images/rtl/c-bg2.gif) no-repeat 82% top;
    
  124.         padding: 20px 0;
    
  125. }
    
  126.  
    
  127. #ja-mainbody, #ja-mainbody-fl {
    
  128.         float: right;
    
  129. }
    
  130.  
    
  131. #ja-mainbody #ja-contentwrap,
    
  132. #ja-mainbody-fr #ja-contentwrap,
    
  133. #ja-mainbody-fl #ja-contentwrap {
    
  134.         float: left;
    
  135. }
    
  136.  
    
  137. #ja-mainbody-fl #ja-contentwrap #ja-content {
    
  138.         padding-left: 20px;
    
  139. }
    
  140.  
    
  141. #ja-mainbody-f, #ja-mainbody-fr {
    
  142.         float: right;
    
  143. }
    
  144.  
    
  145. #ja-content {
    
  146.         padding: 0 40px 0 20px;
    
  147. }
    
  148. .OPE #ja-content {
    
  149.         padding-left: 40px;
    
  150. }
    
  151. .OPE #ja-mainbody #ja-content {
    
  152.         padding-right: 20px;
    
  153. }
    
  154. #ja-mainbody-fl #ja-content {
    
  155.         padding-right: 0;
    
  156. }
    
  157.  
    
  158. /* Full */
    
  159. #ja-containerwrap-f {
    
  160.         background: url(../images/rtl/cwf-bg.gif) repeat-x top right #F6F6F6;
    
  161. }
    
  162.  
    
  163. /* Full right */
    
  164. #ja-containerwrap-fl {
    
  165.         background: url(../images/rtl/cwf-bg.gif) repeat-x top right #F6F6F6;
    
  166. }
    
  167.  
    
  168. #ja-containerwrap-fr #ja-containerwrap2 {
    
  169.         background: url(../images/rtl/cw-bg2.gif) no-repeat 50% 0;
    
  170. }
    
  171.  
    
  172. /* HEADER
    
  173. --------------------------------------------------------- */
    
  174. .ja-headermask {
    
  175.         background-position: top left;
    
  176.         left: -1px;
    
  177.         right: auto;
    
  178. }
    
  179.  
    
  180. h1.logo-text a {
    
  181.         right: 5px;
    
  182.         left: auto;
    
  183. }
    
  184.  
    
  185. p.site-slogan {
    
  186.         right: 0;
    
  187.         left: auto;
    
  188. }
    
  189.  
    
  190. /* Search */
    
  191. #ja-search {
    
  192.         background-position: center right;
    
  193.         left: 0;
    
  194.         right: auto;
    
  195. }
    
  196.  
    
  197. /* MAIN NAVIGATION
    
  198. --------------------------------------------------------- */
    
  199.  
    
  200. /* MODULE
    
  201. --------------------------------------------------------- */
    
  202. div.module_black,
    
  203. div.module_green,
    
  204. div.module_blue,
    
  205. div.module_red,
    
  206. div.module {
    
  207.         float: right;
    
  208. }
    
  209.  
    
  210. div.module_black div div div div,
    
  211. div.module_green div div div div,
    
  212. div.module_blue div div div div,
    
  213. div.module_red div div div div,
    
  214. div.module_text div div div div,
    
  215. div.module div div div div {
    
  216.         float: none;
    
  217. }
    
  218.  
    
  219. div.module_text span {
    
  220.         float: right;
    
  221. }
    
  222.  
    
  223. div.module_text {
    
  224.         float: right;
    
  225. }
    
  226.  
    
  227. div.module_blue li,
    
  228. div.module_red li,
    
  229. div.module_black li,
    
  230. div.module_green li {
    
  231.         margin-right: 20px;
    
  232.         margin-left: auto;
    
  233. }
    
  234.  
    
  235. div.advs {
    
  236.         float: right;
    
  237. }
    
  238.  
    
  239. /* PATHWAY
    
  240. --------------------------------------------------------- */
    
  241. #ja-pathway {
    
  242. }
    
  243.  
    
  244. /* right COLUMN + left COLUMN
    
  245. --------------------------------------------------------- */
    
  246. #ja-col1 {
    
  247.         float: right;
    
  248. }
    
  249.  
    
  250. #ja-col2 {
    
  251.         float: left;
    
  252. }
    
  253.  
    
  254. #ja-col1 ul li,
    
  255. #ja-col2 ul li {
    
  256.         padding-right: 15px;
    
  257.         background-position: 100% 10px;
    
  258. }
    
  259.  
    
  260. #ja-col1 ol, #ja-col2 ol,
    
  261. #ja-col1 ul, #ja-col2 ul
    
  262. {
    
  263.         margin-right: 5px;
    
  264. }
    
  265. ul.menu li.active a span {
    
  266.         background: none;
    
  267. }
    
  268.  
    
  269. /* SPOTLIGHT
    
  270. --------------------------------------------------------- */
    
  271. /* Spotlight Box Style */
    
  272. .ja-box-full, .ja-box-right, .ja-box-center, .ja-box-left {
    
  273.         float: right;
    
  274. }
    
  275.  
    
  276. .ja-box-left div.moduletable,
    
  277. .ja-box-full div.moduletable {
    
  278.         padding-left: 30px;
    
  279. }
    
  280.  
    
  281. .ja-box-right div.moduletable {
    
  282.         padding-left: 30px;
    
  283.         padding-right: 30px;
    
  284.         background-position: right;
    
  285. }
    
  286.  
    
  287. .ja-box-center div.moduletable {
    
  288.         background-position: right;
    
  289. }
    
  290.  
    
  291. #ja-botsl ul li {
    
  292.         padding: 0 15px 0 0;
    
  293.         background-position: 99% 8px;
    
  294. }
    
  295.  
    
  296. #ja-botsl ol li {
    
  297.         margin-right: 25px;
    
  298. }
    
  299.  
    
  300. /* FOOTER
    
  301. --------------------------------------------------------- */
    
  302. #ja-footer {
    
  303.         background-position: 78% 0;
    
  304. }
    
  305.  
    
  306. #ja-footer .copyright {
    
  307.         padding-right: 25%;
    
  308. }
    
  309.  
    
  310. #ja-footnav {
    
  311.         padding-right: 25%;
    
  312. }
    
  313.  
    
  314. #ja-footnav li{
    
  315.         float: right;
    
  316.         direction: ltr;
    
  317. }
    
  318.  
    
  319. #ja-footer li a {
    
  320.         padding: 0 0 0 15px;
    
  321. }
    
  322.  
    
  323. .ja-cert {
    
  324.         left: 0;
    
  325.         right: auto;
    
  326. }
    
  327.  
    
  328. .ja-cert a {
    
  329.         margin: 0 5px 0 0;
    
  330. }
    
  331.  
    
  332. .banneritem {
    
  333.         display: block;
    
  334.         margin-top: 15px;
    
  335. }
    
  336.  
    
  337. /* MISCELLANOUS
    
  338. ----------------------------------------------------------- */
    
  339. /*usertool*/
    
  340. ul.ja-usertools-font {
    
  341.         left: 70px;
    
  342.         right: auto;
    
  343. }
    
  344.  
    
  345. /*collapsible h3*/
    
  346. h3.show {
    
  347.         background-position: 10% 60%;
    
  348. }
    
  349.  
    
  350. h3.hide {
    
  351.         background-position: 10% 60%;
    
  352. }
    
  353.  
    
  354. .hasTip img {
    
  355.         margin: 10px 0 0 5px;
    
  356. }
    
  357.  
    
  358. /* Tooltips */
    
  359. .tool-tip {
    
  360.         float: right;
    
  361. }
    
  362.  
    
  363. .breadcrumbs {
    
  364. }
    
  365.  
    
  366. .breadcrumbs a {
    
  367.         float: right;
    
  368. }
    
  369.  
    
  370. .breadcrumbs img {
    
  371.         float: right;
    
  372.         margin-top: 10px;
    
  373.         padding-top: 5px;
    
  374. }
    
  375.  
    
  376. /* MainNav
    
  377. --------------------------------------------------------- */
    
  378. #ja-mainnav{
    
  379.         direction: ltr;
    
  380. }
    
  381.  
    
  382. #ja-mainnav li a {
    
  383.         direction: rtl;
    
  384. }
    
  385.  
    
  386. #ja-cssmenu {
    
  387.         float: right;
    
  388. }
    
  389.  
    
  390. #ja-cssmenu li {
    
  391.         float: right;
    
  392. }
    
  393.  
    
  394. #ja-cssmenu li ul {
    
  395.         right: 0;
    
  396. }
    
  397.  
    
  398. #ja-cssmenu li ul ul {
    
  399.         margin: -1.5em 14em 0 0; /* third-and-above-level lists */
    
  400. }
    
  401.  
    
  402. #ja-cssmenu li li {
    
  403.         padding: 0 0 0 1em;
    
  404. }
    
  405.  
    
  406. /* STYLING THE MENU
    
  407. -----------------------------------*/
    
  408. /* 1st level */
    
  409. #ja-cssmenu li ul a {
    
  410.         border-left: none;
    
  411. }
    
  412.  
    
  413. #ja-cssmenu li.havesubchild,
    
  414. #ja-cssmenu li.havesubchild-active {
    
  415.         background-position: 6% 50%;
    
  416. }
    
  417.  
    
  418. body.IE6 #ja-cssmenu li ul,
    
  419. body.IE7 #ja-cssmenu li ul,
    
  420. body.OPE #ja-cssmenu li ul {
    
  421.         left: auto;
    
  422.         top: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
    
  423. }
    
  424.  
    
  425. body.IE6 #ja-cssmenu li.sfhover ul ul, body.IE6 #ja-cssmenu li.havechildsfhover ul ul, body.IE6 #ja-cssmenu li.havechild-activesfhover ul ul, body.IE6 #ja-cssmenu li.activesfhover ul ul,
    
  426. body.IE6 #ja-cssmenu li.sfhover ul ul ul, body.IE6 #ja-cssmenu li.havechildsfhover ul ul ul, body.IE6 #ja-cssmenu li.havechild-activesfhover ul ul ul, body.IE6 #ja-cssmenu li.activesfhover ul ul ul,
    
  427. body.IE7 #ja-cssmenu li.sfhover ul ul, body.IE7 #ja-cssmenu li.havechildsfhover ul ul, body.IE7 #ja-cssmenu li.havechild-activesfhover ul ul, body.IE7 #ja-cssmenu li.activesfhover ul ul,
    
  428. body.IE7 #ja-cssmenu li.sfhover ul ul ul, body.IE7 #ja-cssmenu li.havechildsfhover ul ul ul, body.IE7 #ja-cssmenu li.havechild-activesfhover ul ul ul, body.IE7 #ja-cssmenu li.activesfhover ul ul ul,
    
  429. body.OPE #ja-cssmenu li.sfhover ul ul, body.OPE #ja-cssmenu li.havechildsfhover ul ul, body.OPE #ja-cssmenu li.havechild-activesfhover ul ul, body.OPE #ja-cssmenu li.activesfhover ul ul,
    
  430. body.OPE #ja-cssmenu li.sfhover ul ul ul, body.OPE #ja-cssmenu li.havechildsfhover ul ul ul, body.OPE #ja-cssmenu li.havechild-activesfhover ul ul ul, body.OPE #ja-cssmenu li.activesfhover ul ul ul {
    
  431.         left: auto;
    
  432.         left: auto;
    
  433.         top: -999em;
    
  434. }
    
  435.  
    
  436. /* This "unhides" the sub-menus (left: -999em is what hides them) */
    
  437. body.IE6 #ja-cssmenu li.sfhover ul, body.IE6 #ja-cssmenu li.havechildsfhover ul, body.IE6 #ja-cssmenu li.havechild-activesfhover ul, body.IE6 #ja-cssmenu li.activesfhover ul,
    
  438. body.IE6 #ja-cssmenu li li.sfhover ul, body.IE6 #ja-cssmenu li li.havesubchildsfhover ul, body.IE6 #ja-cssmenu li li.havesubchild-activesfhover ul, body.IE6 #ja-cssmenu li li.activesfhover ul,
    
  439. body.IE6 #ja-cssmenu li li li.sfhover ul, body.IE6 #ja-cssmenu li li li.havesubchildsfhover ul, body.IE6 #ja-cssmenu li li li.havesubchild-activesfhover ul, body.IE6 #ja-cssmenu li li li.activesfhover ul,
    
  440. body.IE7 #ja-cssmenu li.sfhover ul, body.IE7 #ja-cssmenu li.havechildsfhover ul, body.IE7 #ja-cssmenu li.havechild-activesfhover ul, body.IE7 #ja-cssmenu li.activesfhover ul,
    
  441. body.IE7 #ja-cssmenu li li.sfhover ul, body.IE7 #ja-cssmenu li li.havesubchildsfhover ul, body.IE7 #ja-cssmenu li li.havesubchild-activesfhover ul, body.IE7 #ja-cssmenu li li.activesfhover ul,
    
  442. body.IE7 #ja-cssmenu li li li.sfhover ul, body.IE7 #ja-cssmenu li li li.havesubchildsfhover ul, body.IE7 #ja-cssmenu li li li.havesubchild-activesfhover ul, body.IE7 #ja-cssmenu li li li.activesfhover ul,
    
  443. body.OPE #ja-cssmenu li.sfhover ul, body.OPE #ja-cssmenu li.havechildsfhover ul, body.OPE #ja-cssmenu li.havechild-activesfhover ul, body.OPE #ja-cssmenu li.activesfhover ul,
    
  444. body.OPE #ja-cssmenu li li.sfhover ul, body.OPE #ja-cssmenu li li.havesubchildsfhover ul, body.OPE #ja-cssmenu li li.havesubchild-activesfhover ul, body.OPE #ja-cssmenu li li.activesfhover ul,
    
  445. body.OPE #ja-cssmenu li li li.sfhover ul, body.OPE #ja-cssmenu li li li.havesubchildsfhover ul, body.OPE #ja-cssmenu li li li.havesubchild-activesfhover ul, body.OPE #ja-cssmenu li li li.activesfhover ul {
    
  446.         top: auto;
    
  447. }
    
  448.  
    
  449. /* TYPOGRAPY FIX FOR RTL */
    
  450. pre, .code {
    
  451.         border-right: 5px solid #999999;
    
  452.         border-left: none;
    
  453. }
    
  454.  
    
  455. blockquote {
    
  456.         padding: 1em 40px 1em 15px;
    
  457. }
    
  458.  
    
  459. blockquote span.open {
    
  460.         float: right;
    
  461.         padding: 0 20px 0 0;
    
  462.         background-position: right top;
    
  463. }
    
  464.  
    
  465. blockquote span.close {
    
  466.         padding: 0 0 0 20px;
    
  467.         background-position: bottom left;
    
  468. }
    
  469.  
    
  470. /* Small quote */
    
  471. .small-quote span.open-quote {
    
  472.         padding-left: 20px;
    
  473.         background-position: center left;
    
  474. }
    
  475.  
    
  476. .small-quote span.close-quote {
    
  477.         padding-right: 20px;
    
  478.         background-position: center right;
    
  479. }
    
  480.  
    
  481. .small-quote span.author {
    
  482.         padding: 2px 20px 2px 5px;
    
  483.         background-position: 99% 4px;
    
  484. }
    
  485.  
    
  486. /* Dropcap */
    
  487. .dropcap {
    
  488.         float: right;
    
  489.         padding: 4px 0 0 8px;
    
  490. }
    
  491.  
    
  492. /* Note Style */
    
  493. p.stickynote {
    
  494.         padding: 10px 40px 10px 0;
    
  495.         background-position: 99% 50%;
    
  496. }
    
  497.  
    
  498. p.download {
    
  499.         padding: 10px 40px 10px 0;
    
  500.         background-position: 99% 50%;
    
  501. }
    
  502.  
    
  503. .blocknumber {
    
  504.         clear: both;
    
  505.         padding: 5px 15px 10px;
    
  506.         position: relative;
    
  507. }
    
  508.  
    
  509. /* Check list */
    
  510. ul.checklist {
    
  511.         list-style: none;
    
  512. }
    
  513.  
    
  514. ul.checklist li {
    
  515.         margin-right: 15px;
    
  516.         padding: 0 20px 5px 0px;
    
  517.         background-position: right 3px;
    
  518. }
    
  519. /* Small checklist */
    
  520. ul.small-checklist {
    
  521.         list-style: none;
    
  522. }
    
  523.  
    
  524. ul.small-checklist li {
    
  525.         margin-right: 15px;
    
  526.         padding: 0 20px 5px 0;
    
  527.         background-position: right 3px;
    
  528. }
    
  529.  
    
  530. /* Check list */
    
  531. ul.stars {
    
  532.         list-style: none;
    
  533. }
    
  534.  
    
  535. ul.stars li {
    
  536.         margin-right: 15px;
    
  537.         padding: 0px 20px 5px 0;
    
  538.         background-position: right 3px;
    
  539. }
    
  540.  
    
  541. .IE7 ul li, 
    
  542. .IE7 ul.checklist li, 
    
  543. .IE7 ul.small-checklist li,
    
  544. .IE7 ul.stars li
    
  545. {
    
  546.         padding-right: 40px;
    
  547. }
    
  548.  
    
  549. /* Tips, Error, Message, Hightlight*/
    
  550. p.error {
    
  551.         padding-right: 25px;
    
  552.         background-position: top right;
    
  553. }
    
  554.  
    
  555. p.message {
    
  556.         padding-right: 25px;
    
  557.         background-position: top right;
    
  558. }
    
  559.  
    
  560. p.tips {
    
  561.         padding-right: 25px;
    
  562.         background-position: top right;
    
  563. }
    
  564.  
    
  565. /* Bignumber */
    
  566. .bignumber {
    
  567.         float: right;
    
  568.         margin-left: 8px;
    
  569.         padding: 6px 7px;
    
  570.         display: block;
    
  571.         background-position: top right;
    
  572. }
    
  573.  
    
  574. /* Talking box. Thinking box. */
    
  575. div.bubble1 span.author,
    
  576. div.bubble2 span.author,
    
  577. div.bubble3 span.author,
    
  578. div.bubble4 span.author {
    
  579.         padding-right: 15px;
    
  580.         margin-right: 15px;
    
  581.         background-position: center right;
    
  582.         float: right;
    
  583. }
    
  584.  
    
  585. div.bubble1 div {
    
  586.         background: url(../images/rtl/bub12-br.gif) no-repeat bottom left;
    
  587. }
    
  588.  
    
  589. div.bubble1 div div {
    
  590.         background: url(../images/rtl/bub12-bl.gif) no-repeat bottom right;
    
  591. }
    
  592.  
    
  593. div.bubble1 div div div {
    
  594.         background: url(../images/rtl/bub12-tr.gif) no-repeat top left;
    
  595. }
    
  596.  
    
  597. div.bubble1 div div div div {
    
  598.         background: url(../images/rtl/bub12-tl.gif) no-repeat top right;
    
  599. }
    
  600.  
    
  601. div.bubble2 div {
    
  602.         background: url(../images/rtl/bub22-br.gif) no-repeat bottom left;
    
  603. }
    
  604.  
    
  605. div.bubble2 div div {
    
  606.         background: url(../images/rtl/bub22-bl.gif) no-repeat bottom right;
    
  607. }
    
  608.  
    
  609. div.bubble2 div div div {
    
  610.         background: url(../images/rtl/bub22-tr.gif) no-repeat top left;
    
  611. }
    
  612.  
    
  613. div.bubble2 div div div div {
    
  614.         background: url(../images/rtl/bub22-tl.gif) no-repeat top right;
    
  615. }
    
  616.  
    
  617. div.bubble3 div {
    
  618.         background: url(../images/rtl/bub32-br.gif) no-repeat bottom left;
    
  619. }
    
  620.  
    
  621. div.bubble3 div div {
    
  622.         background: url(../images/rtl/bub32-bl.gif) no-repeat bottom right;
    
  623. }
    
  624.  
    
  625. div.bubble3 div div div {
    
  626.         background: url(../images/rtl/bub32-tr.gif) no-repeat top left;
    
  627. }
    
  628.  
    
  629. div.bubble3 div div div div {
    
  630.         background: url(../images/rtl/bub32-tl.gif) no-repeat top right;
    
  631. }
    
  632.  
    
  633. div.bubble4 div {
    
  634.         background: url(../images/rtl/bub42-br.gif) no-repeat bottom left;
    
  635. }
    
  636.  
    
  637. div.bubble4 div div {
    
  638.         background: url(../images/rtl/bub42-bl.gif) no-repeat bottom right;
    
  639. }
    
  640.  
    
  641. div.bubble4 div div div {
    
  642.         background: url(../images/rtl/bub42-tr.gif) no-repeat top left;
    
  643. }
    
  644.  
    
  645. div.bubble4 div div div div {
    
  646.         background: url(../images/rtl/bub42-tl.gif) no-repeat top right;
    
  647. }
    
  648.  
    
  649. /* Legend */
    
  650. .legend-title {
    
  651.         display: block;
    
  652.         float: left;
    
  653.         right: 7px;
    
  654.         left: auto;
    
  655. }