/*==========================================================================
  Projects landings page
  ========================================================================== */
.projects
  .styling-icon
    margin: 100px 0 55px
    width: 77px
    margin-left: column(1, 24)
    opacity: 0.1

  .arrow-button.centered
    margin-bottom: 75px

  .invest-row
    margin-top: 100px

    .background
      display: none

    .invest-wrapper
      bottom: 0

  .main-buttons-row
    position: relative
    padding: 100px 0
    //background-image: none
    background: linear-gradient(180deg, white, rgba($lightBlue, 0.4))

    >p
      color: $blue

    .background
      position: absolute
      left: 0
      bottom: 0
      height: 50%
      width: 100%
      opacity: 0.5

      background:
        image: url("/img/backgrounds/sea.jpg")
        size: cover
        repeat: no-repeat
        position: 50% 0%

      +respond-to-width(1750)
        background-image: url("/img/backgrounds/sea@0,75x.jpg")

      +respond-to-width(1200)
        background-image: url("/img/backgrounds/sea@0,5x.jpg")

      +respond-to-width(700)
        background-image: url("/img/backgrounds/sea@0,3x.jpg")