css/joomla.css

   1 /* joomla.css: Joomla-specific css directives for CiviCRM. */
   2
   3 /*
   4 ** HTML elements
   5 */
   6 div#toolbar-box .icon-48-generic {
   7   display: none;
   8 }
   9
  10 div#toolbar-box {
  11   height: 26px;
  12 }
  13
  14 fieldset {
  15   margin-bottom: 1em;
  16   padding: .5em;
  17 }
  18 form {
  19   margin: 0;
  20   padding: 0;
  21 }
  22 hr {
  23   height: 1px;
  24   border: 1px solid gray;
  25 }
  26 img {
  27   border: 0;
  28 }
  29 /* Added in CiviCRM 2.0 to alleviate tiny font issues. */
  30 #crm-container tr, #crm-container tr td {
  31   font-size: 1em;
  32 }
  33
  34 /* Added in CiviCRM 2.1 to overwrite tiny font in TinyMCE editor. */
  35 #crm-container #content table.mceLayout td {
  36   font-size: 0em;
  37 }
  38
  39 th {
  40   text-align: left;
  41   padding-right: 1em;
  42   border-bottom: 3px solid #ccc;
  43   white-space: nowrap;
  44 }
  45 th.active img {
  46   display: inline;
  47 }
  48 tr.dark, tr.light {
  49   background-color: #eee;
  50   border-bottom: 1px solid #ccc;
  51   padding: 0.1em 0.6em;
  52 }
  53
  54 td.active {
  55   background-color: #ddd;
  56 }
  57
  58 /*
  59 ** Menu styles
  60 */
  61 #crm-container .menu {
  62   padding: 0 0 0 0.5em;
  63   margin: 0 0 0 2em;
  64 }
  65 #crm-container .menu ul {
  66   list-style: none;
  67   border: none;
  68   text-align:left;
  69 }
  70 #crm-container .menu li a {
  71   width: 100%;
  72   text-decoration: none;
  73 }
  74 #crm-container li.expanded {
  75   list-style-type: circle;
  76   list-style-image: url(menu-expanded.png);
  77   padding: 0.2em 0.5em 0 0;
  78   margin: 0;
  79 }
  80 #crm-container li.collapsed {
  81   list-style-type: disc;
  82   list-style-image: url(menu-collapsed.png);
  83   padding: 0.2em 0.5em 0 0;
  84   margin: 0;
  85 }
  86 #crm-container li a.active {
  87   color: #000;
  88 }
  89 #crm-container td.menu-disabled {
  90   background: #ccc;
  91 }
  92
  93 /* Tab navigation */
  94 #crm-container .tabs {
  95   margin: 0 0 0.5em 0.5em;
  96 }
  97 #crm-container ul.primary {
  98   border-collapse: collapse;
  99   padding: 0 0 0 1em;
 100   white-space: nowrap;
 101   list-style: none;
 102   margin: 5px;
 103   height: auto;
 104   line-height: normal;
 105   border-bottom: 1px solid #bbb;
 106 }
 107 #crm-container ul.primary li {
 108   display: inline;
 109 }
 110 #crm-container ul.primary li a {
 111   background-color: #ddd;
 112   border-color: #bbb;
 113   border-width: 1px;
 114   border-style: solid solid none solid;
 115   height: auto;
 116   margin-right: 0.5em;
 117   padding: 0 1em;
 118   text-decoration: none;
 119 }
 120 #crm-container ul.primary li.active a {
 121   background-color: #fff;
 122   border: 1px solid #bbb;
 123   border-bottom: #fff 1px solid;
 124 }
 125 #crm-container ul.primary li a:hover {
 126   background-color: #eee;
 127   border-color: #ccc;
 128   border-bottom-color: #eee;
 129 }
 130 #crm-container ul.secondary {
 131   border-bottom: 1px solid #bbb;
 132   padding: 0.5em 1em 0.5em 1em;
 133   margin: 5px;
 134 }
 135 #crm-container ul.secondary li {
 136   display: inline;
 137   padding: 0 1em;
 138   border-right: 1px solid #ccc;
 139 }
 140 #crm-container ul.secondary a {
 141   padding: 0;
 142   text-decoration: none;
 143 }
 144 #crm-container ul.secondary a.active {
 145   border-bottom: 4px solid #999;
 146 }
 147
 148 /*
 149 ** Other common styles
 150 */
 151 .breadcrumb {
 152   padding-bottom: .5em
 153 }
 154 .block ul {
 155   margin: 0;
 156   padding: 0 0 0.25em 1em;
 157 }
 158 br.clear {
 159   clear: both;
 160   height: 0px;
 161 }
 162 .container-inline div {
 163   display: inline;
 164 }
 165 .container-inline .form-submit {
 166   margin: 0;
 167 }
 168 .item-list .icon {
 169   color: #555;
 170   float: right;
 171   padding-left: 0.25em;
 172   clear: right;
 173 }
 174 .item-list .icon a {
 175   color: #000;
 176   text-decoration: none;
 177 }
 178 .item-list .icon a:hover {
 179   color: #000;
 180   text-decoration: none;
 181 }
 182 .item-list .title {
 183   font-weight: bold;
 184 }
 185 .item-list ul {
 186   margin: 0 0 0.75em 0;
 187   padding: 0;
 188 }
 189 .item-list ul li {
 190   margin: 0 0 0.25em 1.5em;
 191   padding: 0;
 192   list-style: disc;
 193 }
 194 .form-item {
 195   margin-top: 1em;
 196   margin-bottom: 1em;
 197 }
 198 tr.light .form-item, tr.dark .form-item {
 199   margin-top: 0;
 200   margin-bottom: 0;
 201   white-space: nowrap;
 202 }
 203 .form-item input.error, .form-item textarea.error {
 204   border: 2px solid red;
 205 }
 206 /* Override .9em field help size from civicrm.css - CiviCRM 2.0 */
 207 #crm-container div.description, #crm-container span.description, #crm-container dd.description {
 208   font-size: 1em;
 209 }
 210 #crm-container div.description, #crm-container span.description {
 211    margin: 2px 0 15px 0;
 212    display: block;
 213 }
 214 .form-item label {
 215   font-weight: bold;
 216 }
 217 .form-item label.option {
 218   font-weight: normal;
 219 }
 220 .form-submit {
 221   margin: 0.5em 0;
 222 }
 223 .marker, .form-required {
 224   color: #f00;
 225 }
 226 .more-link {
 227   text-align: right;
 228 }
 229 #pager {
 230   clear: both;
 231   text-align: center;
 232 }
 233 #pager div {
 234   padding: 0.5em;
 235 }
 236 .tips {
 237   margin-top: 0;
 238   margin-bottom: 0;
 239   padding-top: 0;
 240   padding-bottom: 0;
 241   font-size: 0.9em;
 242 }
 243 .more-help-link {
 244   font-size: 0.85em;
 245   text-align: right;
 246 }
 247
 248
 249 /* Stylesheet elements ported from Drupal Bluemarine them */
 250 /*
 251 ** HTML elements
 252 */
 253 body {
 254   padding: 0;
 255   color: #000;
 256   background-color: #fff;
 257 }
 258 tr.dark td, tr.light td {
 259   padding: 0.3em;
 260 }
 261 h1, h2, h3, h4, h5, h6 {
 262   margin-bottom: 0.5em;
 263 }
 264 h1 {
 265   font-size: 1.3em;
 266 }
 267 h2 {
 268   font-size: 1.2em;
 269 }
 270 h3, h4, h5, h6 {
 271   font-size: 1.1em;
 272 }
 273 p {
 274   margin-top: 0.5em;
 275   margin-bottom: 0.9em;
 276 }
 277 a {
 278   text-decoration: none;
 279 }
 280 a:link {
 281   color: #39c;
 282 }
 283 a:visited {
 284   color: #369;
 285 }
 286 a:hover {
 287   color: #39c;
 288   text-decoration: underline;
 289 }
 290 fieldset {
 291   border: 1px solid #ccc;
 292 }
 293 pre {
 294   background-color: #eee;
 295   padding: 0.75em 1.5em;
 296   font-size: 12px;
 297   border: 1px solid #ddd;
 298 }
 299 table {
 300   /* make <td> sizes relative to body size! */
 301   font-size: 1em;
 302 }
 303 .form-item label {
 304   font-size: 1em;
 305   color: #222;
 306 }
 307 .item-list .title {
 308   font-size: 1em;
 309   color: #222;
 310 }
 311 .links {
 312   margin-bottom: 0em;
 313 }
 314 .comment .links {
 315   margin-bottom: 0em;
 316 }
 317
 318 /*
 319 ** Page layout blocks / IDs
 320 */
 321 #header, #content {
 322   width: 100%;
 323 }
 324 #header {
 325   background-color: #69c;
 326 }
 327 #logo {
 328   vertical-align: middle;
 329   border: 0;
 330 }
 331 #logo img {
 332   float: left;
 333   padding: 0em 1.0em 0em 1em;
 334   border: 0;
 335 }
 336 #menu {
 337   padding: 0 0 0 0;
 338   vertical-align: middle;
 339 }
 340 #primary {
 341   font-size: 1.0em;
 342   padding: 0em 0.8em 0.5em 0;
 343   color: #9cf;
 344 }
 345 #primary a {
 346   font-weight: bold;
 347   color: #fff;
 348 }
 349 #secondary {
 350   padding: 0 1em 0.5em 0;
 351   font-size: 0.8em;
 352   color: #9cf;
 353 }
 354 #secondary a {
 355   font-weight: bold;
 356   color: #9cf;
 357 }
 358 #search .form-text, #search .form-submit {
 359   border: 1px solid #369;
 360   font-size: 1.1em;
 361 }
 362 #search .form-text {
 363   width: 8em;
 364   height: 1.4em;
 365   padding: 0 0.5em 0 0.5em;
 366   margin: 0 0 0.5em 0;
 367 }
 368 #search .form-submit {
 369   height: 1.5em;
 370 }
 371 #main {
 372   /* padding in px not ex because IE messes up 100% width tables otherwise */
 373   padding: 10px;
 374 }
 375 #help {
 376   font-size: 1em;
 377   margin-bottom: 1em;
 378 }
 379 .breadcrumb {
 380   margin-bottom: .5em;
 381 }
 382 .messages {
 383   background-color: #eee;
 384   border: 1px solid #ccc;
 385   padding: 0.3em;
 386   margin-bottom: 1em;
 387 }
 388 .error {
 389   border-color: red;
 390   color: red;
 391 }
 392 #sidebar-left, #sidebar-right {
 393   background-color: #ddd;
 394   width: 16em;
 395   /* padding in px not ex because IE messes up 100% width tables otherwise */
 396   padding: 10px;
 397   vertical-align: top;
 398 }
 399
 400 #content-right {
 401   background-color: #FFFFFF;
 402 }
 403
 404 #footer {
 405   padding: 1em;
 406   font-size: 0.8em;
 407 }
 408
 409 /*
 410 ** Common declarations for child classes of node, comment, block, box, etc.
 411 ** If you want any of them styled differently for a specific parent, add
 412 ** additional rules /with only the differing properties!/ to .parent .class.
 413 ** See .comment .title for an example.
 414 */
 415 .title, .title a {
 416   font-weight: normal;
 417   font-size: 1.6em;
 418   color: #666;
 419   margin: 0 auto 0 auto;  /* decrease default margins for h<x>.title */
 420 }
 421 .block-civicrm #recently-viewed .crm-icon, .crm-icon {
 422   margin-top: 0 !important;
 423 }
 424 .submitted {
 425   color: #999;
 426   font-size: 0.8em;
 427 }
 428 .links {
 429   color: #999;
 430 }
 431 .links a {
 432   font-weight: bold;
 433 }
 434 .block, .box {
 435   padding: 0 0 1.5em 0;
 436 }
 437 .block {
 438   min-height: 25px;
 439   border-bottom: 1px solid #bbb;
 440   padding-bottom: 0.75em;
 441   margin-bottom: 1.5em;
 442 }
 443 .block .title {
 444   margin-bottom: .25em;
 445 }
 446 .box .title {
 447   font-size: 1.1em;
 448 }
 449
 450 #module-status, .version {
 451   font-size:11px;
 452 }
 453 #module-status a {
 454   font-weight: normal;
 455 }
 456 .main {
 457   text-align:left;
 458 }
 459
 460 /* Joomla Admin Menu alterations */
 461 /* Moved from civicrm.css in v3.2 */
 462
 463 ul#civicrm-menu {
 464     z-index: 1;
 465     position:relative;
 466     border: none;
 467     left:0px;
 468     height:0px;
 469     padding: 2px 0px 25px 2px !important;
 470     padding-bottom:25px !important; /*moz bottom */
 471     padding-bottom:2px; /*ie bottom */
 472 }
 473
 474 div#toolbar-box div.m {
 475     padding: 0px !important;
 476   min-height: 0;
 477   border: 0;
 478   margin-top: 8px;
 479 }
 480
 481 div#toolbar-box, div#toolbar-box div.m{
 482     height: auto;
 483 }
 484
 485 ul#civicrm-menu li#crm-qsearch {
 486     height:0px;
 487 }
 488 .crm-tab-button,
 489 .ui-tabs .ui-tabs-nav li {
 490   border: 1px;
 491   font-size: 110%;
 492 }
 493 .ui-tabs .ui-tabs-nav {
 494   padding: 0.2em 3px 1px;
 495 }
 496 #mainTabContainer li.crm-tab-button {
 497   margin:0 3px 3px 0;
 498   border: 1px solid #F5F6F1 !important;
 499 }
 500 #mainTabContainer li.crm-tab-button.ui-tabs-selected {
 501   padding-bottom: 0;
 502   border: 1px solid #999 !important;
 503 }
 504 #crm-container {
 505   font-size: 11px;
 506 }
 507 #crm-container .col1 {
 508   margin: 0;
 509 }
 510 #crm-container .footer {
 511   font-size: 1em;
 512 }
 513 .ac_results .ac_odd {
 514   background-color: #444;
 515 }
 516
 517 #crm-notification-container {
 518   top: 100px;
 519 }
 520
 521 #crm-container textarea,
 522 #crm-container input,
 523 #crm-container select {
 524   font-size: 12px;
 525   height: 16px;
 526   margin-bottom: auto;
 527   margin-right: 4px;
 528   width: auto;
 529   padding: 2px 4px;
 530 }
 531 #crm-container select {
 532   height: 22px;
 533 }
 534 #crm-container input[type=submit] {
 535   height: auto;
 536 }