body{ /* Corps de la page */
	font-family: Arial, sans-serif;
	background-color: black;
}

h1 { /* Texte en balise h1 de la page */
	color: black; /* Propriété qui configure en bleu nuit la couleur de la police du titre de la page */
}

p {/* Styles pour les paragraphes */
	color: white;
}

h6 {/* Styles pour les lignes en h6 */
	color: white;
}

a {/* Styles pour les liens */
        color: white;
}

/* Les DIV*/

.container {
	column-count: 1; /* Propriété qui crée autant de colonnes que la valeur indiquée */
	background-color: black; /* Propriété qui configure la couleur d'arrière-plan de l'encadré central */
}

.centered {
        text-align: center; /* Propriété pour centrer un contenu */
}

img {
	max-width: 100%;
	height: auto;
}

.green {
	color: #24cf0c;
}

.blue {
	color: #1833e3;
}

.red {
	color: #ed2117;
}

.orange {
	color: #FFC300;
}

li {
	color: white; /* Texte en blanc */
	background-color: black; /* Fond noir */
	padding: 5px; /* Espacement pour le confort visuel */
	list-style-type: none; /* Supprime la puce de liste par défaut */
        display: flex;
        justify-content: flex-start; /* Aligne texte à gauche et bouton à droite */
        align-items: center;
        margin-bottom: 5px;
        border-bottom: 1px solid white; /* Supprime la ligne blanche sous chaque élément */
}

li::before {
    content: "•"; /* Ajoute une puce personnalisée */
    color: white; /* Rend la puce blanche */
    margin-right: 8px; /* Espace entre la puce et le texte */
}

button {
	background-color: red;
	color: white;
	border: none;
	padding: 5px 10px;
	cursor: pointer;
	margin-left: auto; /* Pousse le bouton à droite */
}

button:hover {
	background-color: darkred;
}

.btn-ajouter {
    background-color: green;
    color: white;
    border: none;
    padding: 5px 10px;
    cursor: pointer;
    margin-left: auto; /* Pousse le bouton à droite */
}

.btn-ajouter:hover {
    background-color: darkgreen;
}