.gl.tabs
  display flex
  flex-direction column
  width 100%

  > .head
    align-items center
    display flex
    justify-content center
    text-align center

    > .title
      background $color-grey-darkest
      color #fff
      cursor pointer
      flex 1 0 auto
      font-size 1.3em
      font-weight 700
      padding 1em
      position relative

      &:hover
        background darken($color-grey-darkest, 20%)

      &.active
        background $color-primary

        &::after
          border-left 10px solid transparent
          border-right @border-left
          border-top 10px solid $color-primary
          bottom -10px
          content ''
          height 0
          left calc(50% - 5px)
          position absolute
          width 0

      @media(max-width: $media-small)
        font-size 1.1em

  &.hash

    > .body

      > .content
        display none

        &.active
          display block