[8384] | 1 | /*----------------------------------------------------------
|
---|
| 2 | The base color for this template is #5c87b2. If you'd like
|
---|
| 3 | to use a different color start by replacing all instances of
|
---|
| 4 | #5c87b2 with your new color.
|
---|
| 5 | ----------------------------------------------------------*/
|
---|
| 6 | body {
|
---|
| 7 | background-color: #5c87b2;
|
---|
| 8 | font-size: .85em;
|
---|
| 9 | font-family: "Trebuchet MS", Verdana, Helvetica, Sans-Serif;
|
---|
| 10 | margin: 0;
|
---|
| 11 | padding: 0;
|
---|
| 12 | color: #696969;
|
---|
| 13 | }
|
---|
| 14 |
|
---|
| 15 | a:link {
|
---|
| 16 | color: #034af3;
|
---|
| 17 | text-decoration: underline;
|
---|
| 18 | }
|
---|
| 19 |
|
---|
| 20 | a:visited {
|
---|
| 21 | color: #505abc;
|
---|
| 22 | }
|
---|
| 23 |
|
---|
| 24 | a:hover {
|
---|
| 25 | color: #1d60ff;
|
---|
| 26 | text-decoration: none;
|
---|
| 27 | }
|
---|
| 28 |
|
---|
| 29 | a:active {
|
---|
| 30 | color: #12eb87;
|
---|
| 31 | }
|
---|
| 32 |
|
---|
| 33 | p, ul {
|
---|
| 34 | margin-bottom: 20px;
|
---|
| 35 | line-height: 1.6em;
|
---|
| 36 | }
|
---|
| 37 |
|
---|
| 38 | header,
|
---|
| 39 | footer,
|
---|
| 40 | nav,
|
---|
| 41 | section {
|
---|
| 42 | display: block;
|
---|
| 43 | }
|
---|
| 44 |
|
---|
| 45 | /* HEADINGS
|
---|
| 46 | ----------------------------------------------------------*/
|
---|
| 47 | h1, h2, h3, h4, h5, h6 {
|
---|
| 48 | font-size: 1.5em;
|
---|
| 49 | color: #000;
|
---|
| 50 | }
|
---|
| 51 |
|
---|
| 52 | h1 {
|
---|
| 53 | font-size: 2em;
|
---|
| 54 | padding-bottom: 0;
|
---|
| 55 | margin-bottom: 0;
|
---|
| 56 | }
|
---|
| 57 |
|
---|
| 58 | h2 {
|
---|
| 59 | padding: 0 0 10px 0;
|
---|
| 60 | }
|
---|
| 61 |
|
---|
| 62 | h3 {
|
---|
| 63 | font-size: 1.2em;
|
---|
| 64 | }
|
---|
| 65 |
|
---|
| 66 | h4 {
|
---|
| 67 | font-size: 1.1em;
|
---|
| 68 | }
|
---|
| 69 |
|
---|
| 70 | h5, h6 {
|
---|
| 71 | font-size: 1em;
|
---|
| 72 | }
|
---|
| 73 |
|
---|
| 74 | /* PRIMARY LAYOUT ELEMENTS
|
---|
| 75 | ----------------------------------------------------------*/
|
---|
| 76 |
|
---|
| 77 | /* you can specify a greater or lesser percentage for the
|
---|
| 78 | page width. Or, you can specify an exact pixel width. */
|
---|
| 79 | .page {
|
---|
| 80 | width: 90%;
|
---|
| 81 | margin-left: auto;
|
---|
| 82 | margin-right: auto;
|
---|
| 83 | }
|
---|
| 84 |
|
---|
| 85 | header, #header {
|
---|
| 86 | position: relative;
|
---|
| 87 | margin-bottom: 0px;
|
---|
| 88 | color: #000;
|
---|
| 89 | padding: 0;
|
---|
| 90 | }
|
---|
| 91 |
|
---|
| 92 | header h1, #header h1 {
|
---|
| 93 | font-weight: bold;
|
---|
| 94 | padding: 5px 0;
|
---|
| 95 | margin: 0;
|
---|
| 96 | color: #fff;
|
---|
| 97 | border: none;
|
---|
| 98 | line-height: 2em;
|
---|
| 99 | font-size: 32px !important;
|
---|
| 100 | text-shadow: 1px 1px 2px #111;
|
---|
| 101 | }
|
---|
| 102 |
|
---|
| 103 | #main {
|
---|
| 104 | padding: 30px 30px 15px 30px;
|
---|
| 105 | background-color: #fff;
|
---|
| 106 | border-radius: 4px 0 0 0;
|
---|
| 107 | -webkit-border-radius: 4px 0 0 0;
|
---|
| 108 | -moz-border-radius: 4px 0 0 0;
|
---|
| 109 | }
|
---|
| 110 |
|
---|
| 111 | footer,
|
---|
| 112 | #footer {
|
---|
| 113 | background-color: #fff;
|
---|
| 114 | color: #999;
|
---|
| 115 | padding: 10px 0;
|
---|
| 116 | text-align: center;
|
---|
| 117 | line-height: normal;
|
---|
| 118 | margin: 0 0 30px 0;
|
---|
| 119 | font-size: .9em;
|
---|
| 120 | border-radius: 0 0 4px 4px;
|
---|
| 121 | -webkit-border-radius: 0 0 4px 4px;
|
---|
| 122 | -moz-border-radius: 0 0 4px 4px;
|
---|
| 123 | }
|
---|
| 124 |
|
---|
| 125 | /* TAB MENU
|
---|
| 126 | ----------------------------------------------------------*/
|
---|
| 127 | ul#menu {
|
---|
| 128 | border-bottom: 1px #5C87B2 solid;
|
---|
| 129 | padding: 0 0 2px;
|
---|
| 130 | position: relative;
|
---|
| 131 | margin: 0;
|
---|
| 132 | text-align: right;
|
---|
| 133 | }
|
---|
| 134 |
|
---|
| 135 | ul#menu li {
|
---|
| 136 | display: inline;
|
---|
| 137 | list-style: none;
|
---|
| 138 | }
|
---|
| 139 |
|
---|
| 140 | ul#menu li#greeting {
|
---|
| 141 | padding: 10px 20px;
|
---|
| 142 | font-weight: bold;
|
---|
| 143 | text-decoration: none;
|
---|
| 144 | line-height: 2.8em;
|
---|
| 145 | color: #fff;
|
---|
| 146 | }
|
---|
| 147 |
|
---|
| 148 | ul#menu li a {
|
---|
| 149 | padding: 10px 20px;
|
---|
| 150 | font-weight: bold;
|
---|
| 151 | text-decoration: none;
|
---|
| 152 | line-height: 2.8em;
|
---|
| 153 | background-color: #e8eef4;
|
---|
| 154 | color: #034af3;
|
---|
| 155 | border-radius: 4px 4px 0 0;
|
---|
| 156 | -webkit-border-radius: 4px 4px 0 0;
|
---|
| 157 | -moz-border-radius: 4px 4px 0 0;
|
---|
| 158 | }
|
---|
| 159 |
|
---|
| 160 | ul#menu li a:hover {
|
---|
| 161 | background-color: #fff;
|
---|
| 162 | text-decoration: none;
|
---|
| 163 | }
|
---|
| 164 |
|
---|
| 165 | ul#menu li a:active {
|
---|
| 166 | background-color: #a6e2a6;
|
---|
| 167 | text-decoration: none;
|
---|
| 168 | }
|
---|
| 169 |
|
---|
| 170 | ul#menu li.selected a {
|
---|
| 171 | background-color: #fff;
|
---|
| 172 | color: #000;
|
---|
| 173 | }
|
---|
| 174 |
|
---|
| 175 | /* FORM LAYOUT ELEMENTS
|
---|
| 176 | ----------------------------------------------------------*/
|
---|
| 177 |
|
---|
| 178 | fieldset {
|
---|
| 179 | border: 1px solid #ddd;
|
---|
| 180 | padding: 0 1.4em 1.4em 1.4em;
|
---|
| 181 | margin: 0 0 1.5em 0;
|
---|
| 182 | }
|
---|
| 183 |
|
---|
| 184 | legend {
|
---|
| 185 | font-size: 1.2em;
|
---|
| 186 | font-weight: bold;
|
---|
| 187 | }
|
---|
| 188 |
|
---|
| 189 | textarea {
|
---|
| 190 | min-height: 75px;
|
---|
| 191 | }
|
---|
| 192 |
|
---|
| 193 | input[type="text"],
|
---|
| 194 | input[type="password"] {
|
---|
| 195 | border: 1px solid #ccc;
|
---|
| 196 | padding: 2px;
|
---|
| 197 | font-size: 1.2em;
|
---|
| 198 | color: #444;
|
---|
| 199 | width: 200px;
|
---|
| 200 | }
|
---|
| 201 |
|
---|
[9062] | 202 | input[type="text"]
|
---|
| 203 | {
|
---|
| 204 | width: 200px;
|
---|
| 205 | }
|
---|
| 206 |
|
---|
[8384] | 207 | select {
|
---|
| 208 | border: 1px solid #ccc;
|
---|
| 209 | padding: 2px;
|
---|
| 210 | font-size: 1.2em;
|
---|
| 211 | color: #444;
|
---|
| 212 | }
|
---|
| 213 |
|
---|
| 214 | input[type="submit"] {
|
---|
| 215 | font-size: 1.2em;
|
---|
| 216 | padding: 5px;
|
---|
| 217 | }
|
---|
| 218 |
|
---|
| 219 | /* TABLE
|
---|
| 220 | ----------------------------------------------------------*/
|
---|
| 221 |
|
---|
| 222 | table {
|
---|
| 223 | border: solid 1px #e8eef4;
|
---|
| 224 | border-collapse: collapse;
|
---|
| 225 | }
|
---|
| 226 |
|
---|
| 227 | table td {
|
---|
| 228 | padding: 5px;
|
---|
| 229 | border: solid 1px #e8eef4;
|
---|
| 230 | }
|
---|
| 231 |
|
---|
| 232 | table th {
|
---|
| 233 | padding: 6px 5px;
|
---|
| 234 | text-align: left;
|
---|
| 235 | background-color: #e8eef4;
|
---|
| 236 | border: solid 1px #e8eef4;
|
---|
| 237 | }
|
---|
| 238 |
|
---|
| 239 | /* MISC
|
---|
| 240 | ----------------------------------------------------------*/
|
---|
| 241 | .clear {
|
---|
| 242 | clear: both;
|
---|
| 243 | }
|
---|
| 244 |
|
---|
| 245 | .error {
|
---|
| 246 | color: Red;
|
---|
| 247 | }
|
---|
| 248 |
|
---|
| 249 | nav,
|
---|
| 250 | #menucontainer {
|
---|
| 251 | margin-top: 40px;
|
---|
| 252 | }
|
---|
| 253 |
|
---|
| 254 | div#title {
|
---|
| 255 | display: block;
|
---|
| 256 | float: left;
|
---|
| 257 | text-align: left;
|
---|
| 258 | }
|
---|
| 259 |
|
---|
| 260 | #logindisplay {
|
---|
| 261 | font-size: 1.1em;
|
---|
| 262 | display: block;
|
---|
| 263 | text-align: right;
|
---|
| 264 | margin: 10px;
|
---|
| 265 | color: White;
|
---|
| 266 | }
|
---|
| 267 |
|
---|
| 268 | #logindisplay a:link {
|
---|
| 269 | color: white;
|
---|
| 270 | text-decoration: underline;
|
---|
| 271 | }
|
---|
| 272 |
|
---|
| 273 | #logindisplay a:visited {
|
---|
| 274 | color: white;
|
---|
| 275 | text-decoration: underline;
|
---|
| 276 | }
|
---|
| 277 |
|
---|
| 278 | #logindisplay a:hover {
|
---|
| 279 | color: white;
|
---|
| 280 | text-decoration: none;
|
---|
| 281 | }
|
---|
| 282 |
|
---|
| 283 | /* Styles for validation helpers
|
---|
| 284 | -----------------------------------------------------------*/
|
---|
| 285 | .field-validation-error {
|
---|
| 286 | color: #ff0000;
|
---|
| 287 | }
|
---|
| 288 |
|
---|
| 289 | .field-validation-valid {
|
---|
| 290 | display: none;
|
---|
| 291 | }
|
---|
| 292 |
|
---|
| 293 | .input-validation-error {
|
---|
| 294 | border: 1px solid #ff0000;
|
---|
| 295 | background-color: #ffeeee;
|
---|
| 296 | }
|
---|
| 297 |
|
---|
| 298 | .validation-summary-errors {
|
---|
| 299 | font-weight: bold;
|
---|
| 300 | color: #ff0000;
|
---|
| 301 | }
|
---|
| 302 |
|
---|
| 303 | .validation-summary-valid {
|
---|
| 304 | display: none;
|
---|
| 305 | }
|
---|
| 306 |
|
---|
| 307 | /* Styles for editor and display helpers
|
---|
| 308 | ----------------------------------------------------------*/
|
---|
| 309 | .display-label,
|
---|
| 310 | .editor-label {
|
---|
| 311 | margin: 1em 0 0 0;
|
---|
| 312 | }
|
---|
| 313 |
|
---|
| 314 | .display-field,
|
---|
| 315 | .editor-field {
|
---|
| 316 | margin: 0.5em 0 0 0;
|
---|
| 317 | }
|
---|
| 318 |
|
---|
| 319 | .text-box {
|
---|
| 320 | width: 30em;
|
---|
| 321 | }
|
---|
| 322 |
|
---|
| 323 | .text-box.multi-line {
|
---|
| 324 | height: 6.5em;
|
---|
| 325 | }
|
---|
| 326 |
|
---|
| 327 | .tri-state {
|
---|
| 328 | width: 6em;
|
---|
| 329 | }
|
---|
[9062] | 330 |
|
---|
| 331 | div.scroll
|
---|
| 332 | {
|
---|
| 333 | height: 400px;
|
---|
| 334 | width: 400px;
|
---|
| 335 | overflow: auto;
|
---|
[9215] | 336 | }
|
---|
| 337 |
|
---|
| 338 | .dragables
|
---|
| 339 | {
|
---|
| 340 | height :100px;
|
---|
| 341 | width:100px;
|
---|
| 342 | border:1px solid #000000;
|
---|
| 343 | background: #EEEEEE;
|
---|
| 344 | padding: 5px 5px 5px 5px;
|
---|
| 345 | margin: 5px 5px 5px 5px;
|
---|
| 346 | float: left;
|
---|
| 347 | }
|
---|
| 348 |
|
---|
| 349 | .clearer
|
---|
| 350 | {
|
---|
| 351 | clear:both;
|
---|
| 352 | }
|
---|
| 353 |
|
---|
| 354 | .treeStyle
|
---|
| 355 | {
|
---|
| 356 | border: 1px solid black;
|
---|
| 357 | }
|
---|