@icon-size-default: 3em;
@icon-size-large: 4em;

.cta {
  position: relative;

  &:before {
    display: block;
    position: absolute;
    width: 1em;
    height: 1em;
    line-height: 1;
    font-size: @icon-size-default;
    &:extend(.icon:before);
  }
}

.cta--big {
  margin-left: auto;
  margin-right: auto;
  @media screen and (min-width: @screen-md) {
    max-width: 90%;
  }
  @media screen and (min-width: @screen-lg) {
    max-width: 80%;
  }

  @cta-padding-left: 10%;
  @cta-padding-right: 20%;

  padding-left: @cta-padding-left;
  padding-right: @cta-padding-right;

  .btn {
    @media screen and (min-width: @grid-float-breakpoint) {
      position: absolute;
      top: 50%;
      transform: translateY(-51%);
      left: floor(100% - @cta-padding-right);
      min-width: floor(@cta-padding-right*0.66);
    }
  }

  &:before {
    right: floor(100% - @cta-padding-left);
    color: @brand-primary
  }

}

.cta--center {
  &, & * {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
  }
}

.cta--small {

  padding-left: @icon-size-default * 1.25;
  padding-right: 0;

  &:before {
    left: 0;
  }
}

.cta-finder:before {
  &:extend(.icon-direction:before);
}

.cta-netzwerk:before {
  &:extend(.icon-user-follow:before);
}

.cta-erklaerung:before,
.cta-informationen:before {
  &:extend(.icon-info:before);
}

.cta-seragwiessner {
  .sw-logo {
    margin: 0 auto;
    width: 250px;
    margin-bottom: 1em;
  }
}