/* === Styles de base === */
/* #03045F  #0078B8 #00B6DA  #93E1F0 #CEF1F9 #DC3C35 #FEC606*/
body { margin: 0; font-family: Arial, sans-serif; line-height: 1.0; background-color: #f4f4f4;}
header, footer { background-color: #4A66AC;  color: white; text-align: center; padding: 1em;}
nav { background-color: #03045F;}
nav ul { list-style: none; margin: 0;  padding: 0;  display: flex;  flex-direction: row;  justify-content: center;}
nav ul li {  margin: 0;}
nav ul li a {  display: block;  padding: 1em;  color: white;  text-decoration: none;}
nav ul li a:hover { background-color: #0078B8;}

main {  padding: 20px;  max-width: 1000px;  margin: auto;  background: white; text-align: center; }

input[type="text"] {  width: 100%;  max-width: 500px; /* limite la largeur sur les grands écrans */ padding: 0.75em;  font-size: 1em;  border: 2px solid #03045F;  border-radius: 5px;  box-sizing: border-box;  transition: all 0.3s ease;}
input[type="password"] {  width: 100%; max-width: 500px; /* limite la largeur sur les grands écrans */ padding: 0.75em;  font-size: 1em;  border: 2px solid #03045F;  border-radius: 5px;  box-sizing: border-box;  transition: all 0.3s ease;}
textarea { width: 100%; max-height: 300px; max-width: 300px; padding: 50px; font-size: 16px; border: 2px solid #03045F; border-radius: 6px; resize: vertical; 
	/* Permet de redimensionner verticalement uniquement */ transition: border-color 0.3s, box-shadow 0.3s;
    }
/* Style général du select */
select {   padding: 8px 12px;  font-size: 16px;  border: 2px solid #03045F;  border-radius: 6px;  background-color: #fffff;  color: #03045F;  cursor: pointer;
  transition: 0.3s;}
/* Effet au survol */
select:hover {   border-color: #0078B8;   background-color: #ffffff; }
/* Style des options */
option {   padding: 8px;   font-size: 15px; }


.btn-submit {   background-color: #0078B8;  color: white;  border-color:#03045F; padding: 10px 20px;  border: yes;  border-radius: 10px;  font-size: 16px;  cursor: pointer;  transition: background-color 0.3s ease; }
.btn-submit:hover {  background-color: #00B6DA;}

/* Container centré */
.container {  text-align: center;}

/* Lien bleu stylisé */
.lien-bleu {  display: inline-block;  padding: 12px 24px;  background-color: #007BFF;  color: white;  text-decoration: none;  font-size: 18px;  border-radius: 8px;
  transition: background-color 0.3s ease, transform 0.2s ease;}

/* Effet au survol */
.lien-bleu:hover {  background-color: #0056b3;  transform: scale(1.05);}

/* === Media Query pour smartphones (écran max 768px) === */
@media (max-width: 768px) {
nav ul {   flex-direction: column; }
nav ul li a {  text-align: center;  padding: 1em; border-bottom: 1px solid #666; }
main { padding: 10px; }
@media (min-width: 601px) and (max-width: 1024px) {  input[type="text"] {    font-size: 1.1em;    max-width: 95%;  }}	
textarea {font-size: 12px;}
.lien-bleu {    font-size: 16px;    padding: 10px 20px;  }
}