.section-layout-title {
  font-family: 'open_sans', sans-serif;

  /*
   * Foreground
   */

  .foreground {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
    text-align: center;
    color: #FFF;
    padding-bottom: 0;
    text-shadow: 0 0 8px rgba(0, 0, 0, 0.95);
    font-size: 1.5em;

    min-height: 90px;
    line-height: 90px;
    vertical-align: middle;
    pointer-events: none;

    .text-background {
      display: inline-block;
      vertical-align: middle;
      line-height: normal;
    }

    .fg-title {
      display: inline-block;
      vertical-align: middle;
      font-size: 52px;
      line-height: 105%;
      word-break: break-word;
      pointer-events: all;
    }
  }

  &.size-medium .foreground {
    height: 200px;
    line-height: 200px;
  }

  &.size-large .foreground {
    height: 400px;
    line-height: 400px;
  }

  /*
   * Background
   */

  .background {
    overflow: hidden;
    pointer-events: inherit;
  }

  /*
   * Credits
   */

  .fg-credits {
    position: absolute;
    bottom: 5px;
    left: 5px;
    opacity: .65;
    color: #FFF;
    font-size: 14px;
    text-shadow: initial;
  }
}

/*
.section-layout-title .background-type-webmap {
  height: initial !important;
}

.section-layout-title .map {
  position: absolute !important;
  top: -50vh;
  bottom: -50vh;
  height: inherit !important;
}
*/

/*
 * Spacing rules before/after Title and Immersive
 */

/*
.section-layout-title + .section-layout-title {
  margin-top: 50px;
}

.section-immersive + .section-layout-title {
  margin-top: 50px;
}

.section-layout-title + .section-immersive {
  margin-top: 50px;
}
*/

body.mobile-view .fg-title {
  font-size: 34px !important;
  line-height: 38px !important;
}
