body {
  margin: 0;
  background: linear-gradient(180deg, rgba(248, 211, 187, 0.5) 0, white 100%);
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  font-family: "Vollkorn", serif;
}

@media screen and (min-width: 1200px) {
  .format-telephone {
    display: none !important;
  }
}
@media screen and (max-width: 1200px) {
  .format-ordinateur {
    display: none !important;
  }
}
main {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex-grow: 1;
  margin-top: 86px;
}
@media screen and (max-width: 1200px) {
  main {
    margin-top: 56.6px;
  }
}
main > *:first-child {
  margin-top: 2em;
}
@media screen and (max-width: 1200px) {
  main > *:first-child {
    margin-top: 60.6px;
  }
}
main > section {
  width: 80%;
}
main > section article {
  background-color: white;
  border-radius: 10px;
  padding: 1em;
  margin: 4em 0;
}

header {
  position: fixed;
  top: 0;
  z-index: 1500;
  width: 100vw;
  background-color: #F4E5D9;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: 1em 0;
}
header section {
  padding-right: 4em;
  background-color: rgba(0, 0, 0, 0);
  display: flex;
  align-items: end;
}
header section a {
  padding: 1em 2em;
  background-color: rgba(0, 0, 0, 0);
}
header section:first-child {
  font-size: 2em;
  padding: 0;
}
header section:first-child a {
  margin: 0;
  padding: 0 1em;
  font-family: sans-serif;
}
header section:first-child a span {
  font-family: unset;
}
header .sous-titre {
  font-size: 0.5em;
}
@media screen and (min-width: 1200px) {
  header .liste-pages img {
    display: none;
  }
  header .liste-pages ul {
    display: flex;
    padding: 0;
    margin: 0;
    background-color: rgba(0, 0, 0, 0);
  }
  header .liste-pages ul li {
    padding: 0;
  }
}
@media screen and (max-width: 1200px) {
  header {
    font-size: 0.8em;
  }
  header .liste-pages ul {
    margin: 0;
    border-radius: 0;
    transition: translate 1s;
    position: absolute;
    right: 0;
    top: 0;
    translate: 100%;
    min-width: 40%;
    max-width: 70%;
  }
  header .liste-pages ul a li {
    color: white;
    font-size: 1.8em;
    font-weight: bold;
    text-align: left;
  }
  header .liste-pages ul {
    background-color: rgba(0, 0, 0, 0.5333333333);
    height: 100vh;
  }
}

footer {
  width: 100vw;
  padding: 20em 0 8em;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #f8d3bb 16em);
  display: flex;
  justify-content: space-evenly;
  flex-wrap: wrap;
}
footer section {
  display: flex;
  flex-direction: column;
  align-items: left;
  max-width: 90%;
}
footer section a, footer section span, footer section p, footer section img {
  text-align: left;
  -webkit-text-decoration: revert;
          text-decoration: revert;
  color: revert;
  padding: 0.5em 0;
  margin: 0;
}
footer section p {
  display: flex;
}
footer section p > span {
  display: inline-block;
  width: 6em;
}
footer section p a {
  display: flex;
  flex-direction: column;
}
footer section p a span {
  padding: 0;
}
footer section .icon {
  margin-right: 0.4em;
}
@media screen and (min-width: 1200px) {
  footer section {
    max-width: 20%;
  }
}
@media screen and (max-width: 1200px) {
  footer section {
    max-width: 71%;
    min-width: 30%;
    flex-grow: 1;
    margin: 0 2em;
  }
  footer section img {
    max-width: 80%;
  }
  footer section:first-child {
    align-items: center;
  }
}

a, button, input[type=submit] {
  font-family: "Vollkorn", serif;
  text-decoration: none;
  color: black;
  background-color: #f8d3bb;
  padding: 0.5em 1em;
  border-radius: 20px;
  border: none;
  font-weight: normal;
  font-size: 1em;
  text-align: center;
  cursor: pointer;
}
a.annuler, button.annuler, input[type=submit].annuler {
  background-color: lightgray;
}
a.grave, button.grave, input[type=submit].grave {
  background-color: salmon;
}
a.retour, button.retour, input[type=submit].retour {
  position: absolute;
  left: 1em;
  padding: 0.5em;
  background-color: rgba(0, 0, 0, 0);
}

textarea, input {
  font-family: "Vollkorn", serif;
}

.choixNote button {
  background-color: rgba(0, 0, 0, 0);
  padding: 0;
}
.choixNote img {
  width: 36px;
}

#accueil {
  background-image: url("../images/fond_accueil.png");
  background-repeat: repeat;
  background-size: 80%;
}
#accueil > section {
  padding-top: 20em;
  padding-bottom: 20em;
}
@media screen and (max-width: 1200px) {
  #accueil > section {
    padding-top: 10em;
    padding-bottom: 10em;
  }
}
#accueil > section:not(.avis) {
  display: flex;
  flex-wrap: wrap;
}
#accueil > section:nth-child(2) {
  justify-content: space-between;
}
#accueil > section:nth-child(2) > * {
  max-width: 100%;
}
@media screen and (min-width: 1200px) {
  #accueil > section:nth-child(2) > * {
    width: 45%;
    font-size: 1.4em;
  }
}
#accueil > .liste-images {
  width: 100%;
  flex-direction: row;
}
#accueil > .liste-images article {
  background-color: rgba(0, 0, 0, 0);
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  overflow-x: hidden;
  scroll-behavior: smooth;
  height: 50em;
}
#accueil > .liste-images section {
  display: flex;
  align-items: center;
  max-width: 100%;
  padding: 0 8em;
}
#accueil > .liste-images section img {
  max-height: 100%;
  max-width: 100vw;
}
#accueil > .liste-images div {
  height: 0;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  width: 100%;
  position: relative;
  top: 416px;
}
#accueil > .liste-images div button {
  margin: 0 5%;
  background-color: rgba(255, 255, 255, 0.3333333333);
  height: 3em;
  width: 3em;
  border-radius: 100%;
  border: 1px solid #ffffff;
}
#accueil > .infos {
  background: 0;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, #f8d3bb 15%, #f8d3bb 85%, rgba(0, 0, 0, 0) 100%);
  width: 100%;
  justify-content: space-evenly;
  padding-right: 0;
  padding-left: 0;
  align-items: center;
}
#accueil > .infos > * {
  border-radius: 20px;
  width: 80%;
}
@media screen and (min-width: 1200px) {
  #accueil > .infos > * {
    width: 30%;
    padding: 2em;
  }
}
#accueil #logo {
  margin: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  width: 100%;
  padding: 0;
  padding-bottom: 12em;
  padding-top: 4em;
  background: rgba(0, 0, 0, 0);
  background: linear-gradient(180deg, rgb(255, 255, 255) 80%, rgba(255, 255, 255, 0) 100%);
}
#accueil #logo img {
  width: 30%;
  font-size: 4em;
  display: flex;
  justify-content: center;
}
#accueil #logo p {
  font-size: 2em;
  margin: 0;
}
@media screen and (max-width: 1200px) {
  #accueil #logo img {
    width: 50%;
    font-size: 2em;
  }
  #accueil #logo {
    padding-top: 8em;
    padding-bottom: 20em;
  }
  #accueil #logo p {
    font-size: 1em;
  }
}
@media screen and (max-width: 1200px) {
  #accueil > *:not(header, footer) {
    flex-direction: column;
  }
}

ul {
  list-style: none;
  padding: 1em;
  background-color: white;
  border-radius: 20px;
}
ul li {
  display: flex;
  justify-content: space-between;
  padding: 1em;
  border-bottom: 1px solid lightgray;
}
ul li:last-child {
  border-bottom: none;
}

input, textarea, select {
  border: none;
  border-radius: 40px;
  background-color: white;
  padding: 0.8em;
}
@media screen and (min-width: 1200px) {
  input, textarea, select {
    min-width: 30em;
  }
}
input[type=number], textarea[type=number], select[type=number] {
  -webkit-appearance: textfield;
     -moz-appearance: textfield;
          appearance: textfield;
  min-width: 4em;
  width: 4em;
  text-align: end;
}
input[type=checkbox], textarea[type=checkbox], select[type=checkbox] {
  min-width: unset;
  height: unset;
}
input[type=file], textarea[type=file], select[type=file] {
  display: none;
}

.image-upload {
  background-color: whitesmoke;
  border-radius: 20px;
  padding: 0.5em 1em;
  cursor: pointer;
}

img {
  -o-object-fit: contain;
     object-fit: contain;
}

textarea {
  resize: none;
  height: 20em;
  border-radius: 10px;
}

form {
  margin-top: 6em;
  display: flex;
  max-width: 80%;
}
form:has(section:first-child:last-child) {
  align-items: center;
}
form section {
  width: 50%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
form section:only-child {
  width: 80%;
}
form section > * {
  margin: 2em;
}
form section h1 {
  margin: 0;
  text-align: center;
}
form section div {
  display: flex;
  flex-direction: column;
}
form section div > div {
  flex-direction: row;
  align-items: center;
}
form section div > div span {
  padding-left: 0.5em;
}
form section > article {
  display: flex;
}
form section > article > div {
  width: 50%;
}
form a:last-child {
  margin-top: 2em;
}
@media screen and (min-width: 1200px) {
  form section + section {
    border-left: 1px gray solid;
  }
  form section {
    padding: 0 4em;
  }
}
@media screen and (max-width: 1200px) {
  form {
    flex-direction: column;
  }
  form section {
    width: 100%;
  }
}

.checkbox {
  flex-direction: row;
}
.checkbox label {
  min-width: 8em;
  padding-right: 2em;
}

.liste-categories {
  flex-direction: column;
}
.liste-categories > div {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-evenly;
}
.liste-categories article {
  margin-bottom: 2em;
  background-color: white;
  border-radius: 20px;
  padding: 1em;
}
.liste-categories article span {
  width: 30px;
  text-align: center;
  display: inline-block;
}
.liste-categories button {
  margin-bottom: 2em;
}
.liste-categories a:not(.retour) {
  border-radius: 0;
  padding: 1em;
  width: 15%;
  height: 160px;
  margin: 2em;
  background-color: white;
  border-radius: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.liste-categories a:not(.retour) p {
  font-size: 1.8em;
  margin: 0;
}
.liste-categories a:not(.retour) article {
  margin: 0;
  padding: 0;
}
.liste-categories a:not(.retour) {
  transition: padding 0.8s ease, margin 0.8s ease;
}
.liste-categories a:not(.retour):hover {
  padding: 2em;
  margin: 1em;
}
@media screen and (max-width: 1200px) {
  .liste-categories a:not(.retour) {
    width: 80%;
  }
}

.liste-produits, .liste-prestations {
  flex-direction: column;
}
.liste-produits article, .liste-prestations article {
  display: flex;
  align-items: center;
}
.liste-produits article img, .liste-prestations article img {
  width: 10%;
  max-height: 10em;
}
.liste-produits article > div:first-of-type, .liste-prestations article > div:first-of-type {
  flex-grow: 1;
  padding-left: 2em;
}
.liste-produits article > div:first-of-type .partie-droite, .liste-prestations article > div:first-of-type .partie-droite {
  display: flex;
  justify-content: end;
  align-items: center;
}
.liste-produits article > div:first-of-type .partie-droite > div, .liste-prestations article > div:first-of-type .partie-droite > div {
  display: flex;
  justify-content: center;
  align-items: center;
}
@media screen and (min-width: 1200px) {
  .liste-produits article > div:first-of-type .partie-droite > *:not(a, button), .liste-prestations article > div:first-of-type .partie-droite > *:not(a, button) {
    min-width: 8em;
    padding: 0 1em;
  }
}
@media screen and (max-width: 1200px) {
  .liste-produits article > div:first-of-type .partie-droite, .liste-prestations article > div:first-of-type .partie-droite {
    align-items: center;
    justify-content: space-around;
    flex-direction: column;
  }
  .liste-produits article > div:first-of-type .partie-droite div, .liste-prestations article > div:first-of-type .partie-droite div {
    display: flex;
  }
}
@media screen and (max-width: 1200px) {
  .liste-produits article > div:first-of-type, .liste-prestations article > div:first-of-type {
    width: 100%;
    padding-left: 0;
  }
  .liste-produits article > div:first-of-type h2, .liste-prestations article > div:first-of-type h2 {
    text-align: center;
  }
}
@media screen and (max-width: 1200px) {
  .liste-produits article, .liste-prestations article {
    flex-direction: column;
  }
  .liste-produits article .description, .liste-prestations article .description {
    display: none;
  }
  .liste-produits article img, .liste-prestations article img {
    width: 100%;
  }
  .liste-produits article .bouton-achat, .liste-prestations article .bouton-achat {
    display: none;
  }
}

.infos-produit {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.infos-produit > img {
  max-width: 100%;
  min-height: 10em;
  display: flex;
  align-items: center;
}

.erreur {
  margin: 0;
  font-size: 0.8em;
  height: 0;
  color: red;
}

.options {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  text-align: center;
  margin: 4em auto;
}
.options a, .options button {
  margin-top: auto;
}
.options > div {
  display: flex;
  flex-direction: column;
}
.options select {
  min-width: unset;
}
.options a, .options div {
  margin-right: 2em;
  margin-left: 2em;
}
.options > * {
  margin: 1em;
}

.recherche {
  display: flex;
  flex-direction: column;
  text-align: center;
  align-items: center;
  margin: 4em 0;
}
.recherche > * {
  width: 80%;
}

#catAdmin article:first-of-type button:first-of-type, #catAdmin article:last-of-type button:nth-of-type(2), #catAdmin article:first-of-type button:nth-last-of-type(3) {
  visibility: hidden;
}

.popup-overlay {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 3083;
  width: 100vw;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
}

.popup-content {
  z-index: 5022;
  background-color: white;
  padding: 2em;
  border-radius: 10px;
  display: flex;
  flex-direction: column;
}
.popup-content > * {
  margin: 0.5em;
}
.popup-content input[type=text], .popup-content textarea {
  border: 1px solid gray;
}
.popup-content > div {
  display: flex;
  flex-direction: column;
  margin: 1em;
}
.popup-content {
  position: absolute;
}
.popup-content .retour {
  top: 0;
  left: 0;
}

.a-propos section {
  width: 50%;
}
.a-propos ul {
  background-color: rgba(0, 0, 0, 0);
  border-radius: 0;
  border-left: 2px solid black;
  padding: 0 0 0 2em;
}
.a-propos li {
  border: none;
  position: relative;
  list-style: none;
  display: flex;
  justify-content: left;
  margin: 1em 0;
}
.a-propos li * {
  min-width: 6em;
  margin: 0;
}
.a-propos li::before {
  background-color: black;
  position: absolute;
  content: "";
  border-radius: 100%;
  width: 16px;
  height: 16px;
  top: 16px;
  left: calc(-8px - 2em - 1px);
}
@media screen and (max-width: 1200px) {
  .a-propos section {
    width: 80%;
  }
  .a-propos * {
    min-width: 2em;
  }
}

#image-produit, #image-prestation {
  flex-direction: column;
  background-color: white;
  border-radius: 10px;
  padding: 1em;
}
#image-produit > div, #image-produit > div > img, #image-prestation > div, #image-prestation > div > img {
  max-width: 100%;
  min-height: 25em;
  display: flex;
  align-items: center;
}

.icon {
  height: 22px;
}

.ajout-qte, .retrait-qte, .qte-panier {
  height: 2em;
  display: flex;
  justify-content: center;
  align-items: center;
}

.qte-panier {
  background-color: whitesmoke;
  padding: 0 1em;
  width: 1em;
}

.ajout-qte, .retrait-qte {
  padding: 0.5em 0.8em;
}

.ajout-qte {
  background-color: greenyellow;
  border-radius: 0 1em 1em 0;
}

.retrait-qte {
  background-color: salmon;
  border-radius: 1em 0 0 1em;
}

.choix-categories div {
  margin-bottom: 1em;
}

.bouton-supprimer {
  background-color: rgba(0, 0, 0, 0);
  position: relative;
  right: 3em;
}

#map + p a {
  background-color: rgba(0, 0, 0, 0);
  color: #0000EE;
  text-decoration: underline;
}

.animation-container {
  width: 100%;
  display: flex;
  justify-content: center;
  margin: 0;
  padding: 0;
}

@keyframes loading-spin {
  0% {
    rotate: 0deg;
  }
  100% {
    rotate: 360deg;
  }
}
.loading-circle {
  border: 4px black solid;
  border-right-color: rgba(0, 0, 0, 0);
  border-radius: 100%;
  width: 24px;
  height: 24px;
  animation: loading-spin 1s linear 0s infinite;
}/*# sourceMappingURL=style.css.map */