| 1 | html, body { background-color:#f0f0ee; color:#222; } |
|---|
| 2 | |
|---|
| 3 | /* Make the page full bleed */ |
|---|
| 4 | #doc3 { margin:0; } |
|---|
| 5 | |
|---|
| 6 | /* Header */ |
|---|
| 7 | #hd { padding:1.2em 1.5em 0 1.5em; background-color:#7a1818; } |
|---|
| 8 | h1 { font-size:230%; color:#fff; } |
|---|
| 9 | |
|---|
| 10 | #navigation { margin-top:1.5em; background-color:#262626; height:1%; } |
|---|
| 11 | #navigation li { float:left; display:inline; } |
|---|
| 12 | #navigation li a { display:block; color:#fff; text-decoration:none; } |
|---|
| 13 | #navigation li a:hover { text-decoration:underline; } |
|---|
| 14 | |
|---|
| 15 | #primary-navigation li a { font-size:116%; padding:0.4em 1em; } |
|---|
| 16 | #primary-navigation li.active a { background-color:#f0f0ee; color:#000; } |
|---|
| 17 | |
|---|
| 18 | #user-navigation { float:right; } |
|---|
| 19 | #user-navigation li a { font-size:93%; padding:0.5em 1em; } |
|---|
| 20 | |
|---|
| 21 | /* Body */ |
|---|
| 22 | #bd { padding:1.5em; } |
|---|
| 23 | h2 { font-size:153.9%; margin-bottom:0.5em; } |
|---|
| 24 | h3 { font-size:153.9%; margin-bottom:0.5em; } |
|---|
| 25 | |
|---|
| 26 | /* Basic block */ |
|---|
| 27 | .block { margin-bottom:1.5em; } |
|---|
| 28 | .block .hd { background-color:#7a1818; padding:0.7em 1em; color:#fff; |
|---|
| 29 | border-bottom:10px solid #262626; } |
|---|
| 30 | .block .hd h2, .block .hd h3 { font-size:100%; margin-bottom:0; } |
|---|
| 31 | .block .bd { padding:1em; background-color:#fff; } |
|---|
| 32 | .block .bd h1 { color:#7a1818; } |
|---|
| 33 | .block .bd h2 { color:#7a1818; } |
|---|
| 34 | .block .bd h3 { color:#7a1818; } |
|---|
| 35 | |
|---|
| 36 | /* Extend block with tabs */ |
|---|
| 37 | .tabs .hd { padding:0; } |
|---|
| 38 | .tabs .hd ul { height:1%; } |
|---|
| 39 | .tabs .hd ul li { float:left; } |
|---|
| 40 | .tabs .hd ul li a { display:block; color:#fff; text-decoration:none; |
|---|
| 41 | padding:0.5em 1em; } |
|---|
| 42 | .tabs .hd ul li a:hover { background-color:#470E0E; } |
|---|
| 43 | .tabs .hd ul li.active a { background-color:#262626 !important; color:#fff; |
|---|
| 44 | text-decoration:none; } /* important! fixes IE cascade issue */ |
|---|
| 45 | .tabs .hd h2, .tabs .hd h3 { position:absolute; |
|---|
| 46 | margin-left:-5000px; } /* Hidden SEO Header if needed */ |
|---|
| 47 | |
|---|
| 48 | /* Extend tab block with spaced tabs */ |
|---|
| 49 | .spaces .hd { background-color:transparent; } |
|---|
| 50 | .spaces .hd ul li { background-color:#7a1818; margin-right:0.1em; } |
|---|
| 51 | |
|---|
| 52 | /* Extend block and header to have rounded corners */ |
|---|
| 53 | .rounded .hd, |
|---|
| 54 | .rounded .hd ul li, |
|---|
| 55 | .rounded .hd ul li a, |
|---|
| 56 | .rounded #navigation, |
|---|
| 57 | .rounded #navigation ul li, |
|---|
| 58 | .rounded #navigation ul li a { |
|---|
| 59 | -moz-border-radius-topright:7px; |
|---|
| 60 | -moz-border-radius-topleft:7px; |
|---|
| 61 | -webkit-border-top-right-radius:7px; |
|---|
| 62 | -webkit-border-top-left-radius:7px; |
|---|
| 63 | } |
|---|
| 64 | |
|---|
| 65 | /* Style the horizontal rules inside .block */ |
|---|
| 66 | .block hr { background-color:#f0f0ee; color:#f0f0ee; height:1px; border:0; } |
|---|
| 67 | |
|---|
| 68 | /* Tables */ |
|---|
| 69 | table { width:100%; margin-bottom:2em; } |
|---|
| 70 | table td, table th { padding:0.5em; } |
|---|
| 71 | table thead { background-color:#262626; color:#fff; font-weight:bold; } |
|---|
| 72 | table thead a { text-decoration:none; color:#fff; } |
|---|
| 73 | table thead a:hover { text-decoration:underline; } |
|---|
| 74 | table tbody a { text-decoration:underline; } |
|---|
| 75 | |
|---|
| 76 | table.zebra tbody tr:nth-child(even) {background: #eee} |
|---|
| 77 | table.zebra tbody tr:nth-child(odd) {background: #fff} |
|---|
| 78 | |
|---|
| 79 | |
|---|
| 80 | |
|---|
| 81 | /* Pager control*/ |
|---|
| 82 | ul.pager { text-align:right; } |
|---|
| 83 | ul.pager li { display:inline; } |
|---|
| 84 | ul.pager li a { padding:0.1em 0.3em; margin-right:0.3em; border:1px solid #000; |
|---|
| 85 | text-decoration:none; color:#000; } |
|---|
| 86 | ul.pager li.active a, ul.pager li a:hover { background-color:#000; color:#fff; } |
|---|
| 87 | |
|---|
| 88 | |
|---|
| 89 | |
|---|
| 90 | /* Forms */ |
|---|
| 91 | form label { font-weight:bold; } |
|---|
| 92 | form label span { font-weight:normal; color:#f00; font-size:85%; } |
|---|
| 93 | form span.info { font-style:italic; color:#aaa; font-size:85%; } |
|---|
| 94 | form .text { display:block; width:99%; border:1px solid #aaa; padding:0.3em; } |
|---|
| 95 | form .column { width:48%; } |
|---|
| 96 | form .left { float:left; } |
|---|
| 97 | form .right { float:right; } |
|---|
| 98 | |
|---|
| 99 | /* Messages */ |
|---|
| 100 | .alert { padding:0.5em; text-align:center; } |
|---|
| 101 | .error { border:2px solid #fbb; background-color:#fdd; } |
|---|
| 102 | .warning { border:2px solid #fffaaa; background-color:#ffc; } |
|---|
| 103 | .notice { border:2px solid #1fdf00; background-color:#bbffb6; } |
|---|
| 104 | |
|---|
| 105 | /* Lists */ |
|---|
| 106 | ol.list, ul.list, dl.list { margin-left:2em; margin-bottom:1em; } |
|---|
| 107 | ol.list li { list-style:decimal outside; } |
|---|
| 108 | ul.list li { list-style:disc outside; } |
|---|
| 109 | dl.list dd { margin-left:1em; } |
|---|
| 110 | |
|---|
| 111 | ul.biglist { margin-bottom:1em; } |
|---|
| 112 | ul.biglist li { margin-top:-1px; border:1px solid #f0f0ee; |
|---|
| 113 | border-width:1px 0 1px 0; } |
|---|
| 114 | ul.biglist li a { display:block; padding:0.5em 0; text-decoration:none; |
|---|
| 115 | color:#000; } |
|---|
| 116 | ul.biglist li a:hover { text-decoration:underline; } |
|---|
| 117 | |
|---|
| 118 | /* Footer */ |
|---|
| 119 | #ft { text-align:center; font-size:85%; padding:0.5em 1em; color:#262626; } |
|---|
| 120 | |
|---|
| 121 | /* Generics */ |
|---|
| 122 | p { margin-bottom:1em; } |
|---|
| 123 | a { color:#7a1818; } |
|---|
| 124 | strong { font-weight:bold; } |
|---|
| 125 | em { font-style:italic; } |
|---|
| 126 | abbr, acronym { border-bottom:1px dotted #000; cursor:help; } |
|---|
| 127 | |
|---|
| 128 | .small { font-size:85%; } |
|---|
| 129 | .gray { color:#999; } |
|---|
| 130 | .highlight { background-color:#ffffcc; } |
|---|
| 131 | .clear { clear:both; } |
|---|
| 132 | .text-left { text-align:left; } |
|---|
| 133 | .text-right { text-align:right; } |
|---|
| 134 | .text-center { text-align:center; } |
|---|
| 135 | |
|---|
| 136 | /* datepicker */ |
|---|
| 137 | .ui-datepicker { background-color:#e0e0dd; } |
|---|
| 138 | .ui-datepicker-title { font-weight: bold; } |
|---|
| 139 | |
|---|
| 140 | /* use monospace font in textearea-based widgets */ |
|---|
| 141 | div.widget textarea { font-family: monospace; } |
|---|
