You are here

style.css in Drupal 5

/**
 * Garland, for Drupal 5.0
 * Stefan Nagtegaal, iStyledThis [dot] nl
 * Steven Wittens, acko [dot] net`
 *
 * If you use a customized color scheme, you must regenerate it after
 * modifying this file.
 */

/**
 * Generic elements
 */
body {
  margin: 0;
  padding: 0;
  background: #edf5fa;
  font: 12px/170% Verdana;
  color: #494949;
}

input {
  font: 12px/100% "Verdana";
  color: #494949;
}

textarea, select {
  font: 12px/160% "Verdana";
  color: #494949;
}

h1, h2, h3, h4, h5, h6 {
  margin: 0;
  padding: 0;
  font-weight: normal;
  font-family: Helvetica, Arial, sans-serif;
}

h1 {
  font-size: 170%;
}

h2 {
  font-size: 160%;
  line-height: 130%;
}

h3 {
  font-size: 140%;
}

h4 {
  font-size: 130%;
}

h5 {
  font-size: 120%;
}

h6 {
  font-size: 110%;
}

ul, quote, code, fieldset {
  margin: .5em 0;
}

p {
  margin: 0.6em 0 1.2em;
  padding: 0;
}

a:link, a:visited {
  color: #027AC6;
  text-decoration: none;
}

a:hover {
  color: #0062A0;
  text-decoration: underline;
}

a:active, a.active {
  color: #5895be;
}

hr {
  margin: 0;
  padding: 0;
  border: none;
  height: 1px;
  background: #5294c1;
}

ul {
  margin: 0.5em 0 1em;
  padding: 0;
}

ul li {
  margin: 0.4em 0 0.4em .5em;
}

ul.menu, .item-list ul {
  margin: 0.35em 0 0 -0.5em;
  padding: 0;
}

ul.menu ul, .item-list ul ul {
  margin-left: 0em;
}

ul li, ul.menu li, .item-list ul li, li.leaf {
  margin: 0.15em 0 0.15em .5em;
}

ul li, ul.menu li, .item-list ul li, li.leaf {
  padding: 0 0 .2em 1.5em;
  list-style-type: none;
  list-style-image: none;
  background: transparent url(images/menu-leaf.gif) no-repeat 1px .35em;
}

ul li.expanded {
  background: transparent url(images/menu-expanded.gif) no-repeat 1px .35em;
}

ul li.collapsed {
  background: transparent url(images/menu-collapsed.gif) no-repeat 0px .35em;
}

ul li.leaf a, ul li.expanded a, ul li.collapsed a {
  display: block;
}

ul.inline li {
  background: none;
  margin: 0;
  padding: 0 1em 0 0;
}

fieldset ul.clear-block li {
  margin: 0;
  padding: 0;
  background-image: none;
}

dl {
  margin: 0.5em 0 1em 1.5em;
}

dl dt {
}

dl dd {
  margin: 0 0 .5em 1.5em;
}

img, a img {
  border: none;
}

table {
  margin: 1em 0;
  width: 100%;
}

thead th {
  border-bottom: 2px solid #d3e7f4;
  color: #494949;
  font-weight: bold;
}

th a:link, th a:visited {
  color: #6f9dbd;
}

td, th {
  padding: .3em .5em;
}

tr.even, tr.odd, tbody th {
  border: solid #d3e7f4;
  border-width: 1px 0;
}

tr.odd, tr.info {
  background-color: #edf5fa;
}

tr.even {
  background-color: #fff;
}

tr.odd td.active {
  background-color: #ddecf5;
}

tr.even td.active {
  background-color: #e6f1f7;
}

td.region, td.module, td.container {
  border-top: 1.5em solid #fff;
  border-bottom: 1px solid #b4d7f0;
  background-color: #d4e7f3;
  color: #455067;
  font-weight: bold;
}

tr:first-child td.region, tr:first-child td.module, tr:first-child td.container {
  border-top-width: 0;
}

span.form-required {
  color: #ffae00;
}

span.submitted, .description {
  font-size: 0.92em;
  color: #898989;
}

.description {
  line-height: 150%;
  margin-bottom: 0.75em;
  color: #898989;
}

.messages, .preview {
  margin: .75em 0 .75em;
  padding: .5em 1em;
}

.messages ul {
  margin: 0;
}

.form-checkboxes, .form-radios, .form-checkboxes .form-item, .form-radios .form-item {
  margin: 0.25em 0;
}

#center form {
  margin-bottom: 2em;
}

.form-button, .form-submit {
  margin: 2em 0.5em 1em 0;
}

#watchdog-form-overview .form-submit,
.confirmation .form-submit,
.search-form .form-submit,
.poll .form-submit,
fieldset .form-button, fieldset .form-submit,
.sidebar .form-button, .sidebar .form-submit,
table .form-button, table .form-submit {
  margin: 0;
}

.box {
  margin-bottom: 2.5em;
}

/**
 * Layout
 */
#header-region {
  min-height: 1em;
  background: #d2e6f3 url(images/bg-navigation.png) repeat-x 50% 100%;
}

#header-region .block {
  display: block;
  margin: 0 1em;
}

#header-region .block-region {
  display: block;
  margin: 0 0.5em 1em;
  padding: 0.5em;
  position: relative;
  top: 0.5em;
}

#header-region * {
  display: inline;
  line-height: 1.5em;
  margin-top: 0;
  margin-bottom: 0;
}

/* Avoid displaying content of script tags */
#header-region script {
  display: none;
}

#header-region p, #header-region img {
  margin-top: 0.5em;
}

#header-region h2 {
  margin: 0 1em 0 0;
}

#header-region h3, #header-region label, #header-region li {
  margin: 0 1em;
  padding: 0;
  background: none;
}

#wrapper {
  background: #edf5fa url(images/body.png) repeat-x 50% 0;
}

#wrapper #container {
  margin: 0 auto;
  padding: 0 20px;
  max-width: 1270px;
}

#wrapper #container #header {
  height: 80px;
}

#wrapper #container #header #logo-floater {
  position: absolute;
}

#wrapper #container #header h1, #wrapper #container #header h1 a:link, #wrapper #container #header h1 a:visited {
  line-height: 120px;
  position: relative;
  z-index: 2;
  white-space: nowrap;
}

#wrapper #container #header h1 span {
  font-weight: bold;
}

#wrapper #container #header h1 img {
  padding-top: 16px;
  padding-right: 20px;
  float: left;
}

/* With 3 columns, require a minimum width of 1000px to ensure there is enough horizontal space. */
body.sidebars {
  min-width: 980px;
}
/* With 2 columns, require a minimum width of 800px. */
body.sidebar-left, body.sidebar-right {
  min-width: 780px;
}

/* We must define 100% width to avoid the body being too narrow for near-empty pages */
#wrapper #container #center {
  float: left;
  width: 100%;
}

/* So we move the #center container over the sidebars to compensate */
body.sidebar-left #center {
  margin-left: -210px;
}
body.sidebar-right #center {
  margin-right: -210px;
}
body.sidebars #center {
  margin: 0 -210px;
}

/* And add blanks left and right for the sidebars to fill */
body.sidebar-left #squeeze {
  margin-left: 210px;
}
body.sidebar-right #squeeze {
  margin-right: 210px;
}
body.sidebars #squeeze {
  margin: 0 210px;
}

/* We ensure the sidebars are still clickable using z-index */
#wrapper #container .sidebar {
  margin: 60px 0 5em;
  width: 210px;
  float: left;
  z-index: 2;
  position: relative;
}

#wrapper #container .sidebar .block {
  margin: 0 0 1.5em 0;
}

#sidebar-left .block {
  padding: 0 15px 0 0px;
}

#sidebar-right .block {
  padding: 0 0px 0 15px;
}

.block .content {
  margin: 0.5em 0;
}

#sidebar-left .block-region {
  margin: 0 15px 0 0px;
}

#sidebar-right .block-region {
  margin: 0 0px 0 15px;
}

.block-region {
  padding: 1em;
  background: transparent;
  border: 2px dashed #b4d7f0;
  text-align: center;
  font-size: 1.3em;
}

/* Now we add the backgrounds for the main content shading */
#wrapper #container #center #squeeze {
  background: #fff url(images/bg-content.png) repeat-x 50% 0;
  position: relative;
}

#wrapper #container #center .right-corner {
  background: transparent url(images/bg-content-right.png) no-repeat 100% 0;
  position: relative;
  left: 10px;
}

#wrapper #container #center .right-corner .left-corner {
  padding: 60px 25px 5em 35px;
  background: transparent url(images/bg-content-left.png) no-repeat 0 0;
  margin-left: -10px;
  position: relative;
  left: -10px;
  min-height: 400px;
}

#wrapper #container #footer {
  float: none;
  clear: both;
  text-align: center;
  margin: 4em 0 -3em;
  color: #898989;
}

#wrapper #container .breadcrumb {
  position: absolute;
  top: 15px;
  left: 35px;
  z-index: 3;
}

body.sidebar-left  #footer {
  margin-left: -210px;
}

body.sidebar-right #footer {
  margin-right: -210px;
}

body.sidebars #footer {
  margin: 0 -210px;
}

/**
 * Header
 */
#wrapper #container #header h1, #wrapper #container #header h1 a:link, #wrapper #container #header h1 a:visited {
  color: #fff;
  font-weight: normal;
  text-shadow: #1659ac 0px 1px 3px;
  font-size: 1.5em;
}

#wrapper #container #header h1 a:hover {
  text-decoration: none;
}

#wrapper #container .breadcrumb {
  font-size: 0.92em;
}

#wrapper #container .breadcrumb, #wrapper #container .breadcrumb a {
  color: #529ad6;
}

#mission {
  padding: 1em;
  background-color: #fff;
  border: 1px solid #e0e5fb;
  margin-bottom: 2em;
}

/**
 * Primary navigation
 */
ul.primary-links {
  margin: 0;
  padding: 0;
  float: right;
  position: relative;
  z-index: 4;
}

ul.primary-links li {
  margin: 0;
  padding: 0;
  float: left;
  background-image: none;
}

ul.primary-links li a, ul.primary-links li a:link, ul.primary-links li a:visited {
  display: block;
  margin: 0 1em;
  padding: .75em 0 0;
  color: #fff;
  background: transparent url(images/bg-navigation-item.png) no-repeat 50% 0;
}

ul.primary-links li a:hover, ul.primary-links li a.active {
  color: #fff;
  background: transparent url(images/bg-navigation-item-hover.png) no-repeat 50% 0;
}

/**
 * Secondary navigation
 */
ul.secondary-links {
  margin: 0;
  padding: 18px 0 0;
  float: right;
  clear: right;
  position: relative;
  z-index: 4;
}

ul.secondary-links li {
  margin: 0;
  padding: 0;
  float: left;
  background-image: none;
}

ul.secondary-links li a, ul.secondary-links li a:link, ul.secondary-links li a:visited {
  display: block;
  margin: 0 1em;
  padding: .75em 0 0;
  color: #cde3f1;
  background: transparent;
}

ul.secondary-links li a:hover, ul.secondary-links li a.active {
  color: #cde3f1;
  background: transparent;
}

/**
 * Local tasks
 */
ul.primary, ul.primary li, ul.secondary, ul.secondary li {
  border: 0;
  background: none;
  margin: 0;
  padding: 0;
}

#tabs-wrapper {
  margin: 0 -26px 1em;
  padding: 0 26px;
  border-bottom: 1px solid #e9eff3;
  position: relative;
}
ul.primary {
  padding: 0.5em 0 10px;
  float: left;
}
ul.secondary {
  clear: both;
  text-align: left;
  border-bottom: 1px solid #e9eff3;
  margin: -0.2em -26px 1em;
  padding: 0 26px 0.6em;
}
h2.with-tabs {
  float: left;
  margin: 0 2em 0 0;
  padding: 0;
}

ul.primary li a, ul.primary li.active a, ul.primary li a:hover, ul.primary li a:visited,
ul.secondary li a, ul.secondary li.active a, ul.secondary li a:hover, ul.secondary li a:visited {
  border: 0;
  background: transparent;
  padding: 4px 1em;
  margin: 0 0 0 1px;
  height: auto;
  text-decoration: none;
  position: relative;
  top: -1px;
  display: inline-block;
}
ul.primary li.active a, ul.primary li.active a:link, ul.primary li.active a:visited, ul.primary li a:hover,
ul.secondary li.active a, ul.secondary li.active a:link, ul.secondary li.active a:visited, ul.secondary li a:hover {
  background: url(images/bg-tab.png) repeat-x 0 50%;
  color: #fff;
}
ul.primary li.active a,
ul.secondary li.active a {
  font-weight: bold;
}

/**
 * Nodes & comments
 */
.node {
  border-bottom: 1px solid #e9eff3;
  margin: -1.5em -26px 1.5em;
  padding: 1.5em 26px;
}

ul.links li, ul.inline li {
  margin-left: 0;
  margin-right: 0;
  padding-left: 0;
  padding-right: 1em;
  background-image: none;
}

.node .links, .comment .links {
  text-align: left;
}

.node .links ul.links li, .comment .links ul.links li {}
.terms ul.links li {
  margin-left: 0;
  margin-right: 0;
  padding-right: 0;
  padding-left: 1em;
}

.picture, .comment .submitted {
  float: right;
  clear: right;
  padding-left: 1em;
}

.new {
  color: #ffae00;
  font-size: 0.92em;
  font-weight: bold;
  float: right;
}

.terms {
  float: right;
}

.preview .node, .preview .comment, .sticky {
  margin: 0;
  padding: 0.5em 0;
  border: 0;
  background: 0;
}

.sticky {
  padding: 1em;
  background-color: #fff;
  border: 1px solid #e0e5fb;
  margin-bottom: 2em;
}

#comments {
  position: relative;
  top: -1px;
  border-bottom: 1px solid #e9eff3;
  margin: -1.5em -25px 0;
  padding: 0 25px;
}

#comments h2.comments {
  margin: 0 -25px;
  padding: .5em 25px;
  background: #fff url(images/gradient-inner.png) repeat-x 0 0;
}

.comment {
  margin: 0 -25px;
  padding: 1.5em 25px 1.5em;
  border-top: 1px solid #e9eff3;
}

.indented {
  margin-left: 25px;
}

.comment h3 a.active {
  color: #494949;
}

.node .content, .comment .content {
  margin: 0.6em 0;
}

/**
 * Aggregator.module
 */
#aggregator {
  margin-top: 1em;
}
#aggregator .feed-item-title {
  font-size: 160%;
  line-height: 130%;
}
#aggregator .feed-item {
  border-bottom: 1px solid #e9eff3;
  margin: -1.5em -31px 1.75em;
  padding: 1.5em 31px;
}
#aggregator .feed-item-categories {
  font-size: 0.92em;
}
#aggregator .feed-item-meta {
  font-size: 0.92em;
  color: #898989;
}

/**
 * Color.module
 */
#palette .form-item {
  border: 1px solid #fff;
}
#palette .item-selected {
  background: #fff url(images/gradient-inner.png) repeat-x 0 0;
  border: 1px solid #d9eaf5;
}

/**
 * Menu.module
 */
tr.odd td.menu-disabled {
  background-color: #edf5fa;
}
tr.even td.menu-disabled {
  background-color: #fff;
}
td.menu-disabled {
  opacity: 0.5;
}

/**
 * Poll.module
 */
.poll .bar {
  background: #fff url(images/bg-bar-white.png) repeat-x 0 0;
  border: solid #f0f0f0;
  border-width: 0 1px 1px;
}

.poll .bar .foreground {
  background: #71a7cc url(images/bg-bar.png) repeat-x 0 100%;
}

.poll .percent {
  font-size: .9em;
}

/**
 * Autocomplete.
 */
#autocomplete li {
  cursor: default;
  padding: 2px;
  margin: 0;
}

/**
 * Collapsible fieldsets
 */
fieldset {
  margin: 1em 0;
  padding: 1em;
  border: 1px solid #d9eaf5;
  background: #fff url(images/gradient-inner.png) repeat-x 0 0;
}

fieldset legend {
  /* Fix disappearing legend in FFox */
  display: block;
}

html.js fieldset.collapsed {
  background: transparent;
  padding-top: 0;
  padding-bottom: .6em;
}

html.js fieldset.collapsible legend a {
  padding-left: 2em;
  background: url(images/menu-expanded.gif) no-repeat 0% 50%;
}

html.js fieldset.collapsed legend a {
  background: url(images/menu-collapsed.gif) no-repeat 0% 50%;
}

/**
 * Syndication icons and block
 */
#block-node-0 h2 {
  float: left;
  padding-right: 20px;
}

#block-node-0 img, .feed-icon {
  float: right;
  padding-top: 4px;
}

#block-node-0 .content {
  clear: right;
}

/**
 * Login Block
 */
#user-login-form {
  text-align: center;
}
#user-login-form ul {
  text-align: left;
}

/**
 * Admin Styles
 */
div.admin-panel,
div.admin-panel .description,
div.admin-panel .body,
div.admin,
div.admin .left,
div.admin .right,
div.admin .expert-link,
div.item-list,
.menu {
  margin: 0;
  padding: 0;
}

div.admin .left {
  float: left;
  width: 48%;
}
div.admin .right {
  float: right;
  width: 48%;
}

div.admin-panel {
  background: #fff url(images/gradient-inner.png) repeat-x 0 0;
  padding: 1em 1em 1.5em;
}
div.admin-panel .description {
  margin-bottom: 1.5em;
}
div.admin-panel dl {
  margin: 0;
}
div.admin-panel dd {
  color: #898989;
  font-size: 0.92em;
  line-height: 1.3em;
  margin-top: -.2em;
  margin-bottom: .65em;
}

table.system-status-report th {
  border-color: #d3e7f4;
}

#autocomplete li.selected, tr.selected td, tr.selected td.active {
  background: #027ac6;
  color: #fff;
}

tr.selected td a:link, tr.selected td a:visited, tr.selected td a:active {
  color: #d3e7f4;
}

/**
 * CSS support
 */
span.clear {
  display: block;
  clear: both;
  height: 1px;
  line-height: 0px;
  font-size: 0px;
  margin-bottom: -1px;
}

/*******************************************************************
 * Color Module: Don't touch                                       *
 *******************************************************************/

/**
 * Generic elements.
 */
.messages {
  background-color: #fff;
  border: 1px solid #b8d3e5;
}

.preview {
  background-color: #fcfce8;
  border: 1px solid #e5e58f;
}

div.status {
  color: #3a3;
  border-color: #c7f2c8;
}

div.error {
  color: #c52020;
}

.form-item input.error, .form-item textarea.error {
  border: 1px solid #c52020;
  color: #494949;
}

/**
 * Watchdog.module
 */
tr.watchdog-user {
  background-color: #fcf9e5;
}

tr.watchdog-user td.active {
  background-color: #fbf5cf;
}

tr.watchdog-content {
  background-color: #fefefe;
}

tr.watchdog-content td.active {
  background-color: #f5f5f5;
}

tr.watchdog-warning {
  background-color: #fdf5e6;
}

tr.watchdog-warning td.active {
  background-color: #fdf2de;
}

tr.watchdog-error {
  background-color: #fbe4e4;
}

tr.watchdog-error td.active {
  background-color: #fbdbdb;
}
tr.watchdog-page-not-found, tr.watchdog-access-denied {
  background: #d7ffd7;
}
tr.watchdog-page-not-found td.active, tr.watchdog-access-denied td.active {
  background: #c7eec7;
}

/**
 * Status report colors.
 */
table.system-status-report tr.error, table.system-status-report tr.error th {
  background-color: #fcc;
  border-color: #ebb;
  color: #200;
}
table.system-status-report tr.warning, table.system-status-report tr.warning th {
  background-color: #ffd;
  border-color: #eeb;
}
table.system-status-report tr.ok, table.system-status-report tr.ok th {
  background-color: #dfd;
  border-color: #beb;
}

File

themes/garland/style.css
View source
  1. /**
  2. * Garland, for Drupal 5.0
  3. * Stefan Nagtegaal, iStyledThis [dot] nl
  4. * Steven Wittens, acko [dot] net`
  5. *
  6. * If you use a customized color scheme, you must regenerate it after
  7. * modifying this file.
  8. */
  9. /**
  10. * Generic elements
  11. */
  12. body {
  13. margin: 0;
  14. padding: 0;
  15. background: #edf5fa;
  16. font: 12px/170% Verdana;
  17. color: #494949;
  18. }
  19. input {
  20. font: 12px/100% "Verdana";
  21. color: #494949;
  22. }
  23. textarea, select {
  24. font: 12px/160% "Verdana";
  25. color: #494949;
  26. }
  27. h1, h2, h3, h4, h5, h6 {
  28. margin: 0;
  29. padding: 0;
  30. font-weight: normal;
  31. font-family: Helvetica, Arial, sans-serif;
  32. }
  33. h1 {
  34. font-size: 170%;
  35. }
  36. h2 {
  37. font-size: 160%;
  38. line-height: 130%;
  39. }
  40. h3 {
  41. font-size: 140%;
  42. }
  43. h4 {
  44. font-size: 130%;
  45. }
  46. h5 {
  47. font-size: 120%;
  48. }
  49. h6 {
  50. font-size: 110%;
  51. }
  52. ul, quote, code, fieldset {
  53. margin: .5em 0;
  54. }
  55. p {
  56. margin: 0.6em 0 1.2em;
  57. padding: 0;
  58. }
  59. a:link, a:visited {
  60. color: #027AC6;
  61. text-decoration: none;
  62. }
  63. a:hover {
  64. color: #0062A0;
  65. text-decoration: underline;
  66. }
  67. a:active, a.active {
  68. color: #5895be;
  69. }
  70. hr {
  71. margin: 0;
  72. padding: 0;
  73. border: none;
  74. height: 1px;
  75. background: #5294c1;
  76. }
  77. ul {
  78. margin: 0.5em 0 1em;
  79. padding: 0;
  80. }
  81. ul li {
  82. margin: 0.4em 0 0.4em .5em;
  83. }
  84. ul.menu, .item-list ul {
  85. margin: 0.35em 0 0 -0.5em;
  86. padding: 0;
  87. }
  88. ul.menu ul, .item-list ul ul {
  89. margin-left: 0em;
  90. }
  91. ul li, ul.menu li, .item-list ul li, li.leaf {
  92. margin: 0.15em 0 0.15em .5em;
  93. }
  94. ul li, ul.menu li, .item-list ul li, li.leaf {
  95. padding: 0 0 .2em 1.5em;
  96. list-style-type: none;
  97. list-style-image: none;
  98. background: transparent url(images/menu-leaf.gif) no-repeat 1px .35em;
  99. }
  100. ul li.expanded {
  101. background: transparent url(images/menu-expanded.gif) no-repeat 1px .35em;
  102. }
  103. ul li.collapsed {
  104. background: transparent url(images/menu-collapsed.gif) no-repeat 0px .35em;
  105. }
  106. ul li.leaf a, ul li.expanded a, ul li.collapsed a {
  107. display: block;
  108. }
  109. ul.inline li {
  110. background: none;
  111. margin: 0;
  112. padding: 0 1em 0 0;
  113. }
  114. fieldset ul.clear-block li {
  115. margin: 0;
  116. padding: 0;
  117. background-image: none;
  118. }
  119. dl {
  120. margin: 0.5em 0 1em 1.5em;
  121. }
  122. dl dt {
  123. }
  124. dl dd {
  125. margin: 0 0 .5em 1.5em;
  126. }
  127. img, a img {
  128. border: none;
  129. }
  130. table {
  131. margin: 1em 0;
  132. width: 100%;
  133. }
  134. thead th {
  135. border-bottom: 2px solid #d3e7f4;
  136. color: #494949;
  137. font-weight: bold;
  138. }
  139. th a:link, th a:visited {
  140. color: #6f9dbd;
  141. }
  142. td, th {
  143. padding: .3em .5em;
  144. }
  145. tr.even, tr.odd, tbody th {
  146. border: solid #d3e7f4;
  147. border-width: 1px 0;
  148. }
  149. tr.odd, tr.info {
  150. background-color: #edf5fa;
  151. }
  152. tr.even {
  153. background-color: #fff;
  154. }
  155. tr.odd td.active {
  156. background-color: #ddecf5;
  157. }
  158. tr.even td.active {
  159. background-color: #e6f1f7;
  160. }
  161. td.region, td.module, td.container {
  162. border-top: 1.5em solid #fff;
  163. border-bottom: 1px solid #b4d7f0;
  164. background-color: #d4e7f3;
  165. color: #455067;
  166. font-weight: bold;
  167. }
  168. tr:first-child td.region, tr:first-child td.module, tr:first-child td.container {
  169. border-top-width: 0;
  170. }
  171. span.form-required {
  172. color: #ffae00;
  173. }
  174. span.submitted, .description {
  175. font-size: 0.92em;
  176. color: #898989;
  177. }
  178. .description {
  179. line-height: 150%;
  180. margin-bottom: 0.75em;
  181. color: #898989;
  182. }
  183. .messages, .preview {
  184. margin: .75em 0 .75em;
  185. padding: .5em 1em;
  186. }
  187. .messages ul {
  188. margin: 0;
  189. }
  190. .form-checkboxes, .form-radios, .form-checkboxes .form-item, .form-radios .form-item {
  191. margin: 0.25em 0;
  192. }
  193. #center form {
  194. margin-bottom: 2em;
  195. }
  196. .form-button, .form-submit {
  197. margin: 2em 0.5em 1em 0;
  198. }
  199. #watchdog-form-overview .form-submit,
  200. .confirmation .form-submit,
  201. .search-form .form-submit,
  202. .poll .form-submit,
  203. fieldset .form-button, fieldset .form-submit,
  204. .sidebar .form-button, .sidebar .form-submit,
  205. table .form-button, table .form-submit {
  206. margin: 0;
  207. }
  208. .box {
  209. margin-bottom: 2.5em;
  210. }
  211. /**
  212. * Layout
  213. */
  214. #header-region {
  215. min-height: 1em;
  216. background: #d2e6f3 url(images/bg-navigation.png) repeat-x 50% 100%;
  217. }
  218. #header-region .block {
  219. display: block;
  220. margin: 0 1em;
  221. }
  222. #header-region .block-region {
  223. display: block;
  224. margin: 0 0.5em 1em;
  225. padding: 0.5em;
  226. position: relative;
  227. top: 0.5em;
  228. }
  229. #header-region * {
  230. display: inline;
  231. line-height: 1.5em;
  232. margin-top: 0;
  233. margin-bottom: 0;
  234. }
  235. /* Avoid displaying content of script tags */
  236. #header-region script {
  237. display: none;
  238. }
  239. #header-region p, #header-region img {
  240. margin-top: 0.5em;
  241. }
  242. #header-region h2 {
  243. margin: 0 1em 0 0;
  244. }
  245. #header-region h3, #header-region label, #header-region li {
  246. margin: 0 1em;
  247. padding: 0;
  248. background: none;
  249. }
  250. #wrapper {
  251. background: #edf5fa url(images/body.png) repeat-x 50% 0;
  252. }
  253. #wrapper #container {
  254. margin: 0 auto;
  255. padding: 0 20px;
  256. max-width: 1270px;
  257. }
  258. #wrapper #container #header {
  259. height: 80px;
  260. }
  261. #wrapper #container #header #logo-floater {
  262. position: absolute;
  263. }
  264. #wrapper #container #header h1, #wrapper #container #header h1 a:link, #wrapper #container #header h1 a:visited {
  265. line-height: 120px;
  266. position: relative;
  267. z-index: 2;
  268. white-space: nowrap;
  269. }
  270. #wrapper #container #header h1 span {
  271. font-weight: bold;
  272. }
  273. #wrapper #container #header h1 img {
  274. padding-top: 16px;
  275. padding-right: 20px;
  276. float: left;
  277. }
  278. /* With 3 columns, require a minimum width of 1000px to ensure there is enough horizontal space. */
  279. body.sidebars {
  280. min-width: 980px;
  281. }
  282. /* With 2 columns, require a minimum width of 800px. */
  283. body.sidebar-left, body.sidebar-right {
  284. min-width: 780px;
  285. }
  286. /* We must define 100% width to avoid the body being too narrow for near-empty pages */
  287. #wrapper #container #center {
  288. float: left;
  289. width: 100%;
  290. }
  291. /* So we move the #center container over the sidebars to compensate */
  292. body.sidebar-left #center {
  293. margin-left: -210px;
  294. }
  295. body.sidebar-right #center {
  296. margin-right: -210px;
  297. }
  298. body.sidebars #center {
  299. margin: 0 -210px;
  300. }
  301. /* And add blanks left and right for the sidebars to fill */
  302. body.sidebar-left #squeeze {
  303. margin-left: 210px;
  304. }
  305. body.sidebar-right #squeeze {
  306. margin-right: 210px;
  307. }
  308. body.sidebars #squeeze {
  309. margin: 0 210px;
  310. }
  311. /* We ensure the sidebars are still clickable using z-index */
  312. #wrapper #container .sidebar {
  313. margin: 60px 0 5em;
  314. width: 210px;
  315. float: left;
  316. z-index: 2;
  317. position: relative;
  318. }
  319. #wrapper #container .sidebar .block {
  320. margin: 0 0 1.5em 0;
  321. }
  322. #sidebar-left .block {
  323. padding: 0 15px 0 0px;
  324. }
  325. #sidebar-right .block {
  326. padding: 0 0px 0 15px;
  327. }
  328. .block .content {
  329. margin: 0.5em 0;
  330. }
  331. #sidebar-left .block-region {
  332. margin: 0 15px 0 0px;
  333. }
  334. #sidebar-right .block-region {
  335. margin: 0 0px 0 15px;
  336. }
  337. .block-region {
  338. padding: 1em;
  339. background: transparent;
  340. border: 2px dashed #b4d7f0;
  341. text-align: center;
  342. font-size: 1.3em;
  343. }
  344. /* Now we add the backgrounds for the main content shading */
  345. #wrapper #container #center #squeeze {
  346. background: #fff url(images/bg-content.png) repeat-x 50% 0;
  347. position: relative;
  348. }
  349. #wrapper #container #center .right-corner {
  350. background: transparent url(images/bg-content-right.png) no-repeat 100% 0;
  351. position: relative;
  352. left: 10px;
  353. }
  354. #wrapper #container #center .right-corner .left-corner {
  355. padding: 60px 25px 5em 35px;
  356. background: transparent url(images/bg-content-left.png) no-repeat 0 0;
  357. margin-left: -10px;
  358. position: relative;
  359. left: -10px;
  360. min-height: 400px;
  361. }
  362. #wrapper #container #footer {
  363. float: none;
  364. clear: both;
  365. text-align: center;
  366. margin: 4em 0 -3em;
  367. color: #898989;
  368. }
  369. #wrapper #container .breadcrumb {
  370. position: absolute;
  371. top: 15px;
  372. left: 35px;
  373. z-index: 3;
  374. }
  375. body.sidebar-left #footer {
  376. margin-left: -210px;
  377. }
  378. body.sidebar-right #footer {
  379. margin-right: -210px;
  380. }
  381. body.sidebars #footer {
  382. margin: 0 -210px;
  383. }
  384. /**
  385. * Header
  386. */
  387. #wrapper #container #header h1, #wrapper #container #header h1 a:link, #wrapper #container #header h1 a:visited {
  388. color: #fff;
  389. font-weight: normal;
  390. text-shadow: #1659ac 0px 1px 3px;
  391. font-size: 1.5em;
  392. }
  393. #wrapper #container #header h1 a:hover {
  394. text-decoration: none;
  395. }
  396. #wrapper #container .breadcrumb {
  397. font-size: 0.92em;
  398. }
  399. #wrapper #container .breadcrumb, #wrapper #container .breadcrumb a {
  400. color: #529ad6;
  401. }
  402. #mission {
  403. padding: 1em;
  404. background-color: #fff;
  405. border: 1px solid #e0e5fb;
  406. margin-bottom: 2em;
  407. }
  408. /**
  409. * Primary navigation
  410. */
  411. ul.primary-links {
  412. margin: 0;
  413. padding: 0;
  414. float: right;
  415. position: relative;
  416. z-index: 4;
  417. }
  418. ul.primary-links li {
  419. margin: 0;
  420. padding: 0;
  421. float: left;
  422. background-image: none;
  423. }
  424. ul.primary-links li a, ul.primary-links li a:link, ul.primary-links li a:visited {
  425. display: block;
  426. margin: 0 1em;
  427. padding: .75em 0 0;
  428. color: #fff;
  429. background: transparent url(images/bg-navigation-item.png) no-repeat 50% 0;
  430. }
  431. ul.primary-links li a:hover, ul.primary-links li a.active {
  432. color: #fff;
  433. background: transparent url(images/bg-navigation-item-hover.png) no-repeat 50% 0;
  434. }
  435. /**
  436. * Secondary navigation
  437. */
  438. ul.secondary-links {
  439. margin: 0;
  440. padding: 18px 0 0;
  441. float: right;
  442. clear: right;
  443. position: relative;
  444. z-index: 4;
  445. }
  446. ul.secondary-links li {
  447. margin: 0;
  448. padding: 0;
  449. float: left;
  450. background-image: none;
  451. }
  452. ul.secondary-links li a, ul.secondary-links li a:link, ul.secondary-links li a:visited {
  453. display: block;
  454. margin: 0 1em;
  455. padding: .75em 0 0;
  456. color: #cde3f1;
  457. background: transparent;
  458. }
  459. ul.secondary-links li a:hover, ul.secondary-links li a.active {
  460. color: #cde3f1;
  461. background: transparent;
  462. }
  463. /**
  464. * Local tasks
  465. */
  466. ul.primary, ul.primary li, ul.secondary, ul.secondary li {
  467. border: 0;
  468. background: none;
  469. margin: 0;
  470. padding: 0;
  471. }
  472. #tabs-wrapper {
  473. margin: 0 -26px 1em;
  474. padding: 0 26px;
  475. border-bottom: 1px solid #e9eff3;
  476. position: relative;
  477. }
  478. ul.primary {
  479. padding: 0.5em 0 10px;
  480. float: left;
  481. }
  482. ul.secondary {
  483. clear: both;
  484. text-align: left;
  485. border-bottom: 1px solid #e9eff3;
  486. margin: -0.2em -26px 1em;
  487. padding: 0 26px 0.6em;
  488. }
  489. h2.with-tabs {
  490. float: left;
  491. margin: 0 2em 0 0;
  492. padding: 0;
  493. }
  494. ul.primary li a, ul.primary li.active a, ul.primary li a:hover, ul.primary li a:visited,
  495. ul.secondary li a, ul.secondary li.active a, ul.secondary li a:hover, ul.secondary li a:visited {
  496. border: 0;
  497. background: transparent;
  498. padding: 4px 1em;
  499. margin: 0 0 0 1px;
  500. height: auto;
  501. text-decoration: none;
  502. position: relative;
  503. top: -1px;
  504. display: inline-block;
  505. }
  506. ul.primary li.active a, ul.primary li.active a:link, ul.primary li.active a:visited, ul.primary li a:hover,
  507. ul.secondary li.active a, ul.secondary li.active a:link, ul.secondary li.active a:visited, ul.secondary li a:hover {
  508. background: url(images/bg-tab.png) repeat-x 0 50%;
  509. color: #fff;
  510. }
  511. ul.primary li.active a,
  512. ul.secondary li.active a {
  513. font-weight: bold;
  514. }
  515. /**
  516. * Nodes & comments
  517. */
  518. .node {
  519. border-bottom: 1px solid #e9eff3;
  520. margin: -1.5em -26px 1.5em;
  521. padding: 1.5em 26px;
  522. }
  523. ul.links li, ul.inline li {
  524. margin-left: 0;
  525. margin-right: 0;
  526. padding-left: 0;
  527. padding-right: 1em;
  528. background-image: none;
  529. }
  530. .node .links, .comment .links {
  531. text-align: left;
  532. }
  533. .node .links ul.links li, .comment .links ul.links li {}
  534. .terms ul.links li {
  535. margin-left: 0;
  536. margin-right: 0;
  537. padding-right: 0;
  538. padding-left: 1em;
  539. }
  540. .picture, .comment .submitted {
  541. float: right;
  542. clear: right;
  543. padding-left: 1em;
  544. }
  545. .new {
  546. color: #ffae00;
  547. font-size: 0.92em;
  548. font-weight: bold;
  549. float: right;
  550. }
  551. .terms {
  552. float: right;
  553. }
  554. .preview .node, .preview .comment, .sticky {
  555. margin: 0;
  556. padding: 0.5em 0;
  557. border: 0;
  558. background: 0;
  559. }
  560. .sticky {
  561. padding: 1em;
  562. background-color: #fff;
  563. border: 1px solid #e0e5fb;
  564. margin-bottom: 2em;
  565. }
  566. #comments {
  567. position: relative;
  568. top: -1px;
  569. border-bottom: 1px solid #e9eff3;
  570. margin: -1.5em -25px 0;
  571. padding: 0 25px;
  572. }
  573. #comments h2.comments {
  574. margin: 0 -25px;
  575. padding: .5em 25px;
  576. background: #fff url(images/gradient-inner.png) repeat-x 0 0;
  577. }
  578. .comment {
  579. margin: 0 -25px;
  580. padding: 1.5em 25px 1.5em;
  581. border-top: 1px solid #e9eff3;
  582. }
  583. .indented {
  584. margin-left: 25px;
  585. }
  586. .comment h3 a.active {
  587. color: #494949;
  588. }
  589. .node .content, .comment .content {
  590. margin: 0.6em 0;
  591. }
  592. /**
  593. * Aggregator.module
  594. */
  595. #aggregator {
  596. margin-top: 1em;
  597. }
  598. #aggregator .feed-item-title {
  599. font-size: 160%;
  600. line-height: 130%;
  601. }
  602. #aggregator .feed-item {
  603. border-bottom: 1px solid #e9eff3;
  604. margin: -1.5em -31px 1.75em;
  605. padding: 1.5em 31px;
  606. }
  607. #aggregator .feed-item-categories {
  608. font-size: 0.92em;
  609. }
  610. #aggregator .feed-item-meta {
  611. font-size: 0.92em;
  612. color: #898989;
  613. }
  614. /**
  615. * Color.module
  616. */
  617. #palette .form-item {
  618. border: 1px solid #fff;
  619. }
  620. #palette .item-selected {
  621. background: #fff url(images/gradient-inner.png) repeat-x 0 0;
  622. border: 1px solid #d9eaf5;
  623. }
  624. /**
  625. * Menu.module
  626. */
  627. tr.odd td.menu-disabled {
  628. background-color: #edf5fa;
  629. }
  630. tr.even td.menu-disabled {
  631. background-color: #fff;
  632. }
  633. td.menu-disabled {
  634. opacity: 0.5;
  635. }
  636. /**
  637. * Poll.module
  638. */
  639. .poll .bar {
  640. background: #fff url(images/bg-bar-white.png) repeat-x 0 0;
  641. border: solid #f0f0f0;
  642. border-width: 0 1px 1px;
  643. }
  644. .poll .bar .foreground {
  645. background: #71a7cc url(images/bg-bar.png) repeat-x 0 100%;
  646. }
  647. .poll .percent {
  648. font-size: .9em;
  649. }
  650. /**
  651. * Autocomplete.
  652. */
  653. #autocomplete li {
  654. cursor: default;
  655. padding: 2px;
  656. margin: 0;
  657. }
  658. /**
  659. * Collapsible fieldsets
  660. */
  661. fieldset {
  662. margin: 1em 0;
  663. padding: 1em;
  664. border: 1px solid #d9eaf5;
  665. background: #fff url(images/gradient-inner.png) repeat-x 0 0;
  666. }
  667. fieldset legend {
  668. /* Fix disappearing legend in FFox */
  669. display: block;
  670. }
  671. html.js fieldset.collapsed {
  672. background: transparent;
  673. padding-top: 0;
  674. padding-bottom: .6em;
  675. }
  676. html.js fieldset.collapsible legend a {
  677. padding-left: 2em;
  678. background: url(images/menu-expanded.gif) no-repeat 0% 50%;
  679. }
  680. html.js fieldset.collapsed legend a {
  681. background: url(images/menu-collapsed.gif) no-repeat 0% 50%;
  682. }
  683. /**
  684. * Syndication icons and block
  685. */
  686. #block-node-0 h2 {
  687. float: left;
  688. padding-right: 20px;
  689. }
  690. #block-node-0 img, .feed-icon {
  691. float: right;
  692. padding-top: 4px;
  693. }
  694. #block-node-0 .content {
  695. clear: right;
  696. }
  697. /**
  698. * Login Block
  699. */
  700. #user-login-form {
  701. text-align: center;
  702. }
  703. #user-login-form ul {
  704. text-align: left;
  705. }
  706. /**
  707. * Admin Styles
  708. */
  709. div.admin-panel,
  710. div.admin-panel .description,
  711. div.admin-panel .body,
  712. div.admin,
  713. div.admin .left,
  714. div.admin .right,
  715. div.admin .expert-link,
  716. div.item-list,
  717. .menu {
  718. margin: 0;
  719. padding: 0;
  720. }
  721. div.admin .left {
  722. float: left;
  723. width: 48%;
  724. }
  725. div.admin .right {
  726. float: right;
  727. width: 48%;
  728. }
  729. div.admin-panel {
  730. background: #fff url(images/gradient-inner.png) repeat-x 0 0;
  731. padding: 1em 1em 1.5em;
  732. }
  733. div.admin-panel .description {
  734. margin-bottom: 1.5em;
  735. }
  736. div.admin-panel dl {
  737. margin: 0;
  738. }
  739. div.admin-panel dd {
  740. color: #898989;
  741. font-size: 0.92em;
  742. line-height: 1.3em;
  743. margin-top: -.2em;
  744. margin-bottom: .65em;
  745. }
  746. table.system-status-report th {
  747. border-color: #d3e7f4;
  748. }
  749. #autocomplete li.selected, tr.selected td, tr.selected td.active {
  750. background: #027ac6;
  751. color: #fff;
  752. }
  753. tr.selected td a:link, tr.selected td a:visited, tr.selected td a:active {
  754. color: #d3e7f4;
  755. }
  756. /**
  757. * CSS support
  758. */
  759. span.clear {
  760. display: block;
  761. clear: both;
  762. height: 1px;
  763. line-height: 0px;
  764. font-size: 0px;
  765. margin-bottom: -1px;
  766. }
  767. /*******************************************************************
  768. * Color Module: Don't touch *
  769. *******************************************************************/
  770. /**
  771. * Generic elements.
  772. */
  773. .messages {
  774. background-color: #fff;
  775. border: 1px solid #b8d3e5;
  776. }
  777. .preview {
  778. background-color: #fcfce8;
  779. border: 1px solid #e5e58f;
  780. }
  781. div.status {
  782. color: #3a3;
  783. border-color: #c7f2c8;
  784. }
  785. div.error {
  786. color: #c52020;
  787. }
  788. .form-item input.error, .form-item textarea.error {
  789. border: 1px solid #c52020;
  790. color: #494949;
  791. }
  792. /**
  793. * Watchdog.module
  794. */
  795. tr.watchdog-user {
  796. background-color: #fcf9e5;
  797. }
  798. tr.watchdog-user td.active {
  799. background-color: #fbf5cf;
  800. }
  801. tr.watchdog-content {
  802. background-color: #fefefe;
  803. }
  804. tr.watchdog-content td.active {
  805. background-color: #f5f5f5;
  806. }
  807. tr.watchdog-warning {
  808. background-color: #fdf5e6;
  809. }
  810. tr.watchdog-warning td.active {
  811. background-color: #fdf2de;
  812. }
  813. tr.watchdog-error {
  814. background-color: #fbe4e4;
  815. }
  816. tr.watchdog-error td.active {
  817. background-color: #fbdbdb;
  818. }
  819. tr.watchdog-page-not-found, tr.watchdog-access-denied {
  820. background: #d7ffd7;
  821. }
  822. tr.watchdog-page-not-found td.active, tr.watchdog-access-denied td.active {
  823. background: #c7eec7;
  824. }
  825. /**
  826. * Status report colors.
  827. */
  828. table.system-status-report tr.error, table.system-status-report tr.error th {
  829. background-color: #fcc;
  830. border-color: #ebb;
  831. color: #200;
  832. }
  833. table.system-status-report tr.warning, table.system-status-report tr.warning th {
  834. background-color: #ffd;
  835. border-color: #eeb;
  836. }
  837. table.system-status-report tr.ok, table.system-status-report tr.ok th {
  838. background-color: #dfd;
  839. border-color: #beb;
  840. }