/**
 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.
 */
.path-frontpage .layout-container {
  position: relative;
}
.path-frontpage .layout-container header#header {
  position: absolute;
  z-index: 1;
  top: 0;
  background-color: transparent;
}

.node--type-home header {
  padding: 60px 0px;
  overflow: hidden;
  background-image: url("/themes/custom/elaba/images/Vector.png");
  background-repeat: no-repeat;
  margin-bottom: 50px;
  padding-top: 120px;
}
@media (min-width: 992px) {
  .node--type-home header {
    padding: 120px 0px;
    padding-top: 240px;
  }
}
@media (min-width: 1200px) {
  .node--type-home header {
    margin-bottom: 100px;
  }
}
.node--type-home header .header__content {
  grid-column: 1/-1;
}
@media (min-width: 992px) {
  .node--type-home header .field--name-field-homelinks > .field__items {
    display: grid;
  }
}
.node--type-home header .field--name-field-homelinks > .field__items > .field__item:nth-of-type(1) {
  text-align: left;
}
@media (min-width: 992px) {
  .node--type-home header .field--name-field-homelinks > .field__items > .field__item:nth-of-type(1) {
    grid-row: 1;
  }
}
.node--type-home header .field--name-field-homelinks > .field__items > .field__item:nth-of-type(1) .field--name-field-date {
  background-color: var(--accent1);
}
@media (min-width: 992px) {
  .node--type-home header .field--name-field-homelinks > .field__items > .field__item:nth-of-type(1) .paragraph--type--homelink {
    margin-right: 20%;
    margin-left: -20%;
  }
}
.node--type-home header .field--name-field-homelinks > .field__items > .field__item:nth-of-type(1) .paragraph--type--homelink .lower-content {
  bottom: 35px;
}
@media (min-width: 992px) {
  .node--type-home header .field--name-field-homelinks > .field__items > .field__item:nth-of-type(1) .paragraph--type--homelink .lower-content {
    bottom: 55px;
    right: -30%;
    left: auto;
  }
}
.node--type-home header .field--name-field-homelinks > .field__items > .field__item:nth-of-type(2) {
  text-align: right;
  margin-left: auto;
}
@media (min-width: 992px) {
  .node--type-home header .field--name-field-homelinks > .field__items > .field__item:nth-of-type(2) {
    grid-row: 1/3;
    margin-top: 25%;
  }
}
@media (min-width: 992px) {
  .node--type-home header .field--name-field-homelinks > .field__items > .field__item:nth-of-type(2) .paragraph--type--homelink {
    margin-right: -35%;
    margin-left: 35%;
  }
}
.node--type-home header .field--name-field-homelinks > .field__items > .field__item:nth-of-type(2) .paragraph--type--homelink .lower-content {
  left: -45%;
  right: auto;
  bottom: 35px;
}
@media (min-width: 992px) {
  .node--type-home header .field--name-field-homelinks > .field__items > .field__item:nth-of-type(2) .paragraph--type--homelink .lower-content {
    bottom: 55px;
  }
}
@media (min-width: 992px) {
  .node--type-home header .field--name-field-homelinks > .field__items > .field__item:nth-of-type(2) .paragraph--type--homelink .field--name-field-media {
    transform: rotate(-3.6deg);
  }
}
.node--type-home header .field--name-field-homelinks > .field__items > .field__item:nth-of-type(2) .field--name-field-date {
  background-color: var(--accent2);
}
.node--type-home header .field--name-field-homelinks > .field__items > .field__item:nth-of-type(3) {
  text-align: left;
  margin-top: 35px;
}
@media (min-width: 992px) {
  .node--type-home header .field--name-field-homelinks > .field__items > .field__item:nth-of-type(3) {
    grid-row: 2;
    margin-top: 70px;
  }
}
@media (min-width: 992px) {
  .node--type-home header .field--name-field-homelinks > .field__items > .field__item:nth-of-type(3) .paragraph--type--homelink {
    margin-right: 35%;
    margin-left: -35%;
  }
}
.node--type-home header .field--name-field-homelinks > .field__items > .field__item:nth-of-type(3) .paragraph--type--homelink .lower-content {
  right: -35%;
  left: auto;
  bottom: 35px;
}
@media (min-width: 992px) {
  .node--type-home header .field--name-field-homelinks > .field__items > .field__item:nth-of-type(3) .paragraph--type--homelink .lower-content {
    bottom: 55px;
  }
}
@media (min-width: 992px) {
  .node--type-home header .field--name-field-homelinks > .field__items > .field__item:nth-of-type(3) .paragraph--type--homelink .field--name-field-media {
    transform: rotate(1.8deg);
    margin-top: 45px;
  }
}
.node--type-home header .field--name-field-homelinks > .field__items > .field__item:nth-of-type(3) .field--name-field-date {
  background-color: var(--accent3);
}
.node--type-home header .paragraph--type--homelink {
  position: relative;
}
@media (min-width: 992px) {
  .node--type-home header .paragraph--type--homelink .field--name-field-media {
    transform: rotate(-3.6deg);
  }
}
.node--type-home header .paragraph--type--homelink .lower-content {
  position: absolute;
  height: -moz-fit-content;
  height: fit-content;
  top: auto;
  bottom: 0;
  left: auto;
  right: 0;
  margin: auto;
  z-index: 20;
}
.node--type-home header .paragraph--type--homelink h2 {
  display: block;
  margin-bottom: 8px;
}
.node--type-home header .paragraph--type--homelink .field--name-field-date {
  font-style: normal;
  font-weight: 600;
  font-size: 22px;
  line-height: 27px;
  background-color: var(--accent1);
  display: inline-block;
  padding: 10px 20px;
  border-radius: 120px;
}
