/**
 SASS files that don't get compiled into CSS. Do not put element selectors in here.
 Every file not starting with '_' should import this file if you want to use functions and mixins.
 */
/**
 * SASS variables
 *
 These are only used in the properties and abstract SASS files.
 */
/**
 Breakpoints and columns
 */
/**
 Text
 */
/**
Fill in the header styles, only write the properties you want to override.
 */
/**
 Form
 */
/**
  Buttons
 */
/**
 Breakpoints

 @param {Keyword} $breakpoint - The breakpoint name of the minimum width. Can be any of the names in the $breakpoint variable
 */
/**
  Custom column size.
  Especially handy inside other columns.

  @param {Number|string} $size - the size in columns or 'expand'/'shrink'.
  @param {number} $total - the total size in columns. Ignored when size is 'expand'/'shrink'
 */
/**
  Custom offset size.
  Especially handy inside other columns.

  @param {Number|string} $size - the size of the offset.
  @param {number} $total - the total size in columns.
  @param {string} - the side from the offset.
 */
.node--type-project.vm-teaser {
  position: relative;
  max-width: 944px;
}
.node--type-project.vm-teaser .sendlink {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 40;
}
.node--type-project.vm-teaser .sendlink:hover + .field--name-field-teaser-media {
  opacity: 0.75;
}
.node--type-project.vm-teaser .field--name-field-teaser-media {
  position: relative;
  z-index: 19;
  transition: var(--transition);
}
.node--type-project.vm-teaser .field--name-field-teaser-media::before {
  content: "";
  background: linear-gradient(180deg, rgba(44, 44, 68, 0.7) 0%, rgba(44, 44, 68, 0) 100%);
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
@media (min-width: 1200px) {
  .node--type-project.vm-teaser .field--name-field-teaser-media::before {
    max-height: 300px;
    height: 50%;
  }
}
.node--type-project.vm-teaser::after {
  content: "";
  background-size: cover;
  background-repeat: no-repeat;
  display: block;
  z-index: 20;
  background-image: url("data:image/svg+xml,%3Csvg width='44' height='44' viewBox='0 0 44 44' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='1.9233e-06' y='44' width='44' height='44' rx='14' transform='rotate(-90 1.9233e-06 44)' fill='%232C2C44'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12.2504 22.0001C12.2504 21.8012 12.3294 21.6104 12.47 21.4698C12.6107 21.3291 12.8015 21.2501 13.0004 21.2501L29.1904 21.2501L22.9704 15.0301C22.8967 14.9614 22.8376 14.8786 22.7966 14.7866C22.7556 14.6946 22.7336 14.5953 22.7318 14.4946C22.73 14.3939 22.7485 14.2939 22.7862 14.2005C22.824 14.1071 22.8801 14.0223 22.9513 13.9511C23.0225 13.8798 23.1074 13.8237 23.2008 13.786C23.2942 13.7482 23.3942 13.7297 23.4949 13.7315C23.5956 13.7333 23.6949 13.7553 23.7869 13.7963C23.8789 13.8373 23.9617 13.8964 24.0304 13.9701L31.5304 21.4701C31.6708 21.6107 31.7497 21.8013 31.7497 22.0001C31.7497 22.1988 31.6708 22.3895 31.5304 22.5301L24.0304 30.0301C23.9617 30.1038 23.8789 30.1629 23.7869 30.2039C23.6949 30.2449 23.5956 30.2669 23.4949 30.2687C23.3942 30.2705 23.2942 30.2519 23.2008 30.2142C23.1074 30.1765 23.0225 30.1203 22.9513 30.0491C22.8801 29.9779 22.824 29.8931 22.7862 29.7997C22.7485 29.7063 22.73 29.6063 22.7318 29.5056C22.7336 29.4049 22.7556 29.3056 22.7966 29.2136C22.8376 29.1216 22.8967 29.0388 22.9704 28.9701L29.1904 22.7501L13.0004 22.7501C12.8015 22.7501 12.6107 22.6711 12.47 22.5304C12.3294 22.3898 12.2504 22.199 12.2504 22.0001Z' fill='%23ECE5DB'/%3E%3C/svg%3E%0A");
  width: 40px;
  height: 40px;
  top: auto;
  bottom: 4px;
  right: 0px;
  left: auto;
  position: absolute;
}
@media (min-width: 992px) {
  .node--type-project.vm-teaser::after {
    background-image: url("data:image/svg+xml,%3Csvg width='52' height='52' viewBox='0 0 52 52' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect y='52' width='52' height='52' rx='16' transform='rotate(-90 0 52)' fill='%23ECE5DB'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16.2503 26.0001C16.2503 25.8012 16.3293 25.6104 16.47 25.4698C16.6106 25.3291 16.8014 25.2501 17.0003 25.2501L33.1903 25.2501L26.9703 19.0301C26.8966 18.9614 26.8375 18.8786 26.7965 18.7866C26.7555 18.6946 26.7335 18.5953 26.7317 18.4946C26.7299 18.3939 26.7485 18.2939 26.7862 18.2005C26.8239 18.1071 26.88 18.0223 26.9513 17.9511C27.0225 17.8798 27.1073 17.8237 27.2007 17.786C27.2941 17.7482 27.3941 17.7297 27.4948 17.7315C27.5955 17.7333 27.6948 17.7553 27.7868 17.7963C27.8788 17.8373 27.9616 17.8964 28.0303 17.9701L35.5303 25.4701C35.6708 25.6107 35.7496 25.8013 35.7496 26.0001C35.7496 26.1988 35.6708 26.3895 35.5303 26.5301L28.0303 34.0301C27.9616 34.1038 27.8788 34.1629 27.7868 34.2039C27.6948 34.2449 27.5955 34.2669 27.4948 34.2687C27.3941 34.2705 27.2941 34.2519 27.2007 34.2142C27.1073 34.1765 27.0225 34.1203 26.9513 34.0491C26.88 33.9779 26.8239 33.8931 26.7862 33.7997C26.7485 33.7063 26.7299 33.6063 26.7317 33.5056C26.7335 33.4049 26.7555 33.3056 26.7965 33.2136C26.8375 33.1216 26.8966 33.0388 26.9703 32.9701L33.1903 26.7501L17.0003 26.7501C16.8014 26.7501 16.6106 26.6711 16.47 26.5304C16.3293 26.3898 16.2503 26.199 16.2503 26.0001Z' fill='%232C2C44'/%3E%3C/svg%3E%0A");
    width: 52px;
    height: 52px;
    top: 40px;
    right: 40px;
  }
}
.node--type-project.vm-teaser h3 {
  margin-top: 25px;
  padding-right: 50px;
}
@media (min-width: 992px) {
  .node--type-project.vm-teaser h3 {
    margin-top: 0px;
    position: absolute;
    top: 40px;
    left: 40px;
    z-index: 20;
    padding-right: 100px;
    color: var(--secondary-color);
  }
}