section#entete.article {
  margin-top: 90px;
  height: 60vh;
  min-height: 400px;
  max-height: 600px;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center; }
  section#entete.article:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.25);
    z-index: 2; }
  section#entete.article img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    z-index: 1; }
  section#entete.article div.txt {
    text-align: center;
    color: #fff;
    position: relative;
    z-index: 3; }
    section#entete.article div.txt h1 {
      color: #fff;
      text-transform: uppercase; }

section#content-article {
  margin-top: 65px; }
  section#content-article div.container div.ranger {
    margin-left: -25px;
    margin-right: -25px;
    width: calc(100% + 50px); }
    section#content-article div.container div.ranger div.aside {
      width: 380px;
      padding: 0 25px; }
      section#content-article div.container div.ranger div.aside h3 {
        color: #000;
        font-size: 24px; }
      section#content-article div.container div.ranger div.aside img {
        display: block;
        margin-top: 30px; }
    section#content-article div.container div.ranger div.content {
      width: calc(100% - 380px);
      padding: 0 25px; }

section#blog {
  margin-top: 140px;
  margin-bottom: 65px; }
  section#blog h1 {
    text-align: center;
    text-transform: uppercase; }
  section#blog div.ranger {
    margin-top: 40px;
    width: calc(100% + 50px);
    margin-left: -25px;
    margin-right: -25px; }
    section#blog div.ranger div.colonne {
      width: 33.333%;
      padding: 0 25px;
      margin-bottom: 50px; }
      section#blog div.ranger div.colonne div.tuile {
        border-radius: 6px;
        background-color: #fff;
        overflow: hidden;
        height: 100%;
        display: flex;
        justify-content: space-between;
        flex-direction: column;
        box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.05); }
        section#blog div.ranger div.colonne div.tuile img {
          width: 100%;
          height: 200px;
          object-fit: cover;
          object-position: center; }
        section#blog div.ranger div.colonne div.tuile h4 {
          font-size: 20px;
          margin: 0;
          color: #905a36; }
        section#blog div.ranger div.colonne div.tuile p {
          color: #000; }
        section#blog div.ranger div.colonne div.tuile button {
          background-color: #905a36; }
          section#blog div.ranger div.colonne div.tuile button:hover {
            background-color: #C9B179; }
        section#blog div.ranger div.colonne div.tuile .txt {
          padding: 25px 25px 0; }
        section#blog div.ranger div.colonne div.tuile .button {
          padding: 0 25px 25px; }

.navigation-post {
  display: flex;
  justify-content: space-between;
  margin: 100px 0 100px;
  gap: 20px; }
  .navigation-post a:hover {
    color: #C9B179; }
  .navigation-post a {
    font-weight: 600; }

.nav-links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
  font-weight: 600; }

@media (max-width: 1023px) {
  section#content-article div.container div.ranger div.aside {
    width: 100%;
    order: 2; }

  section#content-article div.container div.ranger div.content {
    width: 100%;
    order: 1; }

  section#entete.article {
    margin-top: 59px; }

  section#blog div.ranger div.colonne {
    width: 50%; } }
@media (max-width: 767px) {
  section#blog div.ranger div.colonne {
    width: 100%; }

  .navigation-post {
    flex-wrap: wrap; }
    .navigation-post .prev-post, .navigation-post .next-post {
      width: 100%;
      margin-bottom: 30px; }
      .navigation-post .prev-post a, .navigation-post .next-post a {
        display: block; }
    .navigation-post .next-post a {
      text-align: right; } }

/*# sourceMappingURL=article.css.map */