/*------------------------------------------------------------
BLOCKS CMS
====================================*/

/* Variables Custom */
/**************************************/

// Banner
.block-banner {
  margin-bottom: 50px;
  text-align: center;
  .img-wrapper {
    margin-bottom: 15px;
  }
  .text-wrapper {
    font-size: 16px;
    p {
      margin-bottom: 0;
    }
  }
  .btn {
    margin-top: 15px;
  }
  svg {
    display: none;
  }
}

// Img + text
.block-img-text {
  margin-bottom: 50px;
  text-align: center;
  .img-wrapper {
    margin-bottom: 25px;
  }
  .block-title {
    margin-bottom: 15px;
  }
  .block-subtitle {
    margin-top: -10px;
    margin-bottom: 35px;
  }
  p {
    margin-bottom: 0;
  }
  .btn {
    margin-top: 15px;
  }
}

// Text
.block-text {
  margin-bottom: 50px;
  text-align: center;
  .block-title, .block-subtitle {
    margin-bottom: 15px;
  }
  p:last-of-type {
    margin-bottom: 0;
  }
  .btn {
    margin-top: 15px;
  }
}

/* RESPONSIVE */
/***************************************/
@include media-breakpoint-only(md) {
  // Banners
  .col-md-6 .block-banner {
    .text-wrapper {
      padding: 0 15px;
    }
    .block-title {
      font-size: 3rem;
    }
  }
}
@include media-breakpoint-up(md) {
  // Banner
  .block-banner {
    position: relative;
    .img-wrapper {
      margin-bottom: 0;
    }
    .text-wrapper {
      position: absolute;
      bottom: 30px;
      width: 100%;
      padding: 0 10%;
      z-index: 1;
      font-weight: $font-weight-light;
    }
    .btn {
      margin-top: 20px;
    }

    &.light {
      .text-wrapper, .block-title {
        color: $white;
      }
      svg {
        fill: $white;
      }
      .btn {
        color: $secondary;
        background: $white;
        border-color: $white;
        &.disabled, &:disabled {
          color: $secondary;
          background: $white;
        }
        &:hover {
          color: $secondary;
          background: $white;
          border-color: $light;
        }
      }
    }
  }

  // Img + text
  .block-img-text {
    display: flex;
    & > .row {
      align-items: center;
    }

    .img-wrapper {
      margin-bottom: 0;
    }

    .block-title {
      margin-bottom: 25px;
    }
    .block-subtitle {
      margin-top: -15px;
      margin-bottom: 35px;
    }

    &.left {
      text-align: left;
    }
    &.right {
      text-align: right;
      & > .row {
        flex-direction: row-reverse;
      }
    }
  }

  // Text
  .block-text {
    .block-title, .block-subtitle {
      margin-bottom: 15px;
    }
    .btn {
      margin-top: 20px;
    }
  }
}
@include media-breakpoint-up(lg) {
  // Banner
  .block-banner {
    margin-bottom: 80px;
    .text-wrapper {
      padding: 0 15%;
      font-size: 20px;
      line-height: 26px;
    }
    svg {
      display: block;
      width: 70px;
      height: 70px;
      margin: 0 auto 5px;
    }
  }

  // Img + text
  .block-img-text {
    margin-bottom: 90px;
    .text-wrapper {
      padding: 0 15%;
    }
  }

  // Text
  .block-text {
    margin-bottom: 90px;
    .text-wrapper {
      padding: 0 15%;
    }
  }
}
