style.css

/**
 * Eldir for Drupal 7
 * Designed for the Aegir hosting system.
 *
 * By Young Hahn (young@developmentseed.org)
 */

/* Resets */
body,

table,
table *,

dl, dt, dd,

ul.menu,
ul.menu li,
ul.menu li.leaf,
ul.links,
ul.links li,

div.admin div.left,
div.admin div.right,
div.admin-panel,
div.admin-panel div.body,
div.admin-panel p.description,

div.block ul,
div.breadcrumb,
div.item-list ul li,

div.form-item,
div.form-radios,
div.form-checkboxes,
div.form-radios div.form-item,
div.form-checkboxes div.form-item,

div.hosting-task-retry,

h1, h2, h3, h4, h5, h6,
ul, ol, li,
p, blockquote {

  background-image:none;
  background-color:transparent;

  font-size:1em;
  font-weight:normal;

  margin:0px;
  padding:0px;
  }

ul, ol,
.item-list ul, .item-list ol {
  margin-left: 1em;
}

.block ul, .block ol, .block li {
  list-style:none;
  list-style-image:none;
}

html, body {
  height: 100%;
}

body {
  font: 13px/20px "Helvetica Neue",Arial,sans-serif;
}

body.aegir {
  color:#444;
  background:#fff;
  margin:0px;
  padding:0px;
  min-width: 950px;
  }

strong {
  font-weight:bold;
}

a {
  color:#468;
  text-decoration:none;
  }

  a:hover { text-decoration:underline; }

  /* No underline for links that are likely to have good hover classes anyway. */
  ul.menu li a:hover,
  ul.links li a:hover { text-decoration:none; }

  /* Reverse color text/links */
  div.reverse { color:#fff; }
  div.reverse a { color:#ace; }

h1, h2 {
  font-size:15px;
  font-weight:bold;
  padding:0px 0px 4px;
  border-bottom:1px solid #e8e8e8;
  }

h3, h4, h5, h6 {
  color:#888;
  font-weight:bold;
  margin:0px 0px 5px;
  }

dl,
dd { margin:0px 0px 10px; }

dt {
  margin:10px 0px 0px;
  font-weight:bold;
  }

p { margin:0px 0px 10px; }

div.limiter {
  width:940px;
  margin:0px auto;
  }

ul.primary {
    line-height: inherit;
  }

/**
 * LINKS ==============================================================
 */
ul.primary,
ul.primary li.active a,
ul.secondary,
ul.secondary li.active a,
ul.tabs li,
ul.tabs li a,
ul.links li,
ul.links li a {
  background:transparent;
  border:0px;
  margin:0px;
  padding:0px;
  }

ul.tabs li,
ul.tabs li a,
ul.links li,
ul.links li a { float:left; }

/**
 * LISTS ==============================================================
 */
div.node div.content ul,
div#console div.messages ul { padding-left:20px; }

div.node div.content ul li,
div#console div.messages ul li { list-style: square; }

/**
 * HEADER =============================================================
 */
div#header {
  background:url(images/sprite.png) repeat-x;
  }

div#header div.logo,
div#header div.logo a,
div#header div.site-name { float:left; }

.logo img {
  width: 120px;
  margin-right: 10px;
  margin-top: 18px;
}

div#header div.site-name {
  font-size:18px;
  letter-spacing:-1px;
  color:#ace;
  line-height:40px;
  margin:20px 0px;
  padding:0px 0px 0px 19px;
  border-left:1px solid #258;
  }

div#header form {
  width:370px;
  height:40px;
  line-height:40px;
  padding:20px 0px;
  float:right;
  text-align:right;
  }

  div#header form * { vertical-align:middle; }

  div#header form input.form-text { width:60%; }

/**
 * NAVIGATION =========================================================
 */
div#navigation {
  border-top:1px solid #258;
  background:url(images/sprite.png) 0px -80px;
  }

div#navigation div.breadcrumb {
  line-height:40px;
  font-size:11px;
  float:left;
  }

div#navigation ul.links {
  padding:5px 0px 0px;
  float:right;
  }

  div#navigation ul.links a {
    background:#147;
    font-size:11px;
    line-height:25px;
    padding:5px 15px;
    margin-right:1px;
    }

  div#navigation ul.links a:hover {
    background:#6ac;
    color:#000;
    }

  div#navigation ul.links li.active a,
  div#navigation ul.links li a.active {
    background:#e8e8e8;
    color:#444;
    }

/**
 * HEADER REGION ======================================================
 */
div#header-region {
  padding:20px 0px 0px;
  background:#e8e8e8 url(images/grid_e8.png) 50% 0% repeat; }

div#header-region h2.page-title {
  border:0px;
  padding:0px 0px 10px;
  letter-spacing:-2px;

  line-height:40px;
  font-size:32px;
  font-weight:normal;
  }

  div#header-region h2.page-title span.label {
    font-size:13px;
    font-weight:bold;
    letter-spacing:0px;

    float:left;
    margin:5px 10px 5px 0px;
    padding:0px 10px;
    line-height:30px;

    background:#666;
    color:#fff;
    }

#page ul.tabs,
div#header-region ul.tabs { clear:both; }

  div#header-region ul.tabs li { height:30px; }

  #page ul.tabs li a,
  div#header-region ul.tabs li a {
    padding:5px 15px;
    font-size:11px;
    }

  div#header-region ul.tabs li a:hover {
    background:#666;
    color:#fff;
    }

  div#header-region ul.tabs li.active a,
  div#header-region ul.tabs li a.active {
    padding: 5px 15px;
    background:#fff;
    color:#444;
    border-bottom:1px solid #fff;
    }

/**
 * PAGE LAYOUT ========================================================
 */
div#page {
  background:#eee url(images/grid_e8.png) 50% 0% repeat;
  padding-bottom:40px;
  }

div#page div.limiter { background:url(images/page.png) repeat-y; }

  body.wide div#page div.limiter {
    padding-right:190px;
    width:750px;
    }

div#main {
  float:left;
  width:600px;
  padding:10px;
  clear:both;
  }

  body.wide div#main {
    background:#fff;
    float:none;
    width:950px;
    }

div.sidebar {
  float:right;
  width:300px;
  padding:10px;
  }

#page ul.tabs {
  height:29px;
  border-bottom:1px solid #e8e8e8;
  background:#fff;
  }

/**
 * BLOCKS > SIDEBAR ===================================================
 */
div.sidebar div.block { margin:0px 0px 20px; }

div.sidebar div.block div.content { padding:5px 0px 0px; }

div.sidebar div.item-list { margin:0px 0px 10px; }

div.sidebar ul.menu li,
div.sidebar div.item-list li {
  list-style:none;
  font-size:11px;
  padding:0px;
  margin:0px 0px 5px;
  background:#fff;
  }

  div.sidebar div.item-list li,
  div.sidebar ul.menu a {
    display:block;
    padding:2px 10px;
    }

  div.sidebar ul.menu ul { padding-left:10px; }

  div.sidebar ul.menu li li {
    margin:0px;
    border-top:1px solid #f0f0f0;
    }

  div.sidebar ul.menu a:hover {
    color:#fff;
    background:#6ac;
    }

  /* Corner rounding logic */
  div.sidebar ul.menu li,
  div.sidebar ul.menu a,
  div.sidebar div.item-list li {
    -moz-border-radius:3px;
    -webkit-border-radius: 3px;
    }

  div.sidebar ul.menu li.expanded a {
    -moz-border-radius:0px;
    -moz-border-radius-topleft:3px;
    -moz-border-radius-topright:3px;

    -webkit-border-radius: 0px;
    -webkit-border-top-left-radius:3px;
    -webkit-border-top-right-radius:3px;
    }

    div.sidebar ul.menu li.expanded li,
    div.sidebar ul.menu li.expanded li a {
      -moz-border-radius:0px;
      -webkit-border-radius: 0px;
      }

/**
 * CONSOLE MESSAGES ===================================================
 */
div#console {
  font-size:15px;
  border-top:1px solid #111;
  border-bottom:1px solid #fff;
  padding:9px 0px;
  background:#222 url(images/sprite.png) 0px -240px repeat-x;
  }

div#console div.messages {
  color:#8cf;
  text-shadow:0px 0px 15px #06c;
  background:#024;

  margin:5px 0px;
  padding:9px;

  border-style:solid;
  border-color:#048;
  border-width:1px 1px 1px 6px;
  }

  div#console div.error {
    background-color:#400;
    border-color:#800;
    color:#fa4;
    text-shadow:0px 0px 15px #c30;
    }

  div#console div.warning {
    background-color:#630;
    border-color:#a50;
    color:#fe4;
    text-shadow:0px 0px 15px #c80;
    }

  div#console div.ok {
    background-color:#040;
    border-color:#080;
    color:#cfc;
    text-shadow:0px 0px 15px #0c6;
    }

/* Exceptions */
/* make sure devel module messages are readable */
div.krumo-root, div.krumo-root a {
  color: black;
  text-shadow: none;
}

/**
 * FOOTER =============================================================
 */
#footer {
  background:#666;
  padding:20px 0px;
  line-height:40px;
  height:40px;
  }

#footer ul.links { float:right; }

/**
 * FORMS ==============================================================
 */
select,
textarea,
input.form-text {
  width:90%;
  font: 13px/20px "Helvetica Neue",Arial,sans-serif;
  padding:3px;
  border:1px solid #ddd;
  background-color:#fff;
  }

  select:focus,
  textarea:focus,
  input.form-text:focus {
    background-color:#f0f8ff;
    border-color:#abc;
    }

  div.reverse select,
  div.reverse textarea,
  div.reverse input.form-text {
    background-color:#124;
    color:#fff;
    border-color:#258;
    }

  html.js input.form-autocomplete { background-position:100% 4px; }
  html.js input.throbbing { background-position: 100% -16px; }

  td select,
  td input.form-text,
  div.container-inline select,
  div.container-inline input.form-text { width:auto; }

input.form-submit {
  font: bold 13px/20px "Helvetica Neue",Arial,sans-serif;
  border:0px;
  padding:5px 10px;
  color:#fff;
  background:#666;

  cursor:pointer;

  -moz-border-radius:3px;
  -webkit-border-radius: 3px;
  }


input.form-submit[disabled] {
  color:#ddd;
  background:#eee;
  cursor: default;
}


  body.page-admin input.form-submit,
  body.page-admin #views-ajax-pad .form-submit {
    padding: 0 4px;
    }

  div.reverse input.form-submit { background:#124; }

form div.form-item {
  clear:both;
  position:relative;
  margin:0px;
  padding:10px 10px 9px;
  border-bottom:1px solid #e8e8e8;
  }

  form div.form-item-labeled { padding-left:180px; }

  form div.form-item-labeled label {
    font-size:11px;
    position:absolute;
    left:0px;
    width:170px;
    }

  /* Exceptions */
  body.page-admin div.form-item,
  dl.multiselect div.form-item,
  div.sidebar form div.form-item,
  form#system-theme-settings div.form-item,
  form div.form-item div.form-item,
  form table div.form-item,
  form div.container-inline div.form-item,
  form div.form-checkboxes div.form-item,
  form div.form-radios div.form-item {
    clear:none;
    padding:0px;
    border:0px;
    }

  body.page-admin div.form-item label,
  dl.multiselect div.form-item label,
  div.sidebar form div.form-item label,
  form div.form-item label.option,
  form#system-theme-settings div.form-item label,
  form div.form-item div.form-item label,
  form table div.form-item label,
  form div.container-inline div.form-item label,
  form div.form-checkboxes div.form-item label,
  form div.form-radios div.form-item label {
    width:auto;
    position:static;
    }

div.form-item label.option,
div.form-item label.option * {
  font-size:1em;
  vertical-align:middle;
  }

div.form-item div.description {
  margin:5px 0px;
  line-height:15px;
  font-size:11px;
  color:#666;
  }

form input#edit-publish-path {
  width:auto;
  }

/* Fieldsets... what a nightmare */
body.aegir fieldset {
  background:#f8f8f8;

  margin:10px 0px;
  padding:25px 10px 10px;
  border:0px;

  display:block;
  -moz-border-radius:3px;
  -webkit-border-radius: 3px;
  }

  body.aegir fieldset.collapsible {
    position:relative;
    padding:25px 0px 0px;
    }

    body.aegir fieldset.collapsible div.fieldset-wrapper { padding:10px; }

  html.js body.aegir fieldset.collapsed {
    height:0px;
    margin:10px 0px;
    background:transparent;
    }

body.aegir fieldset legend {
  font-size:11px;
  font-weight:bold;
  margin-bottom:-25px;
  }

  body.aegir fieldset.collapsible legend { margin:0px; }

body.aegir fieldset.collapsible legend a,
html.js body.aegir fieldset.collapsible legend a {
  position:absolute;
  right:0px;
  left:0px;

  background:#eee;
  font-size:11px;

  display:block;
  padding:2px 10px 3px;
  }

body.aegir fieldset.collapsible legend a {
  -moz-border-radius-topleft:3px;
  -moz-border-radius-topright:3px;
  -webkit-border-top-left-radius: 3px;
  -webkit-border-top-right-radius: 3px;
  }

  body.aegir fieldset.collapsed legend a {
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    }

/**
 * NODES ==============================================================
 */
div.node {
  margin:0px 0px 10px;
  padding:0px 0px 9px;
  border-bottom:1px solid #e8e8e8;
  }

div.sticky {
  padding:4px 4px 9px;
  border:1px solid #e0e6e8;
  background:#f0f6f8;
  }

  /* Cancel out all the particulars for full node pages */
  body.node-page div.node {
    background:transparent;
    border:0px;
    padding:0px;
    margin:0px;
    }

div.node h2 {
  border:0px;
  font-size:24px;
  line-height:30px;
  font-weight:normal;
  }

  div.node h2 span.label {
    float:left;
    font-size:9px;
    font-weight:bold;
    line-height:20px;

    margin:5px 10px 0px 0px;
    padding:0px 5px;

    background:#666;
    color:#fff;
    }

div.node div.submitted {
  color:#888;
  margin:0px 0px 10px;
  font-size:11px;
  }

  body.node-page div.node div.submitted {
    border-bottom:1px solid #e8e8e8;
    padding:0px 0px 9px;
    }

div.node ul.links {
  float:right;
  font-size:11px;
  }

  div.node ul.links li a {
    border-right:1px solid #e8e8e8;
    padding:0px 10px;
    }

  div.node ul.links li.last a {
    border:0px;
    padding-right:0px;
    }

/**
 * AEGIR-SPECIFIC =====================================================
 */
div#hosting-wizard-form,
div.error,
div.message { width:auto; }

#hosting-task-log { clear:both; }

table,
table.hosting-table {
  font-size:11px;
  width:100%;
  }

table,
table tr,
table td,
table th,
table thead,
table body,
table.hosting-table,
table.hosting-table tr,
table.hosting-table td,
table.hosting-table th,
table.hosting-table thead,
table.hosting-table tbody {
  border:0px;
  padding:0px;
  }

table th,
table td,
table.hosting-table th,
table.hosting-table td {
  padding:4px 5px 5px;
  border-top:1px solid #fff;
  }

.modalframe .ui-dialog-titlebar,
table th,
table.hosting-table th {
  font-size:11px;
  background:#666 !important;
  }

 table th.active,
 table.hosting-table th.active { background:#555 !important; }

 table th,
 table th a { color:#fff; }

 table tr.even td { background-color:#fcfcfc; }
 table tr.odd td { background-color:#f8f8f8; }

#hosting-wizard-account-details,
#hosting-wizard-account-passwd {
  float:none;
  width:auto;
  padding:0px;
  }

/* Node info */
#hosting-task-list {
  width:290px;
  float:right;
}

#hosting-server-info,
#hosting-platform-info,
#hosting-package-info,
#hosting-site-info,
#hosting-task-info,
#hosting-site-edit-info {
  font-size:11px;
  background:#f8f8f8;
  float:left;
  padding:9px;
  border:1px solid #e8e8e8;
  margin:0px 0px 10px;
  width:280px;
  }

table.views-table { clear: both }

  #hosting-site-edit-info,
  #hosting-site-edit-info div.form-item {
    float:none;
    width:auto;
    }

  #hosting-site-edit-info div.form-item,
  body.ntype-task #page div.node div#hosting-task-info div.form-item,
  body.aegir #page div.node div.content div.form-item {
    float:none;
    position:relative;
    margin:0px;
    padding:5px 5px 4px 100px;
    border-bottom:1px solid #e8e8e8;
    }

    #hosting-site-edit-info div.form-item:last-child,
    body.ntype-task #page div.node div#hosting-task-info div.form-item:last-child,
    body.aegir #page div.node div.content div.form-item:last-child {
      border:0px;
      padding-bottom:5px;
      }

  body.aegir #page div.node div.content div.form-item label {
    position:absolute;
    left:0px;
    width:95px;
    white-space:nowrap;
    overflow:hidden;
    font-size:9px;
    display:block;
    }

  /* Exceptions */
  body.ntype-task #page div.node div.content div.form-item, /* This exception sucks */
  body.aegir #page #hosting-site-list div.form-item,
  body.aegir #page #hosting-task-list div.form-item {
    position:static;
    float:none;
    display:block;
    margin:0px;
    padding:0px;
    }

/* Forms */
.hosting-queue-frequency,
.hosting-queue-frequency-head {
  text-align:left;
  padding-right:inherit;
  }

div.hosting-queue-frequency {
  font-size:10px;
  text-align:left;
  white-space:nowrap;
  }

div.hosting-queue-frequency input,
div.hosting-queue-frequency select {
  padding:2px;
  font-size:10px;
  }

#edit-tasks-frequency-items-wrapper {
    float: left;
    margin: 0 0 5px 0;
}

#edit-cron-frequency-ticks-wrapper input,
#edit-tasks-frequency-items-wrapper input,
#edit-tasks-frequency-ticks-wrapper input {
    width: 3em;
    margin: 0 5px 0 0;
}

#edit-cron-frequency-ticks-wrapper {
    float: left;
}

#edit-tasks-frequency-ticks-wrapper {
    float: left;
    clear: both;
}

#edit-tasks-frequency-unit-wrapper,
#edit-cron-frequency-unit-wrapper {
    float: left;
}

/* Keep labels from being truncated */
body.aegir #page div.node div.content div.form-item label {
  width: auto;
}

body.aegir #page div.node div.content div.form-radios div.form-item,
body.aegir #page div.node div.content div.form-checkboxes div.form-item,
body.aegir #page div.node div.content div.form-option {
  border-bottom: none;
  padding-bottom: 1.5em;
}

/* Task buttons */
a.hosting-button-enabled,
.hosting-button-disabled {
  margin: 0 4px;
  text-align: center;
  height: 20px;
  width : 4em;

  padding-top: 0.1em;
  padding-bottom: 0.1em;

  -moz-border-radius:3px;
  -webkit-border-radius: 3px;
}

a.hosting-button-enabled:hover {
  background: #49a
}

a.hosting-button-enabled {
  color:#fff;
  background:#6ac;
}

.hosting-button-disabled {
  color:#eee;
  background:#aaa;
}

a.hosting-button-stop {
  background-color:#e66;
}

a.hosting-button-stop:hover {
  background-color:#c44;
}
/**
 * CORE ADMIN =========================================================
 */
body.path-node-add dt,
dl.admin-list dt,
div.admin-panel h3 { font-size:18px; }

body.path-node-add dd,
dl.admin-list dd {
  padding-bottom:9px;
  border-bottom:1px solid #e8e8e8;
  }

div.admin-panel {
  border:1px solid #e8e8e8;
  padding:9px;
  margin:10px 0px;
  background:#f8f8f8;
  }

  div.admin-panel dl.admin-list dt { font-size:13px; }

/* Split screens */
div.admin .right,
div.admin .left {
  padding:0px;
  width:265px;
  }

/* Put some space between multiselect options. See admin/content/node */
dl.multiselect div.form-item { margin:0px 0px 10px; }

/* Override Garland-specific styling for the available updates table */
.update table.version .version-links ul {
  float: right;
}

.update table.version .version-links ul li {
  float: none;
  padding-left: 1em;
}

.update table.version .version-links ul li a {
  float: none;
}

/**
 * ERROR PAGES ========================================================
 */
body.error-page div.page-content {
  border:1px solid #e8e8e8;
  background:#f8f8f8;
  padding:19px;
  font-size:18px;
  text-align:center;
  }

/* Modal frame */

.modalframe {
  color: #000000;
  background-color: #ffffff;
  border: 2px solid black;
}

.modalframe .ui-dialog-titlebar {
  border : 1px solid black;

}


/**
 * Login forms
 */
body.not-logged-in.page-user {
  background: #16527f;
  background: linear-gradient(#16527f, #151f3e);
  min-height: 100%;
  min-width: 350px;
}
body.not-logged-in.page-user div.form-item {
  padding: 10px 0;
  border: none;
}
body.not-logged-in.page-user h2.title {
  display: none;
}
#auth_box #the_logo {
  border: none;
}
#auth_box #middle_part {
  border-radius: 10px;
  box-shadow: 0 0 15px 3px rgba(0, 0, 0, .25);
}


/**
 * Permissions table ==================================================
 */
#user-admin-perm table {
  table-layout: fixed;
  width: 100%;
}

#user-admin-perm th {
  width: 100%;
}

#user-admin-perm th:first-of-type {
  width: 170px;
}

.sticky-header{
  z-index: 1;
}

File

style.css
View source
  1. /**
  2. * Eldir for Drupal 7
  3. * Designed for the Aegir hosting system.
  4. *
  5. * By Young Hahn (young@developmentseed.org)
  6. */
  7. /* Resets */
  8. body,
  9. table,
  10. table *,
  11. dl, dt, dd,
  12. ul.menu,
  13. ul.menu li,
  14. ul.menu li.leaf,
  15. ul.links,
  16. ul.links li,
  17. div.admin div.left,
  18. div.admin div.right,
  19. div.admin-panel,
  20. div.admin-panel div.body,
  21. div.admin-panel p.description,
  22. div.block ul,
  23. div.breadcrumb,
  24. div.item-list ul li,
  25. div.form-item,
  26. div.form-radios,
  27. div.form-checkboxes,
  28. div.form-radios div.form-item,
  29. div.form-checkboxes div.form-item,
  30. div.hosting-task-retry,
  31. h1, h2, h3, h4, h5, h6,
  32. ul, ol, li,
  33. p, blockquote {
  34. background-image:none;
  35. background-color:transparent;
  36. font-size:1em;
  37. font-weight:normal;
  38. margin:0px;
  39. padding:0px;
  40. }
  41. ul, ol,
  42. .item-list ul, .item-list ol {
  43. margin-left: 1em;
  44. }
  45. .block ul, .block ol, .block li {
  46. list-style:none;
  47. list-style-image:none;
  48. }
  49. html, body {
  50. height: 100%;
  51. }
  52. body {
  53. font: 13px/20px "Helvetica Neue",Arial,sans-serif;
  54. }
  55. body.aegir {
  56. color:#444;
  57. background:#fff;
  58. margin:0px;
  59. padding:0px;
  60. min-width: 950px;
  61. }
  62. strong {
  63. font-weight:bold;
  64. }
  65. a {
  66. color:#468;
  67. text-decoration:none;
  68. }
  69. a:hover { text-decoration:underline; }
  70. /* No underline for links that are likely to have good hover classes anyway. */
  71. ul.menu li a:hover,
  72. ul.links li a:hover { text-decoration:none; }
  73. /* Reverse color text/links */
  74. div.reverse { color:#fff; }
  75. div.reverse a { color:#ace; }
  76. h1, h2 {
  77. font-size:15px;
  78. font-weight:bold;
  79. padding:0px 0px 4px;
  80. border-bottom:1px solid #e8e8e8;
  81. }
  82. h3, h4, h5, h6 {
  83. color:#888;
  84. font-weight:bold;
  85. margin:0px 0px 5px;
  86. }
  87. dl,
  88. dd { margin:0px 0px 10px; }
  89. dt {
  90. margin:10px 0px 0px;
  91. font-weight:bold;
  92. }
  93. p { margin:0px 0px 10px; }
  94. div.limiter {
  95. width:940px;
  96. margin:0px auto;
  97. }
  98. ul.primary {
  99. line-height: inherit;
  100. }
  101. /**
  102. * LINKS ==============================================================
  103. */
  104. ul.primary,
  105. ul.primary li.active a,
  106. ul.secondary,
  107. ul.secondary li.active a,
  108. ul.tabs li,
  109. ul.tabs li a,
  110. ul.links li,
  111. ul.links li a {
  112. background:transparent;
  113. border:0px;
  114. margin:0px;
  115. padding:0px;
  116. }
  117. ul.tabs li,
  118. ul.tabs li a,
  119. ul.links li,
  120. ul.links li a { float:left; }
  121. /**
  122. * LISTS ==============================================================
  123. */
  124. div.node div.content ul,
  125. div#console div.messages ul { padding-left:20px; }
  126. div.node div.content ul li,
  127. div#console div.messages ul li { list-style: square; }
  128. /**
  129. * HEADER =============================================================
  130. */
  131. div#header {
  132. background:url(images/sprite.png) repeat-x;
  133. }
  134. div#header div.logo,
  135. div#header div.logo a,
  136. div#header div.site-name { float:left; }
  137. .logo img {
  138. width: 120px;
  139. margin-right: 10px;
  140. margin-top: 18px;
  141. }
  142. div#header div.site-name {
  143. font-size:18px;
  144. letter-spacing:-1px;
  145. color:#ace;
  146. line-height:40px;
  147. margin:20px 0px;
  148. padding:0px 0px 0px 19px;
  149. border-left:1px solid #258;
  150. }
  151. div#header form {
  152. width:370px;
  153. height:40px;
  154. line-height:40px;
  155. padding:20px 0px;
  156. float:right;
  157. text-align:right;
  158. }
  159. div#header form * { vertical-align:middle; }
  160. div#header form input.form-text { width:60%; }
  161. /**
  162. * NAVIGATION =========================================================
  163. */
  164. div#navigation {
  165. border-top:1px solid #258;
  166. background:url(images/sprite.png) 0px -80px;
  167. }
  168. div#navigation div.breadcrumb {
  169. line-height:40px;
  170. font-size:11px;
  171. float:left;
  172. }
  173. div#navigation ul.links {
  174. padding:5px 0px 0px;
  175. float:right;
  176. }
  177. div#navigation ul.links a {
  178. background:#147;
  179. font-size:11px;
  180. line-height:25px;
  181. padding:5px 15px;
  182. margin-right:1px;
  183. }
  184. div#navigation ul.links a:hover {
  185. background:#6ac;
  186. color:#000;
  187. }
  188. div#navigation ul.links li.active a,
  189. div#navigation ul.links li a.active {
  190. background:#e8e8e8;
  191. color:#444;
  192. }
  193. /**
  194. * HEADER REGION ======================================================
  195. */
  196. div#header-region {
  197. padding:20px 0px 0px;
  198. background:#e8e8e8 url(images/grid_e8.png) 50% 0% repeat; }
  199. div#header-region h2.page-title {
  200. border:0px;
  201. padding:0px 0px 10px;
  202. letter-spacing:-2px;
  203. line-height:40px;
  204. font-size:32px;
  205. font-weight:normal;
  206. }
  207. div#header-region h2.page-title span.label {
  208. font-size:13px;
  209. font-weight:bold;
  210. letter-spacing:0px;
  211. float:left;
  212. margin:5px 10px 5px 0px;
  213. padding:0px 10px;
  214. line-height:30px;
  215. background:#666;
  216. color:#fff;
  217. }
  218. #page ul.tabs,
  219. div#header-region ul.tabs { clear:both; }
  220. div#header-region ul.tabs li { height:30px; }
  221. #page ul.tabs li a,
  222. div#header-region ul.tabs li a {
  223. padding:5px 15px;
  224. font-size:11px;
  225. }
  226. div#header-region ul.tabs li a:hover {
  227. background:#666;
  228. color:#fff;
  229. }
  230. div#header-region ul.tabs li.active a,
  231. div#header-region ul.tabs li a.active {
  232. padding: 5px 15px;
  233. background:#fff;
  234. color:#444;
  235. border-bottom:1px solid #fff;
  236. }
  237. /**
  238. * PAGE LAYOUT ========================================================
  239. */
  240. div#page {
  241. background:#eee url(images/grid_e8.png) 50% 0% repeat;
  242. padding-bottom:40px;
  243. }
  244. div#page div.limiter { background:url(images/page.png) repeat-y; }
  245. body.wide div#page div.limiter {
  246. padding-right:190px;
  247. width:750px;
  248. }
  249. div#main {
  250. float:left;
  251. width:600px;
  252. padding:10px;
  253. clear:both;
  254. }
  255. body.wide div#main {
  256. background:#fff;
  257. float:none;
  258. width:950px;
  259. }
  260. div.sidebar {
  261. float:right;
  262. width:300px;
  263. padding:10px;
  264. }
  265. #page ul.tabs {
  266. height:29px;
  267. border-bottom:1px solid #e8e8e8;
  268. background:#fff;
  269. }
  270. /**
  271. * BLOCKS > SIDEBAR ===================================================
  272. */
  273. div.sidebar div.block { margin:0px 0px 20px; }
  274. div.sidebar div.block div.content { padding:5px 0px 0px; }
  275. div.sidebar div.item-list { margin:0px 0px 10px; }
  276. div.sidebar ul.menu li,
  277. div.sidebar div.item-list li {
  278. list-style:none;
  279. font-size:11px;
  280. padding:0px;
  281. margin:0px 0px 5px;
  282. background:#fff;
  283. }
  284. div.sidebar div.item-list li,
  285. div.sidebar ul.menu a {
  286. display:block;
  287. padding:2px 10px;
  288. }
  289. div.sidebar ul.menu ul { padding-left:10px; }
  290. div.sidebar ul.menu li li {
  291. margin:0px;
  292. border-top:1px solid #f0f0f0;
  293. }
  294. div.sidebar ul.menu a:hover {
  295. color:#fff;
  296. background:#6ac;
  297. }
  298. /* Corner rounding logic */
  299. div.sidebar ul.menu li,
  300. div.sidebar ul.menu a,
  301. div.sidebar div.item-list li {
  302. -moz-border-radius:3px;
  303. -webkit-border-radius: 3px;
  304. }
  305. div.sidebar ul.menu li.expanded a {
  306. -moz-border-radius:0px;
  307. -moz-border-radius-topleft:3px;
  308. -moz-border-radius-topright:3px;
  309. -webkit-border-radius: 0px;
  310. -webkit-border-top-left-radius:3px;
  311. -webkit-border-top-right-radius:3px;
  312. }
  313. div.sidebar ul.menu li.expanded li,
  314. div.sidebar ul.menu li.expanded li a {
  315. -moz-border-radius:0px;
  316. -webkit-border-radius: 0px;
  317. }
  318. /**
  319. * CONSOLE MESSAGES ===================================================
  320. */
  321. div#console {
  322. font-size:15px;
  323. border-top:1px solid #111;
  324. border-bottom:1px solid #fff;
  325. padding:9px 0px;
  326. background:#222 url(images/sprite.png) 0px -240px repeat-x;
  327. }
  328. div#console div.messages {
  329. color:#8cf;
  330. text-shadow:0px 0px 15px #06c;
  331. background:#024;
  332. margin:5px 0px;
  333. padding:9px;
  334. border-style:solid;
  335. border-color:#048;
  336. border-width:1px 1px 1px 6px;
  337. }
  338. div#console div.error {
  339. background-color:#400;
  340. border-color:#800;
  341. color:#fa4;
  342. text-shadow:0px 0px 15px #c30;
  343. }
  344. div#console div.warning {
  345. background-color:#630;
  346. border-color:#a50;
  347. color:#fe4;
  348. text-shadow:0px 0px 15px #c80;
  349. }
  350. div#console div.ok {
  351. background-color:#040;
  352. border-color:#080;
  353. color:#cfc;
  354. text-shadow:0px 0px 15px #0c6;
  355. }
  356. /* Exceptions */
  357. /* make sure devel module messages are readable */
  358. div.krumo-root, div.krumo-root a {
  359. color: black;
  360. text-shadow: none;
  361. }
  362. /**
  363. * FOOTER =============================================================
  364. */
  365. #footer {
  366. background:#666;
  367. padding:20px 0px;
  368. line-height:40px;
  369. height:40px;
  370. }
  371. #footer ul.links { float:right; }
  372. /**
  373. * FORMS ==============================================================
  374. */
  375. select,
  376. textarea,
  377. input.form-text {
  378. width:90%;
  379. font: 13px/20px "Helvetica Neue",Arial,sans-serif;
  380. padding:3px;
  381. border:1px solid #ddd;
  382. background-color:#fff;
  383. }
  384. select:focus,
  385. textarea:focus,
  386. input.form-text:focus {
  387. background-color:#f0f8ff;
  388. border-color:#abc;
  389. }
  390. div.reverse select,
  391. div.reverse textarea,
  392. div.reverse input.form-text {
  393. background-color:#124;
  394. color:#fff;
  395. border-color:#258;
  396. }
  397. html.js input.form-autocomplete { background-position:100% 4px; }
  398. html.js input.throbbing { background-position: 100% -16px; }
  399. td select,
  400. td input.form-text,
  401. div.container-inline select,
  402. div.container-inline input.form-text { width:auto; }
  403. input.form-submit {
  404. font: bold 13px/20px "Helvetica Neue",Arial,sans-serif;
  405. border:0px;
  406. padding:5px 10px;
  407. color:#fff;
  408. background:#666;
  409. cursor:pointer;
  410. -moz-border-radius:3px;
  411. -webkit-border-radius: 3px;
  412. }
  413. input.form-submit[disabled] {
  414. color:#ddd;
  415. background:#eee;
  416. cursor: default;
  417. }
  418. body.page-admin input.form-submit,
  419. body.page-admin #views-ajax-pad .form-submit {
  420. padding: 0 4px;
  421. }
  422. div.reverse input.form-submit { background:#124; }
  423. form div.form-item {
  424. clear:both;
  425. position:relative;
  426. margin:0px;
  427. padding:10px 10px 9px;
  428. border-bottom:1px solid #e8e8e8;
  429. }
  430. form div.form-item-labeled { padding-left:180px; }
  431. form div.form-item-labeled label {
  432. font-size:11px;
  433. position:absolute;
  434. left:0px;
  435. width:170px;
  436. }
  437. /* Exceptions */
  438. body.page-admin div.form-item,
  439. dl.multiselect div.form-item,
  440. div.sidebar form div.form-item,
  441. form#system-theme-settings div.form-item,
  442. form div.form-item div.form-item,
  443. form table div.form-item,
  444. form div.container-inline div.form-item,
  445. form div.form-checkboxes div.form-item,
  446. form div.form-radios div.form-item {
  447. clear:none;
  448. padding:0px;
  449. border:0px;
  450. }
  451. body.page-admin div.form-item label,
  452. dl.multiselect div.form-item label,
  453. div.sidebar form div.form-item label,
  454. form div.form-item label.option,
  455. form#system-theme-settings div.form-item label,
  456. form div.form-item div.form-item label,
  457. form table div.form-item label,
  458. form div.container-inline div.form-item label,
  459. form div.form-checkboxes div.form-item label,
  460. form div.form-radios div.form-item label {
  461. width:auto;
  462. position:static;
  463. }
  464. div.form-item label.option,
  465. div.form-item label.option * {
  466. font-size:1em;
  467. vertical-align:middle;
  468. }
  469. div.form-item div.description {
  470. margin:5px 0px;
  471. line-height:15px;
  472. font-size:11px;
  473. color:#666;
  474. }
  475. form input#edit-publish-path {
  476. width:auto;
  477. }
  478. /* Fieldsets... what a nightmare */
  479. body.aegir fieldset {
  480. background:#f8f8f8;
  481. margin:10px 0px;
  482. padding:25px 10px 10px;
  483. border:0px;
  484. display:block;
  485. -moz-border-radius:3px;
  486. -webkit-border-radius: 3px;
  487. }
  488. body.aegir fieldset.collapsible {
  489. position:relative;
  490. padding:25px 0px 0px;
  491. }
  492. body.aegir fieldset.collapsible div.fieldset-wrapper { padding:10px; }
  493. html.js body.aegir fieldset.collapsed {
  494. height:0px;
  495. margin:10px 0px;
  496. background:transparent;
  497. }
  498. body.aegir fieldset legend {
  499. font-size:11px;
  500. font-weight:bold;
  501. margin-bottom:-25px;
  502. }
  503. body.aegir fieldset.collapsible legend { margin:0px; }
  504. body.aegir fieldset.collapsible legend a,
  505. html.js body.aegir fieldset.collapsible legend a {
  506. position:absolute;
  507. right:0px;
  508. left:0px;
  509. background:#eee;
  510. font-size:11px;
  511. display:block;
  512. padding:2px 10px 3px;
  513. }
  514. body.aegir fieldset.collapsible legend a {
  515. -moz-border-radius-topleft:3px;
  516. -moz-border-radius-topright:3px;
  517. -webkit-border-top-left-radius: 3px;
  518. -webkit-border-top-right-radius: 3px;
  519. }
  520. body.aegir fieldset.collapsed legend a {
  521. -moz-border-radius:3px;
  522. -webkit-border-radius:3px;
  523. }
  524. /**
  525. * NODES ==============================================================
  526. */
  527. div.node {
  528. margin:0px 0px 10px;
  529. padding:0px 0px 9px;
  530. border-bottom:1px solid #e8e8e8;
  531. }
  532. div.sticky {
  533. padding:4px 4px 9px;
  534. border:1px solid #e0e6e8;
  535. background:#f0f6f8;
  536. }
  537. /* Cancel out all the particulars for full node pages */
  538. body.node-page div.node {
  539. background:transparent;
  540. border:0px;
  541. padding:0px;
  542. margin:0px;
  543. }
  544. div.node h2 {
  545. border:0px;
  546. font-size:24px;
  547. line-height:30px;
  548. font-weight:normal;
  549. }
  550. div.node h2 span.label {
  551. float:left;
  552. font-size:9px;
  553. font-weight:bold;
  554. line-height:20px;
  555. margin:5px 10px 0px 0px;
  556. padding:0px 5px;
  557. background:#666;
  558. color:#fff;
  559. }
  560. div.node div.submitted {
  561. color:#888;
  562. margin:0px 0px 10px;
  563. font-size:11px;
  564. }
  565. body.node-page div.node div.submitted {
  566. border-bottom:1px solid #e8e8e8;
  567. padding:0px 0px 9px;
  568. }
  569. div.node ul.links {
  570. float:right;
  571. font-size:11px;
  572. }
  573. div.node ul.links li a {
  574. border-right:1px solid #e8e8e8;
  575. padding:0px 10px;
  576. }
  577. div.node ul.links li.last a {
  578. border:0px;
  579. padding-right:0px;
  580. }
  581. /**
  582. * AEGIR-SPECIFIC =====================================================
  583. */
  584. div#hosting-wizard-form,
  585. div.error,
  586. div.message { width:auto; }
  587. #hosting-task-log { clear:both; }
  588. table,
  589. table.hosting-table {
  590. font-size:11px;
  591. width:100%;
  592. }
  593. table,
  594. table tr,
  595. table td,
  596. table th,
  597. table thead,
  598. table body,
  599. table.hosting-table,
  600. table.hosting-table tr,
  601. table.hosting-table td,
  602. table.hosting-table th,
  603. table.hosting-table thead,
  604. table.hosting-table tbody {
  605. border:0px;
  606. padding:0px;
  607. }
  608. table th,
  609. table td,
  610. table.hosting-table th,
  611. table.hosting-table td {
  612. padding:4px 5px 5px;
  613. border-top:1px solid #fff;
  614. }
  615. .modalframe .ui-dialog-titlebar,
  616. table th,
  617. table.hosting-table th {
  618. font-size:11px;
  619. background:#666 !important;
  620. }
  621. table th.active,
  622. table.hosting-table th.active { background:#555 !important; }
  623. table th,
  624. table th a { color:#fff; }
  625. table tr.even td { background-color:#fcfcfc; }
  626. table tr.odd td { background-color:#f8f8f8; }
  627. #hosting-wizard-account-details,
  628. #hosting-wizard-account-passwd {
  629. float:none;
  630. width:auto;
  631. padding:0px;
  632. }
  633. /* Node info */
  634. #hosting-task-list {
  635. width:290px;
  636. float:right;
  637. }
  638. #hosting-server-info,
  639. #hosting-platform-info,
  640. #hosting-package-info,
  641. #hosting-site-info,
  642. #hosting-task-info,
  643. #hosting-site-edit-info {
  644. font-size:11px;
  645. background:#f8f8f8;
  646. float:left;
  647. padding:9px;
  648. border:1px solid #e8e8e8;
  649. margin:0px 0px 10px;
  650. width:280px;
  651. }
  652. table.views-table { clear: both }
  653. #hosting-site-edit-info,
  654. #hosting-site-edit-info div.form-item {
  655. float:none;
  656. width:auto;
  657. }
  658. #hosting-site-edit-info div.form-item,
  659. body.ntype-task #page div.node div#hosting-task-info div.form-item,
  660. body.aegir #page div.node div.content div.form-item {
  661. float:none;
  662. position:relative;
  663. margin:0px;
  664. padding:5px 5px 4px 100px;
  665. border-bottom:1px solid #e8e8e8;
  666. }
  667. #hosting-site-edit-info div.form-item:last-child,
  668. body.ntype-task #page div.node div#hosting-task-info div.form-item:last-child,
  669. body.aegir #page div.node div.content div.form-item:last-child {
  670. border:0px;
  671. padding-bottom:5px;
  672. }
  673. body.aegir #page div.node div.content div.form-item label {
  674. position:absolute;
  675. left:0px;
  676. width:95px;
  677. white-space:nowrap;
  678. overflow:hidden;
  679. font-size:9px;
  680. display:block;
  681. }
  682. /* Exceptions */
  683. body.ntype-task #page div.node div.content div.form-item, /* This exception sucks */
  684. body.aegir #page #hosting-site-list div.form-item,
  685. body.aegir #page #hosting-task-list div.form-item {
  686. position:static;
  687. float:none;
  688. display:block;
  689. margin:0px;
  690. padding:0px;
  691. }
  692. /* Forms */
  693. .hosting-queue-frequency,
  694. .hosting-queue-frequency-head {
  695. text-align:left;
  696. padding-right:inherit;
  697. }
  698. div.hosting-queue-frequency {
  699. font-size:10px;
  700. text-align:left;
  701. white-space:nowrap;
  702. }
  703. div.hosting-queue-frequency input,
  704. div.hosting-queue-frequency select {
  705. padding:2px;
  706. font-size:10px;
  707. }
  708. #edit-tasks-frequency-items-wrapper {
  709. float: left;
  710. margin: 0 0 5px 0;
  711. }
  712. #edit-cron-frequency-ticks-wrapper input,
  713. #edit-tasks-frequency-items-wrapper input,
  714. #edit-tasks-frequency-ticks-wrapper input {
  715. width: 3em;
  716. margin: 0 5px 0 0;
  717. }
  718. #edit-cron-frequency-ticks-wrapper {
  719. float: left;
  720. }
  721. #edit-tasks-frequency-ticks-wrapper {
  722. float: left;
  723. clear: both;
  724. }
  725. #edit-tasks-frequency-unit-wrapper,
  726. #edit-cron-frequency-unit-wrapper {
  727. float: left;
  728. }
  729. /* Keep labels from being truncated */
  730. body.aegir #page div.node div.content div.form-item label {
  731. width: auto;
  732. }
  733. body.aegir #page div.node div.content div.form-radios div.form-item,
  734. body.aegir #page div.node div.content div.form-checkboxes div.form-item,
  735. body.aegir #page div.node div.content div.form-option {
  736. border-bottom: none;
  737. padding-bottom: 1.5em;
  738. }
  739. /* Task buttons */
  740. a.hosting-button-enabled,
  741. .hosting-button-disabled {
  742. margin: 0 4px;
  743. text-align: center;
  744. height: 20px;
  745. width : 4em;
  746. padding-top: 0.1em;
  747. padding-bottom: 0.1em;
  748. -moz-border-radius:3px;
  749. -webkit-border-radius: 3px;
  750. }
  751. a.hosting-button-enabled:hover {
  752. background: #49a
  753. }
  754. a.hosting-button-enabled {
  755. color:#fff;
  756. background:#6ac;
  757. }
  758. .hosting-button-disabled {
  759. color:#eee;
  760. background:#aaa;
  761. }
  762. a.hosting-button-stop {
  763. background-color:#e66;
  764. }
  765. a.hosting-button-stop:hover {
  766. background-color:#c44;
  767. }
  768. /**
  769. * CORE ADMIN =========================================================
  770. */
  771. body.path-node-add dt,
  772. dl.admin-list dt,
  773. div.admin-panel h3 { font-size:18px; }
  774. body.path-node-add dd,
  775. dl.admin-list dd {
  776. padding-bottom:9px;
  777. border-bottom:1px solid #e8e8e8;
  778. }
  779. div.admin-panel {
  780. border:1px solid #e8e8e8;
  781. padding:9px;
  782. margin:10px 0px;
  783. background:#f8f8f8;
  784. }
  785. div.admin-panel dl.admin-list dt { font-size:13px; }
  786. /* Split screens */
  787. div.admin .right,
  788. div.admin .left {
  789. padding:0px;
  790. width:265px;
  791. }
  792. /* Put some space between multiselect options. See admin/content/node */
  793. dl.multiselect div.form-item { margin:0px 0px 10px; }
  794. /* Override Garland-specific styling for the available updates table */
  795. .update table.version .version-links ul {
  796. float: right;
  797. }
  798. .update table.version .version-links ul li {
  799. float: none;
  800. padding-left: 1em;
  801. }
  802. .update table.version .version-links ul li a {
  803. float: none;
  804. }
  805. /**
  806. * ERROR PAGES ========================================================
  807. */
  808. body.error-page div.page-content {
  809. border:1px solid #e8e8e8;
  810. background:#f8f8f8;
  811. padding:19px;
  812. font-size:18px;
  813. text-align:center;
  814. }
  815. /* Modal frame */
  816. .modalframe {
  817. color: #000000;
  818. background-color: #ffffff;
  819. border: 2px solid black;
  820. }
  821. .modalframe .ui-dialog-titlebar {
  822. border : 1px solid black;
  823. }
  824. /**
  825. * Login forms
  826. */
  827. body.not-logged-in.page-user {
  828. background: #16527f;
  829. background: linear-gradient(#16527f, #151f3e);
  830. min-height: 100%;
  831. min-width: 350px;
  832. }
  833. body.not-logged-in.page-user div.form-item {
  834. padding: 10px 0;
  835. border: none;
  836. }
  837. body.not-logged-in.page-user h2.title {
  838. display: none;
  839. }
  840. #auth_box #the_logo {
  841. border: none;
  842. }
  843. #auth_box #middle_part {
  844. border-radius: 10px;
  845. box-shadow: 0 0 15px 3px rgba(0, 0, 0, .25);
  846. }
  847. /**
  848. * Permissions table ==================================================
  849. */
  850. #user-admin-perm table {
  851. table-layout: fixed;
  852. width: 100%;
  853. }
  854. #user-admin-perm th {
  855. width: 100%;
  856. }
  857. #user-admin-perm th:first-of-type {
  858. width: 170px;
  859. }
  860. .sticky-header{
  861. z-index: 1;
  862. }