/*! RESPONSIVE */

  @media (min-width: 1441px) {

    body{
        max-width:100%;
    }

    .slider-navigation {
        display: flex;
        justify-content: space-between;
        align-items: center;
        position: absolute;
        top: 50%;
        left: 0;
        right: 0;
        transform: translateY(-50%);
      }
    
      .slider-navigation__left-arrow,
      .slider-navigation__right-arrow {
        font-size: 2rem;
        border: none;
        background-color: transparent;
        color: white;
        cursor: pointer;
      }
    
      .slider-navigation__left-arrow {
        margin-left: 2%;
        left: 0;
      }
    
      .slider-navigation__right-arrow {
        margin-right: 2%;
        right: 0;
      }
  
      .slider-navigation__left-arrow:hover,
      .slider-navigation__right-arrow:hover {
          background-color: white;
          opacity:50%;
      }
  
      .nav-item{
          margin-bottom:10px;
      }
}

@media (max-width: 1440px) {
    .indexheader h1{
        font-size:3rem;
    }

    .gitesBas a{
        font-size:2rem;
        padding:10px;
    }

}

@media (max-width: 880px) {

    .map .slide-image2 {
        height: auto; 
        border-radius: 15px;
        margin-top: 10%;
        margin-bottom: 10%;
        width:90%;
    }
    
    .map {
        max-width: 100%; 
        width: 180%; /* Assure que la div occupe toute la largeur disponible */
        height: 300px; /* Définissez la hauteur souhaitée pour la div */
        align-items: center; /* Centre l'image verticalement */
    }

    header{
        border-radius:0;
    }

    .indexheader h1{
        font-size:1rem;
    }

    .indexheader h1{
        font-size:1rem;
    }

    .logo {
        width: 100px;
        margin-left:10px;
        margin-right:70px;
    }

    /* Copyright and footer styles */
    .copyright {
        font-size: 1.3rem;
    }

    .footer-basic li {
        font-size: 1rem;
    }

    /* Adjusted styles for navigation toggle and menu */
    .nav-menu {
        display: none;
    }

    .navbar {
        flex-direction: column;
        padding:0;
        height:60px;
    }

    .nav-responsive {
        display: flex;
        width: 100%;
    }

    .nav-toggle {
        display: block;
        justify-content: flex-end;
        margin-left: 40%;
        margin-top:6px;
        width: 45px;
        height: 45px;
        background-color: #333;
        color: #fff;
        text-align: center;
        font-size: 24px;
        line-height: 40px;
        cursor: pointer;
        padding-top:1px;
    }

    .nav-menu.active {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        text-align: center;
        padding: 0;
        margin: 0;
        background-color:rgba(255,255,255,0.92);
        z-index:1;
        padding:10px;
        margin-top:4px;
    }

    .nav-item {
        display: flex;
        width: 100%;
        justify-content: center;
        padding: 0;
        margin: 0;
    }

    /* Slider styles */
    .slides img {
        width: 350px;
        flex-shrink: 0;
    }

    .slider {
        width: 80%;
        height: 200px;
    }

    .indexheader h1{
        text-align:center;
        font-size:1.5rem;
        margin:auto;
        margin-top:10%;
    }

    .indexheader a{
    margin-top:2%;
    font-size:1rem;
    margin-left:35%;
    }

    .textIndex{
        background-color : rgba(255,255,255,0.8);
        width:70%;
        font-size:0.8rem;
        padding:20px;
        text-align:center;
        border-radius:20px;
        box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
        margin:auto;
        display:block;
        }

    .textIndex img{
        width:100%;
        border-radius:20px;
    }

    .textIndex p{
        width:100%;
        margin:0;
        margin-top:5%;
    }

    .h3index{
        font-size:1.3rem;
        margin-top:10%;
    }

    .avis{
        display:inline;
        justify-content:center;
        align-items:center;
    }

    .vignette{
        width:80%;
    }

    footer{
        margin-bottom:15px;
    }

    .titleGites{
        margin-left:30%;
    }

    .gites{
        display:block;
        max-width:100%;
    }

    .gitesBas{
        margin:0;
        margin-bottom:50px;
        font-size:2rem;
        max-width:100%;
        padding:25px;
        height:90px;
        margin-left:10px;
        margin-right:10px;
    }

    .titre{
        margin:10px;
        margin-top:20px;
        margin-left:40px;
    }

    .slidesHome {
        display: flex;
        flex-direction: column;
        margin-top:30px;
    }

    .slide-image {
        width: 80%;
        height: auto;
        margin:auto;
        border-radius: 10px;
        margin-bottom:10px;
    }

    .indexheader a{
        margin-left:35%;
        border-radius:20px;
    }

    .indexheaderbas a{
        margin-left:20%;
        border-radius:20px;
        margin-top:2%;
        font-size:1rem;
        margin-left:25%;
    }


}