.wrapper {

@extend %wrapper;

}

.site {

display: flex;
flex-flow: column nowrap;
min-height: 100vh;

.site-content {
  flex: 1 1 auto;
  display: flex;
  flex-flow: column nowrap;
  justify-content: center;
}

}

/*

Site Header

*/ .site-header {

position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 2;
-webkit-backdrop-filter: saturate(180%) blur($spacing-unit);
backdrop-filter: saturate(180%) blur($spacing-unit);
padding-top: $spacing-unit;
padding-bottom: $spacing-unit;

.wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;

  a {
    text-decoration: none;
    color: currentColor;

    &:hover,
    &:focus {
      color: $color-accent;
    }
  }

  .site-title {
    font-weight: 600;
    letter-spacing: 0.15em;
    margin-bottom: 0;

    &:last-child {
      margin-left: auto;
      margin-right: auto;
    }
  }

  .site-menu {
    margin-left: auto;

    #main-menu-trigger,
    .menu-trigger {
      display: none;
    }

    .menu-trigger {
      @include media-query($on-palm) {
        display: block;
      }

      .svg-icon {
        vertical-align: middle;
        fill: currentColor;
        transition: fill 250ms ease;

        &:hover,
        &:focus {
          fill: $color-accent; 
        }
      }
    }

    #main-menu-trigger:checked + .menu-trigger {
      .svg-icon {
        fill: $color-accent;
      }
    }

    .main-menu {
      display: inline-flex;
      list-style: none;
      font-weight: normal;
      @include relative-font-size(0.85);
      margin-left: 0;

      @include media-query($on-palm) {
        display: block;
        background: $color-background;
        -webkit-backdrop-filter: saturate(180%) blur($spacing-unit);
        backdrop-filter: saturate(180%) blur($spacing-unit);
        position: absolute;
        top: calc(#{100%} + #{$spacing-unit});
        left: 0;
        right: 0;
        z-index: 3;
        padding: $spacing-unit $spacing-unit / 2;
        opacity: 0;
        visibility: hidden;
        transition-property: opacity, visibility;
        transition-duration: 250ms;
        transition-timing-function: ease;

        .menu-item {
          text-align: center;

          a {
            display: block;

            &:hover,
            &:focus {
              color: $color-accent;
            }
          }
        }
      }

      .menu-item:not(:last-child) {
        margin-right: $spacing-unit;

        @include media-query($on-palm) {
          margin-right: 0;
          margin-bottom: $spacing-unit / 2;
        }
      }
    }

    #main-menu-trigger:checked ~ .main-menu {
      opacity: 1;
      visibility: visible;
    }
  }
}

}

/*

Site Content

*/ .site-content { // -webkit-backdrop-filter: saturate(180%) blur($spacing-unit); // backdrop-filter: saturate(180%) blur($spacing-unit);

color: $color-text;
padding-top: $spacing-unit;
padding-bottom: $spacing-unit;

}

.content {

.content-header {
  margin-bottom: $spacing-unit;

  .content-title {
    text-align: center;
  }

  &::after {
    display: block;
    content: " ";
    width: 50px;
    height: 4px;
    border-radius: 2px;
    background-color: $color-accent;
    margin: $spacing-unit / 2 auto $spacing-unit * 2;
  }
}

}

.page-home {

.content-body {
  ul {
    margin-top: $spacing-unit * 2;
    margin-bottom: $spacing-unit * 2;
    list-style: none;
    font-weight: 600;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    @include relative-font-size(1.25);

    @include media-query($on-palm) {
      @include relative-font-size(1.125);
    }

    li {
      margin-bottom: $spacing-unit;

      a {
        color: currentColor;

        &:hover,
        &:focus {
          color: $color-accent;
          text-decoration: none;
        }
      }
    }
  }
}

}

.contact {

.content-body {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;

  .contact-infos {
    flex: 0 1 300px;
    margin-bottom: $spacing-unit;
    margin-right: $spacing-unit * 2;
  }

  .contact-form {
    flex: 1 1 300px;
  }
}

}

.partners-list {

list-style: none;
margin-left: 0;
display: flex;
flex-flow: row wrap;
justify-content: center;
align-items: center;

li {
  padding: $spacing-unit / 2;

  img {
    max-width: 150px;
  }
}

}

.info-links {

list-style: none;
display: flex;
flex-flow: row wrap;
justify-content: space-evenly;
align-items: center;
margin-left: 0;
font-weight: 700;

li {
  padding: $spacing-unit / 4;

  a {
    display: inline-block;
    padding: $spacing-unit / 4 $spacing-unit / 2;
    border-radius: 6px;
    background: $color-details;
    border: 2px solid $color-details;
  }
}

}

/*

Site Footer

*/ .site-footer {

.wrapper {
  padding-top: $spacing-unit;
  padding-bottom: $spacing-unit;
  border-top: 1px solid $color-details;
}

.disclaimer {
  @include relative-font-size(0.75);

  img {
    float: left;
    max-width: 150px;
    padding: 0 $spacing-unit / 2 $spacing-unit / 2 0;
  }
}

}