#color,#color1,#color3{
  background-color: #87CEEB;
}
main {
  padding-bottom: 80px; /* ou ajuster à la hauteur réelle de ton footer */
}
section {
   padding-top: 50px;
  padding-right: 30px;
  padding-bottom: 50px;
  padding-left: 80px;
}
nav a:hover {
  color: white;
  border-color: #000000;
  background: #007acc;
}

.dropdown-item:hover { 
  color: white;
  background:#007acc;   
}
 /* --- Accessibilité : lien de saut --- */
/*.skip-link {
  position: absolute;
  top: -40px;
  left: 0;
  background: #000;
  color: #fff;
  padding: 8px 16px;
  z-index: 1000;
  font-weight: bold;
  text-decoration: none;
}
.skip-link:focus {
  top: 0;
}
*/
.skip-link {
    position:absolute;
    left:-9999px;
    top:auto;width:1px;
    height:1px;
    overflow:hidden}
.skip-link:focus{
      position:static;
      width:auto;height:auto
      ;margin:8px;padding:8px 12px;
      background:#000;
      color:#fff;border-radius:6px;
      z-index:1000
    }

 /* Réserve d’espace si footer fixed-bottom ailleurs sur le site */
    body{padding-bottom:100px}

    /* Défilement doux (respecte les préférences) */
    html{scroll-behavior:smooth}
    @media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto} }

/* --- Réserve de place pour le footer fixe --- */
body {
  padding-bottom: 100px;
}

/* --- Bouton retour haut --- */
#scrollUp {
  position: fixed;
  bottom: 90px;
  right: 20px;
  z-index: 9999;
  display: none;
}
#scrollUp.visible {
  display: block;
}
#scrollUp a img {
  width: 50px;
  height: auto;
}

.iframe-container {
  position: relative;
  width: 90%;
  max-width: 1100px;
  margin: 0 auto;
  background-color: white;
  border-radius: 0.75rem;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  border: 1px solid #d1d5db;
  overflow: hidden;
}

.aspect-ratio {
  position: relative;
  width: 100%;
  padding-top: 56.25%; /* 16:9 aspect ratio */
}

.aspect-ratio iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: none;
}

.lien{
 font-size:15pt; 
 margin-left:50px;
}
a:focus{
  outline: 4px solid black;
}

img:focus{
  outline: 4px solid black;
}
iframe:focus{
  outline: 4px solid black;
}
h2#contact.text{
  padding-right: 450px;
}
.form-control:focus {
    color: var(--bs-body-color);
    background-color: var(--bs-body-bg);
    border-color: black  ;
    border: solid;
    outline: 0;
    box-shadow: none;
    }
    .btn-primary:focus{
 outline: 4px solid black;
 outline-offset: 2px;
    box-shadow: none;
}

#image,#image1{ 
  width: 1000px; 
  height: 400px; 
}
.espace{
    padding: 1 5px;/* pour un espace de 5+5px par exemple*/
}