@media screen and (width >= 1001px) {
  body.accueil #question {
    font-size: 36px;
  }

  body.accueil main section#mon-offre {
    display: block;
  }

  body.accueil main section#mon-offre div {
    max-width: 1200px;
    margin: 3em auto;
  }

  body.accueil main section#mon-offre div h3 {
    font-size: 28px;
    padding: 10px;
  }

  body.accueil main section#mon-offre div h3, body.accueil main section#mon-offre div p, body.accueil main section#mon-offre div div {
    width: 48%;
  }

  body.accueil main section#mon-offre div p a.plus svg .cercle-plus {
    stroke-width: 8px;
  }

  body.accueil main section#mon-offre div.crea {
    background: top right url("fond-bloc-crea.webp") no-repeat;
    background-size: 40%;
    background-position: 90% 40px;
    animation: glisse-droite 1s;
    animation-play-state: paused;
  }

  body.accueil main section#mon-offre div.crea h3, body.accueil main section#mon-offre div.crea p {
    border-bottom: solid #5bae3d;
    box-shadow: 10px 10px 10px #4446;
  }

  body.accueil main section#mon-offre div.maintenance {
    background: top left url("computer-code.jpg") no-repeat;
    background-size: 40%;
    background-position: 10% 50px;
    animation: glisse-gauche 1s;
    animation-play-state: paused;
    display: flex;
    flex-direction: column;
  }

  body.accueil main section#mon-offre div.maintenance h3, body.accueil main section#mon-offre div.maintenance p {
    margin-left: auto;
    border-bottom: solid #d0c847;
    box-shadow: -10px 10px 10px #4446;
  }

  body.accueil main section#mon-offre div.perfs {
    background: top right url("perfs.jpg") no-repeat;
    background-size: 40%;
    background-position: 90% 50px;
    animation: glisse-droite 1s;
    animation-play-state: paused;
  }

  body.accueil main section#mon-offre div.perfs h3, body.accueil main section#mon-offre div.perfs p {
    border-bottom: solid #e38851;
    box-shadow: 10px 10px 10px #4446;
  }

  body.accueil main section#mon-offre div.aussi {
    background: top left url("blender-graph-editor.jpg") no-repeat;
    background-size: 40%;
    background-position: 10% 50px;
    animation: glisse-gauche 1s;
    animation-play-state: paused;
    display: flex;
    flex-direction: column;
  }

  body.accueil main section#mon-offre div.aussi h3, body.accueil main section#mon-offre div.aussi div {
    margin-left: auto;
    border-bottom: solid #666091;
    box-shadow: -10px 10px 10px #4446;
  }
}

@keyframes glisse-droite {
  0% {
    background-position-x: 0;
  }

  100% {
    background-position-x: 90%;
  }
}

@keyframes glisse-gauche {
  0% {
    background-position-x: 100%;
  }

  100% {
    background-position-x: 10%;
  }
}