/**
 * The base file that should be imported by every file.
 * There should be no CSS generation in this or from imported scss files at all!
 */
/**
 * Library
 */
/**
 * Variables and functions
 */
.section-colleagues-story {
  position: relative;
  overflow: hidden; }
  .section-colleagues-story .title-container {
    text-align: center;
    max-width: 650px;
    margin: 0 auto; }
    .section-colleagues-story .title-container h1, .section-colleagues-story .title-container h2, .section-colleagues-story .title-container h3 {
      margin: 0; }
    .section-colleagues-story .title-container .subtitle {
      margin: 22.5px 0 45px; }
  .section-colleagues-story .colleagues {
    display: grid;
    gap: 1em;
    grid-template-columns: 1fr; }
    @media (min-width: 768px) {
      .section-colleagues-story .colleagues {
        grid-template-columns: repeat(2, minmax(0, 1fr)); } }
    @media (min-width: 1300px) {
      .section-colleagues-story .colleagues {
        grid-template-columns: repeat(4, minmax(0, 1fr)); } }
    .section-colleagues-story .colleagues .colleague {
      z-index: 1;
      position: relative;
      padding: 2em;
      background: linear-gradient(180deg, #00FFA0 0%, rgba(1, 255, 161, 0) 100%); }
      .section-colleagues-story .colleagues .colleague .image {
        position: relative;
        z-index: 1; }
        .section-colleagues-story .colleagues .colleague .image .image-container {
          display: flex;
          flex-direction: column;
          align-items: center;
          justify-content: flex-end;
          height: 100%; }
          .section-colleagues-story .colleagues .colleague .image .image-container img {
            margin-top: auto; }
        .section-colleagues-story .colleagues .colleague .image svg {
          position: absolute;
          bottom: 0;
          left: 50%;
          transform: translateX(-50%);
          z-index: -1;
          width: auto; }
        .section-colleagues-story .colleagues .colleague .image.triangle .image-container {
          -webkit-clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
                  clip-path: polygon(50% 0%, 0% 100%, 100% 100%); }
        .section-colleagues-story .colleagues .colleague .image.circle .image-container {
          -webkit-clip-path: circle(50% at 50% 50%);
                  clip-path: circle(50% at 50% 50%); }
        .section-colleagues-story .colleagues .colleague .image.square .image-container {
          -webkit-clip-path: inset(0 0 0 0);
                  clip-path: inset(0 0 0 0); }
        .section-colleagues-story .colleagues .colleague .image.hexagon .image-container {
          -webkit-clip-path: polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%);
                  clip-path: polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%); }
      .section-colleagues-story .colleagues .colleague .image {
        height: 200px; }
        .section-colleagues-story .colleagues .colleague .image .image-container {
          margin: 0 auto;
          width: 100%;
          max-height: 200px;
          max-width: 230px; }
          .section-colleagues-story .colleagues .colleague .image .image-container img {
            max-height: 140px;
            width: auto;
            height: 100%; }
        .section-colleagues-story .colleagues .colleague .image.circle {
          margin-top: -7px; }
          .section-colleagues-story .colleagues .colleague .image.circle .image-container img {
            position: relative;
            bottom: -7px; }
          .section-colleagues-story .colleagues .colleague .image.circle svg {
            bottom: -7px; }
          .section-colleagues-story .colleagues .colleague .image.circle + .content {
            margin-top: calc(90px / 4 + 7px); }
      .section-colleagues-story .colleagues .colleague .content {
        margin-top: 22.5px;
        line-height: 150%;
        font-size: 16px;
        padding-bottom: 30px;
        text-align: center; }
        .section-colleagues-story .colleagues .colleague .content .colleague-info {
          display: flex;
          flex-wrap: wrap;
          justify-content: center;
          font-weight: 800;
          font-family: "JetBrains Mono", Helvetica, Arial, sans-serif;
          text-transform: uppercase;
          line-height: 150%;
          font-size: 16px; }
          .section-colleagues-story .colleagues .colleague .content .colleague-info .name:after {
            content: '|';
            margin: 0 .5em; }
          .section-colleagues-story .colleagues .colleague .content .colleague-info .name a:hover {
            text-decoration: none; }
          .section-colleagues-story .colleagues .colleague .content .colleague-info .function {
            flex-basis: 100%; }
        .section-colleagues-story .colleagues .colleague .content .call-to-action {
          position: absolute;
          z-index: 1;
          bottom: 30px;
          right: 30px;
          transition: transform .3s ease-in-out; }
          .section-colleagues-story .colleagues .colleague .content .call-to-action a {
            font-size: 27px; }
            .section-colleagues-story .colleagues .colleague .content .call-to-action a:hover {
              text-decoration: none; }
      .section-colleagues-story .colleagues .colleague:hover .call-to-action {
        transform: translateX(10px); }
  .section-colleagues-story.gray:before {
    content: '';
    position: absolute;
    inset: 0;
    height: 100%;
    width: 100%;
    background: linear-gradient(180deg, rgba(44, 67, 94, 0.4) 0%, rgba(44, 67, 94, 0) 100%); }
  .section-colleagues-story.gray:after {
    content: '';
    position: absolute;
    inset: 0;
    height: 100%;
    width: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url(/app/themes/nfc-houseofbeta/assets/images/grid-pattern-mobile.png); }
    @media (min-width: 768px) {
      .section-colleagues-story.gray:after {
        background-image: url(/app/themes/nfc-houseofbeta/assets/images/grid-pattern-desktop.png); } }
  .section-colleagues-story.dark .colleague-info .name a {
    color: var(--white); }
  .section-colleagues-story.dark .call-to-action a {
    color: var(--white); }

/*# sourceMappingURL=colleagues-story.css.map */