.projects
  padding-top: 40px
  padding-bottom: 72px
  &_flexbox
    padding-top: 25px
    display: flex
    flex-wrap: wrap
    justify-content: space-between
    +md
      justify-content: space-around
  &_item
    flex-basis: 300px
    margin-bottom: 30px
    &_title
      font-size: 16px
      &_wrapp
        display: flex
        justify-content: space-between
        align-items: center
        padding: 17px 13px
        &:hover
         @extend  %hover_opacity
      &_icon
        @extend %circle_addition_element
        +circle(32px)
    small
      display: block
  &_img
    display: block
    width: 100%
    height: auto
    &_wrapp
      position: relative
      border: 5px solid #eeeeee
      z-index: 1
      border-radius: 5px
      &:hover
        .projects_hoverblock
          display: flex
  &_hoverblock
    padding: 13px 10px
    font-size: 12px
    color: white
    background: rgba(0, 0, 0, 0.6)
    position: absolute
    bottom: 0
    left: 0
    width: 100%
    justify-content: space-between
    display: none
    +md
      display: flex
  &_link
    display: inline-block
    margin-left: 16px
    &:hover
       @extend  %hover_opacity
    &_icon
      font-size: 13px
  &_btn
    padding: 8px 28px
    &_wrapp
      text-align: center
      margin: 10px 0
