@import '../_common'
@import '../../sass/hall-fame/hall-fame'

p
  text-align: justify 
.banner
  &::before
    // background: linear-gradient(360deg, #AFBCFF 0%, #4459C5 100%)
    overflow: hidden
  .bg
    .banner-wrapper
      bottom: 15% !important
      .container-fluid
        .flex
          .colA
            h1
              position: absolute
              left: 50%
              top: 50%
              transform: translate(-50%, -50%)
              z-index: 0
              font-size: 18rem
              width: 100%
              text-align: center
              color: #FFFFFF80

              @include respond-to(screen-1784)
                  font-size: 15rem

              @include respond-to(screen-1536)
                  font-size: 14rem

              @include respond-to(screen-1440)
                  font-size: 13rem

              @include respond-to(screen-1366)
                  font-size: 12rem

              @include respond-to(screen-1152)
                  font-size: 10rem

              @include respond-to(screen-1024)
                  font-size: 10rem

              @include respond-to(screen-991)
                  font-size: 8rem

              @include respond-to(screen-768)
                  top: -12%
                  font-size: 5rem
              @include respond-to(screen-540)
                  top: -12%
                  font-size: 4rem
              @include respond-to(screen-420)
                  font-size: 3rem
              
              span
                margin-left: 160px
                @include respond-to(screen-1784)
                   margin-left: 74px 
                @include respond-to(screen-1300)
                   margin-left: 24px  
                @include respond-to(screen-768)
                   margin-left: 0 

.hall-secA-border
  .container
    .hall-secA
      .filter
        h4
          @include respond-to(screen-540)
            font-size: 13px
          @include respond-to(screen-420)
            font-size: 18px