section.provide
  @include spaceSection
  // background: linear-gradient(0deg, rgba(157, 157, 157, 1) 0%, rgba(255, 255, 255, 1) 100%)
  background-position: center
  background-repeat: no-repeat
  background-size: cover
  // @media (min-width: 768px)
  //   padding: 10% 0 35%
  // @media (min-width: 1024px)
  //   padding: 8% 0 30%
  // @media (min-width: 1280px)
  //   padding: 6% 0 30%
  // @media (min-width: 1600px)
  //   padding: 5% 0 25%
  .container
    align-items: center
    @media (min-width: 768px)
      align-items: flex-start
    @media (min-width: 1280px)
      width: 70%
      // align-items: center
    @media (min-width: 1900px)
      width: 65%
    h1, h3, p
      color: $white
      width: 100%
    h3
      font-size: 16px
    h1, h3
      //text-transform: uppercase
      text-align: left
      margin-bottom: 1rem
      @media (min-width: 768px)
        width: 100%
      @media (min-width: 1024px)
        width: 45%
        font-size: 18px
      @media (min-width: 1280px)
        width: 55%
        // margin: .5rem 0 4rem
    h1, h1 span
      @media (min-width: 1024px)
        font-size: 26px
      @media (min-width: 1440px)
        font-size: 28px
      @media (min-width: 1600px)
        font-size: 30px
    p
      @media (min-width: 1024px)
        width: 70%
      @media (min-width: 1440px)
        width: 60%
  .container .itemList
    width: 100%
    gap: 1.5rem 0
    margin: 2rem 0
    @media (min-width: 768px)
      flex-direction: row
      justify-content: center
      flex-wrap: wrap
      gap: 2rem
      align-items: stretch
    @media (min-width: 1440px)
      gap: 3rem
    .item
      background-color: $backColor
      border-radius: 25px
      padding: 1rem
      gap: 0 8%
      align-items: center
      img
        width: 40%
        object-fit: cover
        // max-width: 121px
        border-radius: 20px
        @media(min-width: 768px)
          width: 100%
      a
        width: 60%
        gap: 1rem 0
        span
          font-size: 15px
          // height: 3em
          color: $textColor
          font-weight: 700
          //text-transform: uppercase
      @media (min-width: 768px)
        width: calc( 50% -  1rem)
        flex-direction: column
        gap: 1rem 0
        a 
          width: 100%
          flex-direction: row
          align-items: center
          justify-content: space-between
          gap: 0 1rem
          padding: 0 5px
          span
            font-size: 15px
      @media (min-width: 1024px)
        width: 30%
        padding: 1.2rem
        a span
          font-size: 17px
      @media (min-width: 1280px)
        transition: all .6s ease
        // width: 320px
        a
          gap: 0 3rem
          svg
            width: 33px!important
            height: auto
        &:hover
          transform: scale(1.04)
          a span
            color: $yellow
          a svg path
            fill: $yellow
      @media (min-width: 1440px)
        a span
          font-size: 18px