.floatLeft {
  @include content-img-float(left);
}

.floatRight {
  @include content-img-float(right);
}

.alignCenter {
  @include content-img-align;
}

.alignLeft {
  @include content-img-align(left);
}

.alignRight {
  @include content-img-align(right);
}

.content {
  width: var(--content-width) !important;
  max-width: var(--max-width-content, var(--main-container-max)) !important;
  margin-bottom: var(--margin-bottom-content) !important;
  margin: var(--margin-content) !important;
  padding: var(--padding-conent) !important;
  border: var(--border-content-module);
  background: var(--background-content-module);

  @include min(tablet) {
    margin: var(--margin-content-min-tablet) !important;
    padding: var(--padding-content-min-tablet) !important;
    margin-bottom: var(--margin-bottom-content-tablet);
  }

  @include min-max(tablet, tablet) {
    padding: var(--padding-content-tablet, var(--padding-content-min-tablet)) !important;
  }

  a {
    text-decoration: var(--a-tagcontent-decoration, auto);
    display: var(--a-tag-content);
    font-size: var(--a-tag-content-size, var(--text-size));
    font-weight: var(--a-tag-content-weight);
    line-height: var(--a-tag-content-line-height);
    color: var(--a-tag-color, var(--text-link-color));
  }

  p {
    margin-bottom: var(--paragraph-content-margin-bottom);
    @include min(tablet) {
      margin-bottom: var(--paragraph-margin-content-module, 2.4rem);
    }
  }

  p:first-of-type {
    margin-bottom: var(--paragraph-content-first-margin-bottom, 2.4rem) !important;
  }

  p:last-of-type {
    margin-bottom: var(--paragraph-content-last-margin-bottom);
  }

  img {
    border-radius: var(--content-images-border-radius);
    @include max(mobile) {
      width: 100% !important;
    }
  }
}

.showMoreButton {
  color: var(--content-show-more-button-color, blue);
  display: var(--content-show-more-button-display, flex);
  width: var(--show-more-button-width, 100%);
  font-weight: var(--show-more-button-font-weight);
  justify-content: var(--show-more-content-justify-content);
  max-width: var(--max-width-content, var(--main-container-max)) !important;
  margin: 0 auto;
  padding: var(--show-more-button-padding-mobile) !important;
  text-decoration: var(--show-more-button-text-decoration, none);
  

  &::after {
    display: var(--show-more-button-arrow-display, none);
    @include arrow(var(--show-more-button-arrow-color), 1rem, down, false);
    margin-left: var(--show-more-button-arrow-margin-left, 1rem);
  }

  @include min(tablet) {
    justify-content: var(--show-more-button-arrow-justify-content-tablet, start);
    padding: var(--show-more-button-padding-tablet) !important;
  }

  @include min(laptop) {
    padding: var(--show-more-button-padding-laptop, 0 2.4rem) !important;
  }
}

.homepageFirstModuleContent {
  color: var(--firstModuleContent-color) !important;
  position: var(--firstModuleContent-position);

  p {
    color: var(--firstModuleContent-paragraph-color) !important;
  }

  blockquote {
    color: var(--firstModuleContent-blockquote-color) !important;
  }
}

.showMoreTwoButton {
  display: flex;
  justify-content: space-between;
  align-items: center;
  text-align: start;
  padding: var(--showMoreButton-padding, 1.6rem 2.4rem )!important;
  background: var(--contentCollapsible-button-bg, #fafafa);
  border-radius: 0.8rem;
  width: 100%;
  font-size: var(--contentCollapsible-button-size, 1.6rem);
  font-weight: var(--contentCollapsible-button-weight, 700);
  line-height: var(--contentCollapsible-button-lineHeight, 2.7rem);
  color: var(--contentCollapsible-button-color, #3c3c40);
  border-radius: 0.8rem;
  margin: 0 auto;
  max-width: var(--showMoreTwoButton-max-width-mobile, 100%) !important;
  box-sizing: var(--show-more-button-box-sizing, border-box);
  @include min(tablet) {
      max-width: calc(var(--max-width-content, var(--main-container-max)) - 3.2rem) !important;
  }
  > svg {
    flex: none;
    width: 3.2rem;
    height: 3.2rem;
    transform: rotate(0deg);
    padding: 6px;
  }
}

.showMoreTwoButtonOpen {
  border-radius: 8px 8px 0px 0px;

  > svg {
    transform: rotate(180deg);
  }
}

.contentCollapsibleBox {
  margin: 0 auto;
  max-width: calc(var(--max-width-content, var(--main-container-max)) - 3.2rem) !important;
  background-color: var(--contentCollapsibleBox-bg, #fafafa);
  border-radius: 0px 0px 8px 8px;
  width: auto !important;
  padding-bottom: 1.6rem !important;

  > p {
    font-size: var(--contentCollapsibleBox-size, 1.4rem);
    font-weight: var(--contentCollapsibleBox-weight, 400);
    line-height: var(--contentCollapsibleBox-lineHeight, 2.2rem);
    color: var(--contentCollapsibleBox-color, #515156);
  }
}

.hide {
  display: none;
}

.collapsableContainer {
  max-width: var(--max-width-content, var(--main-container-max)) !important;
}