.page__detail {
  /*padding-bottom: 2rem;*/
  color: var(--color-text-content);
  margin-top: var(--padding-size-max);
}

.page__detail a {
  color: var(--color-text-content);
}

.page__detail-done {
  margin-bottom: var(--padding-size);
}

.page__detail-link {
  display: flex;
  margin-bottom: .4rem;
}

.page__detail-user-informations {
  margin: auto 0;
}

.page__detail-wrapper {
  position: relative;
  display: flex;
  margin-bottom: 2rem;
  flex-wrap: wrap;
}

/*.page__detail-wrapper:after {*/
/*  border-top: solid 1px var(--color-separator-secondary);*/
/*  content: " ";*/
/*  display: flex;*/
/*  width: 16.875rem;*/
/*  margin-top: var(--padding-size-max);*/
/*}*/

.page__detail-illustration {
  width: 100%;
}

.page__detail-illustration picture {
  display: flex;
}

.page__detail-illustration img {
  border-radius: .5rem;
  object-fit: cover;
  object-position: center;
  width: 100%;
  height: 17.5rem;
}

.page__detail-illustration .no-picture {
  display: flex;
  max-width: 40rem;
  width: calc(100vw - 2 * var(--padding-size-min));
  height: 17.5rem;
  justify-content: center;
  align-items: center;
  border-radius: .5rem;
  background: var(--color-background-form-element-primary);
}

.page__detail-illustration .no-picture span {
  font-size: 4rem;
  color: white;
}

.page__detail-header-description {
  margin-bottom: var(--padding-size-max);
}

.page__detail-information {
  display: flex;
  flex-direction: column;
  font-size: .9rem;
  min-height: 12rem;
}

.page__detail-information:before, .page__detail-information:after, .page__detail-contact:after, .page__annonce-user-info:after {
  border-top: solid 1px var(--color-separator-secondary);
  content: " ";
  display: flex;
  width: 16.875rem;
}

.page__detail-information:before {
  margin-bottom: var(--padding-size-max);
}

.page__detail-information:after {
  margin-top: var(--padding-size-max);
}

.page__detail-contact:after, .page__annonce-user-info:after {
  margin-top: var(--padding-size-max);
  margin-bottom: var(--padding-size-max);
}

.page__detail-information ul {
  margin-bottom: auto;
}

.page__detail-information ul li {
  margin-bottom: .2rem;
}

.page__detail-information ul li a {
  text-decoration: none;
}

.page__detail-information-low {
  font-weight: bold;
}

.page__detail-header {
  margin-top: var(--padding-size-max);
  flex: 0 0 100%;
}

.page__detail-header h1 {
  font-weight: 600;
  font-size: 1.25rem;
  line-height: 1.375rem;
  color: var(--color-detail-title);
}

.page__detail-header h1:after {
  border: none;
  margin-top: inherit;
}

.page__detail-contact-link {
  margin: var(--padding-size) 0;
  text-decoration: none;
}

.page__detail-contact-link:hover {
  text-decoration: underline;
}

.page__detail-depot {
  text-decoration: none;
}

.page__detail-depot:hover {
  text-decoration: underline;
}

.page__detail-login {
  margin-top: var(--padding-size-min);
  padding: .75rem;
  text-align: center;
  text-decoration: none;
  border-radius: .4rem;
  color: var(--color-cta-text) !important;
  background: var(--color-cta-background-primary);
  justify-content: center;
}

.page__detail-login:before {
  content: '\f086';
  margin-right: .4rem;
}

.page__detail-autre {
  margin-bottom: 2rem;
}

.page__detail-autre a {
  color: var(--color-text-secondary);
}

.page__detail-autre > a {
  display: block;
  margin-top: .4rem;
}

.page__detail-title {
  color: var(--color-text-primary);
  font-weight: 700;
  margin-bottom: 1rem;
}

.page__annonce-user-info-title {
  color: var(--color-text-primary);
  font-weight: 700;
  margin-bottom: 1rem;
}

.page__detail-user-action {
  margin-bottom: var(--padding-size);
  display: flex;
  flex-direction: column;
  align-self: end;
}

.page__detail-user-action > a {
  margin-bottom: var(--padding-size-min);
  padding: .75rem;
  background: var(--color-background-primary);
  color: var(--color-text-button);
  border-radius: .5rem;
  border: none;
  outline: none;
  cursor: pointer;
  text-decoration: none;
  text-align: center;
}

.page__detail-user-action a:hover {
  text-decoration: underline;
}

.page__detail-button_no_action {
  margin-top: var(--padding-size-min);
  padding: .75rem;
  background: var(--color-background-primary);
  color: var(--color-text-button);
  border-radius: .5rem;
  border: none;
  outline: none;
  font-size: .9rem;
}

@media screen and (min-width: 768px) {
  .page__detail-illustration {
    width: inherit;
  }

  .page__detail-wrapper {
    flex-flow: column wrap;
  }

  .page__detail-information:before {
    margin-bottom: var(--padding-size-min);
  }

  .page__detail-information:after {
    margin-top: var(--padding-size-min);
  }

  .page__detail-contact:after {
    margin-top: var(--padding-size-max);
    margin-bottom: var(--padding-size-max);
  }

  .page__detail:after {
    border-top: solid 1px var(--color-separator-secondary);
    content: " ";
    display: flex;
    width: 16.875rem;
    margin-bottom: var(--padding-size-max);
  }

  .page__detail-wrapper {
    margin-bottom: inherit;
  }

  .page__detail-user-action > a {
    max-width: 20rem;
  }

  .page__detail-header-description {
    max-width: 45rem;
  }

  .page__detail-login {
    margin-top: inherit;
  }

  .page__detail-illustration img {
    height: 23.75rem;
    margin-right: 2.5rem;
    width: 25.2rem;
  }

  .page__detail-information {
    position: absolute;
    max-width: 20rem;
    left: inherit;
    right: 0;
    height: 23.75rem;
  }

  .page__detail-illustration .no-picture {
    width: 25.2rem;
    height: 23.75rem;
  }
}

@media screen and (min-width: 840px) {
  .page__detail-login {
    margin-top: inherit;
  }

  .page__detail-illustration img {
    height: 23.75rem;
    margin-right: 2.5rem;
  }

  .page__detail-information {
    position: absolute;
    max-width: 20rem;
    left: inherit;
    right: 0;
    height: 23.75rem;
  }

  .page__detail-illustration .no-picture {
    width: 31.4rem;
    height: 23.75rem;
  }
}

@media screen and (min-width: 913px) {
  .page__detail-login {
    margin-top: inherit;
  }

  .page__detail-illustration img {
    width: 40rem;
    height: 23.75rem;
    margin-right: 2.5rem;
  }

  .page__detail-illustration .no-picture {
    width: 40rem;
    height: 23.75rem;
    margin-right: 2.5rem;
  }

  .page__detail-information {
    position: absolute;
    max-width: 20rem;
    left: 42.5rem;
    right: inherit;
    height: 23.75rem;
  }
}
