/* Style de base pour le bouton */
		.bouton-rond {
      background-color: orangered;
      text-decoration: none;
      padding:20px;
      margin:10px;
      border-radius:30px;
		  margin-left:180px ;
      margin-top: auto;
      color:white;
      display: inline-block;
		
	}

    /* Style au survol du bouton */
    .bouton-rond:hover {
      background-color: black; /* Fond blanc plus clair au survol */
    }

    /* Conteneur pour centrer les boutons */
    .conteneur-boutons {
      text-align: center;
	  vertical-align: middle;
	  display: inline-block;
	  font-size:21px;
	  color:white;
    }
	
	body{
		  background-image: url('Produits.jpg');
		  background-repeat: no-repeat;
          background-attachment: fixed;
          background-size: 100% 100%;
	}
	
	 .Xiaomi {
      width: 1600px; /* Ajustez la largeur de l'image selon vos besoins */
      vertical-align: middle; /* Ajout de cette ligne pour aligner verticalement l'image */
      margin-left: 25px; /* Espace à droite de l'image */
	  margin-top:25px;
    }
	
	.font {
      font-family: 'Long Cang', cursive;
      margin-top: 20px;
      display: inline-block; /* Ajout de cette ligne pour aligner le texte et l'image horizontalement */
	  margin-left: 25px;
	  color:black;
	}
	
	.bouton-rond-1{
		background-color: orangered;
      text-decoration: none;
      padding:20px;
      margin:10px;
      border-radius:30px;
		  margin-left:180px ;
      margin-top: 40px;
      color:white;
      display: inline-block;
	 
	}
	
	 .boutons {
      text-align: center;
	  vertical-align: middle;
	  display: inline-block;
	  font-size:21px;
	  color:white;
    }
	
	 .bouton-rond-1:hover {
      background-color: black; /* Fond blanc plus clair au survol */
    }
	
	.font-1 {
		margin-top:90px;
		margin-left:30px;
	}
	
	.Image-Xiaomi{
		margin-top:20px;
		margin-left:50px;
	}
	.font-2 {
		margin-left:470px;
		margin-top:28px;
	}
	
	.price-container {
            display: flex;
            align-items: center;
            font-size: 40px;
			margin-left:20px;
        }

        .original-price {
            text-decoration: line-through;
            margin-left: 41px;
			color:gray;
        }

        .discounted-price {
            color: black;
        }
		
   .container {
      margin: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      height: 0vh;
      background-color: #f0f0f0; /* Changer la couleur de fond de la page au besoin */
	  margin-left:5px;
    }

    .rectangle {
      background-color: black;
      color: white;
      padding: 25px;
      border-radius: 8px;
      box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
	  margin-top:110px;
	  margin-right:1220px;
	
    }

    .rectangle p {
      margin: 0;
      font-size:25px;
    }

    .star-rating {
  font-size: 0;
  text-decoration: none;
  
}
.star-rating a {
  float: left; /* Aligner les étoiles à gauche */
  font-size: 48px;
  display: flex;
  justify-content: center;
  text-decoration: none;
  color: #FFD700;
  transition: color .2s;
  margin-left:30px;
  margin-top:110px;
}

.star-rating a:hover {
  color: #FFEC8B;
}

 .span-2 {
  font-size: 40px; /* Taille de la note */
  margin-left: 5px; /* Espacement entre les étoiles et la note */
  margin-top:1100px;
}

 .container-2 {
            margin: 20px auto;
            padding: 20px;
			margin-left:450px;
			margin-top:155px;
  }
  
  .container-3 {
    position: relative; /* Assurez-vous que le positionnement est relatif par rapport à son conteneur parent */
    left: 1000px;       /* Déplace l'élément vers la droite de 1000 pixels */
    top: -460px;  
	max-width: 800px;
  }
  

  .barre-orange {
  height: 1000px; /* Hauteur de la barre */
  background-color: orange; /* Couleur de la barre */
  top:200px;
}

  .font-3{
		margin-top:90px;
		margin-left:30px;
	}
  
  .trotinnete{
	    margin-top:40px;
		margin-left:66px;
  }
  
  .font-3 {
	  margin-top:-50px;
	  margin-left:65px;
	}
	
  .font-4 {
	  margin-left:470px;
		margin-top:28px;
	}
	  
	.price-container-1 {
            display: flex;
            align-items: center;
            font-size: 40px;
			margin-left:20px;
        }

        .original-price-1 {
            text-decoration: line-through;
            margin-left: 41px;
			color:gray;
        }

        .discounted-price-1 {
            color: black;
        }
		
		  .container-1 {
      margin: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      height: 0vh;
      background-color: #f0f0f0; /* Changer la couleur de fond de la page au besoin */
	  margin-left:5px;
    }

    .rectangle-1 {
      background-color: black;
      color: white;
      padding: 33px;
      border-radius: 10px;
      box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
	  margin-top:130px;
	  margin-right:1220px;
	
    }

    .rectangle p {
      margin: 0;
      font-size:18px;
    }
	
	  .star-rating {
  font-size: 0;
  text-decoration: none;
  
}
 .star-rating a {
  float: left; /* Aligner les étoiles à gauche */
  font-size: 48px;
  display: flex;
  justify-content: center;
  text-decoration: none;
  color: #FFD700;
  transition: color .2s;
  margin-left:30px;
  margin-top:110px;
}

.star-rating a:hover {
  color: #FFEC8B;
}
	  .container-4 {
            margin: 20px auto;
            padding: 20px;
			margin-left:450px;
			margin-top:155px;
  }
  
  .container-5 {
    position: relative; /* Assurez-vous que le positionnement est relatif par rapport à son conteneur parent */
    left: 1000px;       /* Déplace l'élément vers la droite de 1000 pixels */
    top: -440px;  
	max-width: 800px;
  }

   .caracteristiques {
    margin-top: -1320px;
}

.caracteristiques h1 {
    font-size: 25px;
    color: black;
}

.caracteristiques table {
    width: 60%;
    border-collapse: collapse;
    margin-top: 10px;
}

.caracteristiques table, .caracteristiques th, .caracteristiques td {
    border: 1px solid #ddd;
}

.caracteristiques th, .caracteristiques td {
    padding: 10px;
    text-align: left;
	font-size:21px;
}

.caracteristiques th {
    background-color: #f2f2f2;
}

/* Ajoutez ces styles pour ajouter un peu d'espace entre les sections */
.container-3 {
    margin-top: 20px;
}  


.caracteristiques-1 {
    margin-top: 20px;
}

.caracteristiques h2 {
    font-size: 18px;
    color: #333;
}

.caracteristiques table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 10px;
}

.caracteristiques table, .caracteristiques th, .caracteristiques td-1 {
    border: 1px solid #ddd;
}

.caracteristiques th, .caracteristiques td {
    padding: 10px;
    text-align: left;
}