body {
  background: white;
  text-align: center;
  margin:auto;
}

.wrapper {
    display: flex;          /* Place les éléments côte à côte */
    gap: 30px;	/* Espace entre les conteneurs */
	padding: 25px;
}

.container {
    width: 50%;             /* Chacun prend la moitié de la largeur */
    background: white;
    padding: 25px;
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
}

    h2 {
        text-align: center;
        color: #333;
    }
	
    h3 {
        text-align: center;
        color: #f3d34f;
    }

    label {
        font-weight: bold;
        display: block;
        margin-top: 15px;
    }

    input {
        width: 100%;
        padding: 8px;
        margin-top: 5px;
        border-radius: 5px;
        border: 1px solid #ccc;
        font-size: 16px;
    }

button {
  margin-top: 20px;
  padding: 10px 20px;
  background: #505693;
  color: white;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  font-size: 18px;
}

.button:hover {
	background-color: #ffd84d;
}

#result-p {
        background: #e9ffe9;
        border: 1px solid #8ed28e;
        padding: 15px;
        border-radius: 5px;
        font-size: 20px;
        margin-top: 25px;
        text-align: center;
        font-weight: bold;
    }