section.blogHome
  @include spaceSection
  .content
    width: 100%
    display: flex
    flex-direction: column
    @media (min-width: 1024px)
      align-items: center
    h1
      //text-transform: uppercase
      margin-bottom: 1rem
      text-align: center
      @media (min-width: 1024px)
        font-size: 26px
      @media (min-width: 1440px)
        font-size: 28px
      @media (min-width: 1600px)
        font-size: 30px
    p
      padding: 0 7.5%
      width: 100%
      @media (min-width: 768px)
        width: 80%
        text-align: center
        align-self: center
      @media (min-width: 1280px)
        width: 80%
      @media (min-width: 1440px)
        width: 80%
      @media (min-width: 1900px)
        width: 80%
    .seeMore
      background: $yellow
      align-items: center
      padding: 1rem 1.5rem
      gap: 0 .8rem
      border-radius: 30px
      align-self: center
      transition: all .3s ease
      box-shadow: 0px 13px 27px -5px rgba(50,50,93,0.25) , 0px 8px 16px -8px rgba(0,0,0,0.3) , 0px -6px 16px -6px rgba(0,0,0,0.025) 
      span
        color: $textColor
      svg path
        stroke: $textColor
      @media (min-width: 1280px)
        &:hover
          gap: 0 1rem
  .content .listPostHome
    width: 100%
    padding: 1.5rem 0
    @media (min-width: 1024px)
      width: 90%
      padding: 2.5rem 0
      display: flex
      justify-content: space-between
      gap: 0 5%
    @media (min-width: 1280px)
      width: 75%
    // @media (min-width: 1600px)
    //   width: 70%
    @media (min-width: 1366px)
      width: 70%
    @media (min-width: 1900px)
      width: 65%
    .slick-slide
      margin: 1rem!important
    .item
      display: flex!important
      flex-direction: column
      background-color: #F9FAFC
      box-shadow: 0px 4px 6px 0px rgba(50,50,93,0.11) , 0px 1px 3px 0px rgba(0,0,0,0.08) 
      border-radius: 10px
      overflow: hidden
      @media (min-width: 1366px)
        width: 100%
      .thumb, .text
        width: 100%
      .thumb img  
        width: 100%
        object-fit: cover
        height: 250px
      .text
        gap: 10px 0
        padding: 2rem
        a
          color: $black
          font-weight: 700
          height: 4rem
          overflow-y: hidden
          overflow-x: visible
          margin-bottom: 1rem
          @media (min-width: 1280px)
            &:hover
              text-decoration: underline
        span
          font-size: 13px
