body { font-family: Arial, sans-serif; background-color: #f4f4f4; margin: 0; padding: 0; } .email-content { background-color: #f0f0f0; /* Light gray background */ margin: 20px auto; padding: 20px; border: 1px solid #dddddd; max-width: 600px; width: 90%; /* This makes the content take 90% width of its container */ text-align: left; /* Remove text justification */ } header { background-color: #E16969; color: white; text-align: center; height: 50px; /* Fixed height for header */ line-height: 50px; /* Vertically center the text */ width: 100%; /* Make header full width */ } footer { background-color: #E16969; color: white; text-align: center; height: 50px; /* Fixed height for footer */ line-height: 50px; /* Vertically center the text */ width: 100%; /* Make footer full width */ } .header-container { position: relative; /* Pour positionner le logo et le texte dans le header */ height: 50px; /* Hauteur maximale du header */ } .logo { position: absolute; /* Pour positionner le logo */ max-height: 100%; /* Taille maximale du logo égale à la hauteur du header */ top: 0; /* Aligner le logo en haut */ left: 0; /* Aligner le logo à gauche */ margin-right: 10px; /* Marge à droite du logo */ } .header-container h1, .footer-container p { margin: 0; font-size: 24px; } .footer-container p { font-size: 12px; } .footer-container a { color: #FFFFFF; /* White color for links in footer */ text-decoration: none; } .footer-container a:hover { text-decoration: underline; /* Optional: add underline on hover */ } a { color: #E16969; /* Same color as header/footer background for all other links */ text-decoration: none; } a:hover { text-decoration: underline; /* Optional: add underline on hover */ } h2 { color: #E16969; } p { line-height: 1.6; }