body { background-image: url('fond.jpg'); background-size: cover; background-repeat: no-repeat; background-attachment: fixed; background-position: top-center; } header { position: fixed; } .img2 { center width: 5px; height: 5px; display: block; margin: 0 auto; } img { max-width: 50%; height: auto; } .test2 { border: 1px solid #ddd; border-radius: 4px; padding: 5px; width: 192px; height: 60px; object-fit: contain; } #content { width: 80%; background-color: white; margin: 50px auto; opacity: 0.7; } #titre { font-size: 16pt; color: #477BC6; } #border { border-top: 7px solid red; border-right: 7px solid red; border-bottom: 7px solid red; border-left: 7px solid red; width: 300px; margin: 50px auto; } /* le block conteneur */ .marquee-rtl { max-width: 30em; margin: 1em auto 2em; border: 10px solid #cfbc17; overflow: hidden; box-shadow: 0 .25em .5em #CCC,inset 0 0 1em .25em #CCC; } /* le bloc défilant */ .marquee-rtl > :first-child { display: inline-block; /* modéle de boîte en ligne */ padding-right: 2em; /* un peu d'espace pour la transition */ padding-left: 100%; /* placement à doite du conteneur */ white-space: nowrap; /* pas de passage à la ligne */ animation: defilement-rtl 15s infinite linear; will-change: transform; /* optimise l'animation */ cursor: pointer; } .marquee-rtl:hover :first-child { animation-play-state: paused; } .msg { font-size: 1.5em; line-height: 2em; color: #fff; } .msg:first-letter { font-weight: 700; color: #cfbc17; } @keyframes defilement-rtl { 0% { transform: translate3d(0,0,0); /* position initiale à droite */ } 100% { transform: translate3d(-100%,0,0); /* position finale à gauche */ } } .menu { /*trouvé sur le site web formation */ display: flex; /* Transformation en flexbox */ padding:0; /* Suppression des marges internes */ /*background-color: #477;*/ /* Ajout de la couleur d'arrière-plan */ justify-content: space-around;/* Alignements des liens dans le menu */ } .menu li { list-style-type: none ; /* Suppression des puces */ } .menu a { display:block; /* Transformation en block */ min-width: 120px; /* Largeur minimale des liens */ margin: 0.5rem; /* Marges externes */ padding: 0.4rem 0; /* Marges internes */ text-align: center; /* Centrage du texte */ color: #cfbc17; /* Couleur du texte */ text-decoration: none; /* Suppression du soulignement */ border-radius: 500px; /* Arrondis des bordures */ transition: all 1s ; /* Ajout des effets de transition */ } .menu a.actif { background-color: #000 ; color: #cfbc17 ; border-color: #cfbc17 ; } .menu a:hover, .menu a:hover.actif{ background-color: #cfbc17; color: #000; border-color: #cfbc17; } form { background-color: #f2f2f2; padding: 20px; border-radius: 10px; } label, input[type="submit"] { font-size: 18px; font-weight: bold; margin-top: 10px; display: block; } input[type="text"], input[type="email"], textarea { padding: 10px; margin-top: 10px; width: 100%; font-size: 16px; } textarea { height: 150px; } input[type="submit"] { background-color: #4CAF50; color: white; padding: 9px 18px; border: none; border-radius: 5px; cursor: pointer; } input[type="submit"]:hover { background-color: #3e