@charset "UTF-8";
/**
 * Extend or override Bulma's components,
 * ../../node_modules/bulma/sass/components
 */

/**
 * Make menu items slightly less far apart so we never entirely lose
 * 'Community' on mid-size screens.
 * See https://gitlab.com/drutopia/octavia/issues/52
 */
.navbar-item, .navbar-link {
  padding-left: .75rem;
  padding-right: .75rem;
  @include from($widescreen) {
    padding-left: 1rem;
    padding-right: 1rem;
  }
}

/* Featured images on article pages */
.featured-image figure.image {
  width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  img {
    width: 100%;
  }
}

/* Hero image in hero block */
.has-background-image.hero {
  width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
}

/* Slim down section vertical padding a bit.*/
.section {
  padding: 0.5rem 1.5rem 1.5rem;
}

/* Give titles, from which we removed the Hero classes, the same padding as sections. */
.block-page-title-block {
  padding: 1rem 1.5rem;
}

/**
 * Give enough of a background around text in the footer that it is legible on
 * any part of the grassy field image used as the background.
 *
 * The link and changed text are not dark so we need a pretty high opacity.
 */
.footer .views-field {
  .field-content {
    background-color: rgba($offwhite, 0.9);
    padding: 0.2em;
    border-radius: 0.3em;
  }
  &.views-field-changed {
    font-size: 0.8em;
    color: $green-gray;
    margin-top: 0.2rem;
    margin-bottom: 0.4rem;
    text-align: right;
  }
}

.page-title .title > span {
  background-color: rgba($offwhite, 0.66);
  padding: 0.2em;
  border-radius: 0.3em;
}