.page-header
  align-items: center
  background-color: get-color(rumba)
  background-position: center
  background-size: cover
  display: flex
  overflow: hidden
  position: relative
  width: 100%

  &__image
    display: none
    min-height: 100%
    min-width: 100%
    position: absolute
    text-indent: -9999px

  &__content
    padding: 0 30px 8px
    position: relative
    width: 100%

  &__title
    color: get-color(gafieira)
    font-size: 24px
    font-weight: 700
    line-height: 31px
    width: 100%

    small
      color: get-color(rock)
      display: block
      font-size: 20px
      font-weight: 100
      margin-top: 5px

    &--small
      small
        font-size: 18px

  &__call
    display: block
    position: absolute
    right: 30px
    top: 0

  &--home
    .page-header__content
      margin: 0
      padding-bottom: 0
      text-align: center
      width: 100%

    .page-header__title
      line-height: normal

  &--inner-page
    background-color: get-color(rock)
    height: 345px

    .page-header__image
      display: block
      left: 0
      position: absolute
      top: 0
      width: 100%

  +grid-media($breakpoint-medium)
    &__image
      display: block

    &--home
      background-color: get-color(rock)
      height: 400px

      .page-header__content
        padding: 0
        position: absolute

      .page-header__title
        color: get-color(air)
        font-size: 64px

        small
          color: get-color((color: air, opacity: .8))
          font-size: 48px
          margin-top: 15px

  +grid-media($breakpoint-normal)
    &__title
      font-size: 48px
      line-height: normal

      &--small
        font-size: 24px

    &__call
      top: 15px

    &__content
      padding-bottom: 0
      text-align: center
