Club Drupal

/**

 * @file

 * Main theme stylesheet.

 */

/*******************************************************************************

 * General styles

 ******************************************************************************/

body,

input,

textarea,

select,

.ui-widget,

.ui-widget input,

.ui-widget select,

.ui-widget textarea,

.ui-widget button {

  font-family: "Lucida", "Lucida Grande", "Trebuchet MS", Tahoma, Verdana, sans-serif;

}

html {

  overflow-y: scroll;

}

body.tao {

  color: #333;

  background: #fff;

}

a {

  color: #008eb1;

  text-decoration: none;

}

.limiter {

  margin: 0 30px;

}

/* Skip to content link. */

#skip-link {

  width: 200px;

  height: 0;

  left: 50%;

  margin-left: -100px;

}

#skip-link a:hover,

#skip-link a:active,

#skip-link a:focus {

  left: 0;

  z-index: 20;

  text-align: center;

  width: 200px;

  background: #333;

  color: #fff;

  opacity: .9;

  padding: 10px 0;

  -webkit-border-radius: 0 0 5px 5px;

     -moz-border-radius: 0 0 5px 5px;

          border-radius: 0 0 5px 5px;

}

/* "Rounded" elements. */

a.button,

.compact-link a,

input.form-submit,

input.teaser-button,

.form-actions #edit-cancel {

  -webkit-border-radius: 3px;

     -moz-border-radius: 3px;

          border-radius: 3px;

}

/* "Popped" elements. */

input.teaser-button,

input.form-submit,

a.button,

.form-actions #edit-cancel {

  -webkit-box-shadow: #ddd 0 1px 1px;

     -moz-box-shadow: #ddd 0 1px 1px;

          box-shadow: #ddd 0 1px 1px;

}

/* "Embossed" elements. */

table th {

  text-shadow: #fff 0 1px 0;

}

/* General styles end */

/*******************************************************************************

 * Branding

 ******************************************************************************/

#branding {

  background: url(../images/bleeds.png) 0 -30px repeat-x;

  color: #ccc;

  font-size: 11px;

  height: 30px;

  overflow: hidden;

}

#branding ul.links {

  float: right;

}

#branding ul.links a {

  background: url(../images/bleeds.png) 0% -30px no-repeat;

  color: #fff;

  float: left;

  padding: 5px 10px;

}

#branding ul.links a:hover {

  background-position: 0% -90px;

}

#branding .breadcrumb {

  padding: 0;

  float: left;

  font-weight: normal;

}

#branding .breadcrumb-link {

  float: left;

  position: relative;

}

#branding .breadcrumb-depth-0 {

  z-index: 10;

}

#branding .breadcrumb-depth-1 {

  z-index: 9;

}

#branding .breadcrumb-depth-2 {

  z-index: 8;

}

#branding .breadcrumb-depth-3 {

  z-index: 7;

}

#branding .breadcrumb-depth-4 {

  z-index: 6;

}

#branding .breadcrumb-depth-5 {

  z-index: 5;

}

#branding .breadcrumb-depth-6 {

  z-index: 4;

}

#branding .breadcrumb-depth-7 {

  z-index: 3;

}

#branding .breadcrumb-depth-8 {

  z-index: 2;

}

#branding .breadcrumb-link > a,

#branding .breadcrumb-link > strong {

  color: #fff;

  font-weight: normal;

  float: left;

  margin-right: -10px;

  padding: 5px 20px;

  background: url(../images/bleeds.png) 100% -60px no-repeat;

}

#branding .breadcrumb-depth-0 a,

#branding .breadcrumb-depth-0 strong {

  padding-left: 10px;

}

#branding .breadcrumb a:hover {

  background-position: 100% -90px;

}

/* Branding end */

/*******************************************************************************

 * Page title

 ******************************************************************************/

#page-title {

  background: #fff url(../images/bleeds.png) 0 -350px repeat-x;

}

#page-title .limiter {

  position: relative;

}

#page-title .page-title {

  float: left;

  padding: 15px 10px 15px 0;

  line-height: 30px;

  min-height: 30px;

  -webkit-text-shadow: #fff 0 1px 0;

          text-shadow: #fff 0 1px 0;

  letter-spacing: -1px;

  font-weight: normal;

  font-size: 20px;

}

#page-title .page-title span.icon {

  float: left;

  margin-right: 10px;

}

.add-or-remove-shortcuts,

.action-links {

  float: left;

  font-size: 11px;

}

.add-or-remove-shortcuts {

  padding: 20px 0;

}

.action-links {

  padding: 20px 0 20px 10px;

}

.action-links a {

  background-color: #7bc;

  text-shadow: #38a 0 1px 0;

}

.add-or-remove-shortcuts a {

  background-color: #999;

  text-shadow: #666 0 1px 0;

}

/* Page title end */

/*******************************************************************************

 * Tabs

 ******************************************************************************/

.tabs {

  float: right;

  right: 0;

}

.primary-tabs {

  height: 30px;

  margin: 15px 0 0;

  -webkit-border-radius: 5px;

     -moz-border-radius: 5px;

          border-radius: 5px;

}

div.pager {

  margin: 10px 0 0;

  height: 30px;

}

.pager li,

.primary-tabs li {

  height: 30px;

  position: relative;

  background: #eee url(../images/bleeds.png) 50% 0 no-repeat;

  margin-bottom: 10px;

}

.pager a,

.pager span,

.primary-tabs a {

  float: left;

  text-align: center;

  min-width: 70px;

  padding: 5px 10px;

  color: #333;

  text-shadow: #fff 0 1px 0;

}

.pager a,

.pager span {

  min-width: 10px;

  padding: 5px 15px;

}

.pager li:hover,

.primary-tabs li:hover {

  background-color: #f8f8f8;

}

.pager li:first-child,

.primary-tabs li.first-row-link {

  background-position: 0% 0;

  -webkit-border-radius: 5px 0 0 5px;

     -moz-border-radius: 5px 0 0 5px;

          border-radius: 5px 0 0 5px;

}

.pager li:last-child,

.primary-tabs li.last-row-link {

  background-position: 100% 0;

  -webkit-border-radius: 0 5px 5px 0;

     -moz-border-radius: 0 5px 5px 0;

          border-radius: 0 5px 5px 0;

}

/* This style is necessary in case there is only one tab that goes to the

second row. */

.primary-tabs li.first-row-link.last-row-link {

  background-position: 0% 0;

  -webkit-border-radius: 5px;

     -moz-border-radius: 5px;

          border-radius: 5px;

}

.pager li.pager-current,

.primary-tabs li.active {

  background-color: #7bc;

}

.pager li.pager-current span,

.primary-tabs li.active a {

  color: #fff;

  text-shadow: #38a 0 1px 0;

}

/* Secondary tabs, nested */

.secondary-tabs {

  min-width: 150px;

  float: left;

  position: relative;

  margin: 5px 5px 5px 0;

  font-size: 11px;

  background: #59a url(../images/buttons.png) -800px 50% no-repeat;

  -webkit-border-radius: 3px;

     -moz-border-radius: 3px;

          border-radius: 3px;

  z-index: 1;

}

.secondary-tabs:hover {

  background: #59a;

  opacity: .9;

}

ul.secondary-tabs li,

ul.secondary-tabs li a {

  background: transparent;

  float: none;

  height: auto;

  text-align: left;

  margin-bottom: 0;

}

.secondary-tabs a {

  color: #fff;

  text-shadow: #38a 0 1px 0;

  display: none;

  padding: 0 10px 0 25px;

}

.secondary-tabs:hover a,

.secondary-tabs .active a {

  display: block;

}

.secondary-tabs li:hover,

.secondary-tabs li.active {

  background: transparent;

}

.secondary-tabs a:hover {

  background: #389 url(../images/buttons.png) -800px 50% no-repeat;

}

.secondary-tabs li:last-child a:hover {

  -webkit-border-radius: 0 0 3px 3px;

     -moz-border-radius: 0 0 3px 3px;

          border-radius: 0 0 3px 3px;

}

.secondary-tabs li:first-child a:hover {

  -webkit-border-radius: 3px 3px 0 0;

     -moz-border-radius: 3px 3px 0 0;

          border-radius: 3px 3px 0 0;

}

ul.secondary.tabs {

  position: static;

  float: right;

  font-size: 0.923em;

  padding: 0 3px 5px;

  line-height: 1.385em;

  overflow: hidden;

  background-color: #fff;

}

ul.secondary.tabs li {

  margin: 0 5px;

  float: none;

  display: inline;

}

/* Tabs end */

/*******************************************************************************

 * Content

 ******************************************************************************/

.help-page,

div.comment,

div.node {

  border-style: solid;

  border-width: 1px;

  border-color: #ddd;

  background: #fff url(../images/vrule.png) 65% 0% repeat-y;

  margin: 0 0 10px;

}

/* Make large images display within the parent container. This will prevent

messing up the layout if a wide image needs to be displayed in content. */

#page img {

  max-width: 100%;

}

#help-text .column-main .column-wrapper,

.help-page .column-main .column-wrapper,

div.comment .column-main .column-wrapper,

div.node .column-main .column-wrapper {

  padding: 19px;

}

#help-text .column-main .column-wrapper {

  padding-left: 59px;

  position: relative;

}

#help-text .column-main .column-wrapper span.icon {

  position: absolute;

  top: 15px;

  left: 15px;

}

#help-text .column-side .column-wrapper,

.help-page .column-side .column-wrapper,

div.comment .column-side .column-wrapper,

div.node .column-side .column-wrapper {

  padding: 9px;

  font-size: 11px;

}

#help-text .column-side .help-links,

.help-page .column-side .help-page-links,

.node-submitted,

.comment-submitted {

  padding: 10px;

  background: #f8f8f8;

}

.comment-links,

.node-links {

  padding: 10px 0;

}

.help-page .help-page-links ul.links {

  -webkit-column-count: 2;

     -moz-column-count: 2;

}

.column-side ul.links li,

.column-side ul.links a,

.column-side ul.links span {

  display: block;

  float: none;

}

.column-side ul.links a,

.column-side ul.links span {

  padding: 0 10px;

  display: block;

  float: none;

}

.column-side ul.links span a {

  padding: 0;

  display: inline;

}

.column-side ul.links a.active,

.column-side ul.links a:hover {

  background: #fff;

}

.comment-links ul.links a:hover {

  background: #f4f4f4;

}

.comment-title,

.node-title {

  margin: 0 0 20px;

  font-weight: normal;

  font-size: 16px;

}

/* Content end */

/*******************************************************************************

 * Fixes for other modules

 ******************************************************************************/

/* Fix rules action links. */

.rules-elements-table ul.rules-operations a {

  text-shadow: none;

  color: #666;

}

/* Fix the position of Rules table drag toggle. It uses "position: absolute", so

it is necessary to set "position: relative" to the parent, so that the button

stays in the same frame. */

#rules-form-wrapper {

  position: relative;

}

/* Fix the padding of Rules table drag toggle. Out of the box it is optimized

for display in table headers, while in Rules it is displayed outside of the

tables, in the same line as table heading. */

#rules-form-wrapper .rules-elements-table .tabledrag-toggle-weight-wrapper {

  padding-top: 0;

  padding-right: 0;

}

/* Views exposed filters forms. */

div.views-exposed-form {

  margin-bottom: 20px;

}

div.views-exposed-form div.form-item {

  border: 0;

  padding: 0;

}

div.views-exposed-form div.views-submit-button {

  margin-right: 1em;

}

div.views-exposed-form input.form-text,

div.views-exposed-form input.form-autocomplete {

  height: 28px;

}

/* Views header on administrative pages (displayed while editing a view). */

.views-display-top {

  padding: 10px;

}

/* CTools toggle in views display columns. This is displayed while editing or

creating a view. */

.views-display-column > .ctools-toggle {

  margin-top: 14px;

}

.views-display-column > .ctools-toggle.ctools-toggle-collapsed {

  margin-top: 11px;

}

/* Module filter "clear" link. */

.module-filter-clear a {

  margin: 3px 0 0 -35px;

}

/* Fix Workbench Moderation links. */

.view-workbench-moderation tbody .views-field-moderation-actions li {

  float: none;

  margin-bottom: 5px;

  margin-right: 3px;

  overflow: auto;

}

.view-workbench-moderation tbody .views-field-moderation-actions li a {

  background-color: #7bc;

  -webkit-border-radius: 5px;

     -moz-border-radius: 5px;

          border-radius: 5px;

  color: #fff;

  display: block;

  padding: 0 7px;

  text-shadow: #38a 0 1px 0;

}

.view-workbench-moderation tbody .views-field-moderation-actions li a:hover {

  background-color: #52a8be;

  color: #fff;

}

/* Fixes for other modules end */