@charset "UTF-8";
/* Palette de couleurs */
:root {
  --bg-color: #efe5cf; /* Beige clair */
  --text-color: #5a4638; /* Marron foncé */
  --button-color: #a68064; /* Brun doré */
  --button-hover-color: #d9b8a2; /* Brun clair */
  --beige-claire: #fff7e1 ;
}

/*comment
/* Ajoutez ceci à votre block de style dans la section head */
.card {
  width: 300px; /* Exact width of the card */
  height: 300px; /* Exact height of the card */
  /*background-image: url("{% static 'images/carte_formation.webp' %}"); !* The image to be used as the background *!*/
  background-size: 100% 100%; /* Ensure the background covers the entire element */
  background-repeat: no-repeat; /* The background image should not repeat */
  /*padding: 10px; !* Padding inside the card *!*/
  box-sizing: border-box; /* This ensures that padding does not add to the total width or height */
  border: 4px solid #fffefe; /* Bordure dans une couleur brun doré */
  border-radius: 30px; /* Cela donne un arrondi de 15 pixels aux coins de la carte */
  box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.3); /* Ombre subtile pour donner de la profondeur */
}

.card:hover {
  transform: translateY(-5px); /* Légère élévation de la carte lors du survol */
  box-shadow: 6px 6px 15px rgba(0, 0, 0, 0.2); /* Ombre plus prononcée lors du survol */
}

/* Responsive Design */
@media (max-width: 768px) {
  .card {
    margin-bottom: 20px;
  }
}
/* Classe personnalisée pour le bouton */
.custom-btn {
  display: inline-block; /* Permet de définir la largeur et la hauteur */
  width: 180px; /* Largeur ajustable */
  height: 30px; /* Hauteur ajustable */
  /*line-height: 50px; !* Assure que le texte est centré verticalement *!*/
  text-align: center; /* Centrer le texte horizontalement */
  border-radius: 20px; /* Rayon de bordure ajustable */
  background-color: var(--button-color); /* Couleur de fond ajustable */
  border: 2px solid #ffffff; /* Couleur de bordure ajustable */
  color: #ffffff; /* Couleur de texte ajustable */
  text-decoration: none; /* Supprime le soulignement du texte des liens */
  font-family: "Montserrat", sans-serif;
  /*padding-bottom: 17px; !* Pour que la largeur et la hauteur définies soient respectées *!*/
  /* Plus de styles au besoin */
}

.custom-btn:hover {
  background-color: var(--button-hover-color); /* Couleur de fond au survol */
  color: #e2e6ea; /* Couleur de texte au survol */
  text-decoration: none; /* Supprime le soulignement du texte des liens */
}

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