@media (min-width: 1441px) {
    header{
    height: 90vh;
    background-image: url('../images/vignes.jpeg');
    background-size: cover;
    background-repeat: no-repeat;
    margin-bottom:50px;
    box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
    }

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

    h1 {
        margin-top:10%;
        color:white;
        font-size:4rem;
        border-radius:20px;
        padding:20px;
        margin-left:32%;
        display:inline-block;
    }

    h2{
        color: #717787;
        margin-top: 2%;
        font-size: 2rem;
        background-color: rgba(255, 255, 255, 0.8);
        border-radius: 30px;
        padding: 20px;
        margin-left:46%;
        margin-bottom:80px;
        display: inline-block;
        box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
        text-align:center;
    }

    h3{
        margin-left:40%;
        margin-right:40%;
        background-color : rgba(255,255,255,0.8);
        font-size:1.2rem;
        border-radius:20px;
        padding:20px;
        text-align: center;
        box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
    }

    h4{
        background-color : rgba(255,255,255,0.8);
        font-size:2rem;
        border-radius:20px;
        padding:20px;
        text-align: center;
        box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
        display:inline-block;
        margin-left:26%;
        color:grey;
        transition:transform 0.4s ease;
        margin-top:40px;
        margin-bottom:60px;
    }
}

@media (max-width: 1440px) {
    header{
        height: 35vh;
        background-image: url('../images/vignes.jpeg');
        background-size: cover;
        background-repeat: no-repeat;
        margin-bottom:50px;
        box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
        }
    
        .textIndex{
            background-color : rgba(255,255,255,0.8);
            width:80%;
            margin:auto;
            font-size:1.5rem;
            padding:30px;
            text-align:center;
            border-radius:20px;
            display:flex;
            box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
        }

        h1 {
            margin-top:10%;
            color:white;
            font-size:4rem;
            border-radius:20px;
            padding:20px;
            margin-left:25%;
            display:inline-block;
        }

        h2{
            color: #717787;
            margin-top: 2%;
            font-size: 2rem;
            background-color: rgba(255, 255, 255, 0.8);
            border-radius: 30px;
            padding: 20px;
            margin-left:44%;
            margin-bottom:80px;
            display: inline-block;
            box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
            text-align:center;
        }

        h3{
            margin-left:36%;
            margin-right:40%;
            background-color : rgba(255,255,255,0.8);
            font-size:1.4rem;
            width:400px;
            border-radius:20px;
            padding:20px;
            text-align: center;
            box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
        }

        h4{
            background-color : rgba(255,255,255,0.8);
            font-size:2rem;
            border-radius:20px;
            padding:20px;
            text-align: center;
            box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
            display:inline-block;
            margin-left:20%;
            color:grey;
            transition:transform 0.4s ease;
            margin-top:40px;
            margin-bottom:60px;
        }
}



.texteDescriptif p{
    margin-left:40px;
    margin-right:40px;
    background-color : rgba(255,255,255,0.8);
    font-size:1.2rem;
    border-radius:20px;
    padding:20px;
    text-align:center;
    box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
}

.linkContainer{
    display:flex;
    justify-content: center;
    margin:auto;
}

.liens {
    margin: 30px;
    font-size: 2rem;
    text-align: center;
    background-color: rgba(255, 255, 255, 0.7); /* Fond blanc transparent */
    color: black; /* Couleur du texte gris */
    border-radius: 10px;
    padding: 40px;
    transition: transform 0.4s ease;
    box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
    width: 400px;
}

.liens p {
    background-color: rgba(255, 255, 255, 0.4); /* Fond blanc transparent */
    padding: 20px; /* Ajoute du padding pour le texte */
    border-radius: 10px; /* Coins arrondis pour le fond du texte */
}

h4:hover{
    transform:scale(1.3);
}

.slidesActivites {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px; /* Augmenter l'espace entre les images */
    margin: 0 auto; /* Centrer le conteneur */
    max-width: 1200px; /* Limiter la largeur du conteneur */
    margin-top:7%;
}

.photosActivite {
    width:100%; /* Réduire la largeur des images de 10% */
    border-radius: 15px; /* Coins arrondis */
    transition: transform 0.3s ease; /* Transition pour l'effet de zoom */
}

.photosActivite:hover {
    transform: scale(1.16); /* Zoom au passage de la souris */
}

.liens.un {
    background-image: url('../images/vignette/canal.jpg');
    background-size: cover; /* Ajuste la taille de l'image pour remplir complètement la zone */
}

.liens.deux {
    background-image: url('../images/vignette/rando.jpg');
    background-size: cover;
}

.liens.trois {
    background-image: url('../images/vignette/cheval.jpg');
    background-size: cover;
}

.liens.quatre {
    background-image: url('../images/vignette/velo.jpg');
    background-size: cover; /* Ajuste la taille de l'image pour remplir complètement la zone */
}

.liens.cinq {
    background-image: url('../images/vignette/para.jpg');
    background-size: cover;
}

.liens.six {
    background-image: url('../images/vignette/pech.jpg');
    background-size: cover;
}

.liens.sept {
    background-image: url('../images/vignette/plage.jpg');
    background-size: cover;
}


@media (max-width: 768px) {
    h1{
       font-size:2rem;
       padding:0;
       text-align:center;
       margin:0;
       margin-top:40px;
       margin-left:24px;
        }

        .slidesActivites{
        display:block;
        margin:auto;
    
             }
    
             .photosActivite{
            width:90%;
            margin-left:20px;
            margin-bottom:20px;
                     }

                     h2{
                        font-size:2.5em;
                        margin:auto;
                        margin-left:24%;
                        margin-bottom:40px;
                         }

                         h3{
                            margin:auto;
                            padding:10px;
                            font-size:1.2rem;
                            width:90%;
                             }

                             .linkContainer{
                              display:block;
                                 }

                                 .liens{
                                   width:90%;
                                   margin:auto;
                                   margin-top:20px;
                                       }

                                       h4{
                                        width:90%;
                                        margin:auto;
                                        margin-top:40px;
                                        margin-bottom:50px;
                                        margin-left:18px;
                                        font-size:1.7rem;
                                            }

                                            .texteDescriptif p{
                                               
                                                font-size:0.9rem;
                                                    }
    
}