@media screen and (min-width: 801px){
    
}


/*-------------------------------------------RESET DU NAVIGATEUR----------------------------------*/

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
/*-----------------------------------------------FIN_RESET----------------------------------------*/

/*________________________________________________GENERAL_________________________________________*/

body, footer{
    color: #002C84;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.12rem;
}

ul li{
    list-style: none;
}
.footer{
    color:#002C84;
}
/*_______________________________________________FIN_GENERAL______________________________________*/


/*_________________________________________________HEADER_________________________________________*/


/*REPARTITION DE L'ESPACEMENT ENTRE LE LOGO ET LA NAVBAR + CENTRAGE DES LIENS PAR RAPPORT AU LOGO*/

.header{
    display: flex;
    gap: 10vw; /*Espace entre logo/navbar */
    background-color: #89c6ff68;
    align-items: center;
}

/*POSITION ET DIMENSION DU LOGO + MARGE A GAUCHE POUR PLUS DE LISIBILITE*/
#logo{
    
    justify-content: flex-start;
    width: 9%;
    height: auto;
    margin-left: 5%;
}

/*DISPOSITION DES LIENS DE LA NAVBAR*/
.navList{
    display: flex;
    justify-content: space-between;
    list-style: none;
    gap: 10vw; /*Espacement entre les liens*/
    font-size: 1.1rem;
}
nav a, footer a{
    color:#002C84;
}
/*_________________________________________________FIN_HEADER_____________________________________*/

/*-----------------------------------------------BANNIERE----------------------------------------*/

#banniere{
    width: 100%;    /*Prendre toute la largeur*/
    height: 28rem;   /*Gérer la hauteur*/
    max-width: 100%;
    opacity: 90%;
    object-fit: cover;
    margin-top: 1rem;
}

/*--------------------------------------------FIN_BANNIERE---------------------------------------*/

/*___________________________________________SECTION DESCRIPTION_________________________________*/

h1, .h1mention{                                 /*Même paramètre de h1 pour toutes les pages*/
    text-align: center;
    /* margin: 1.5rem auto; */
    margin: 2.5rem 1rem 1.5rem 1rem;
    font-size: 1.5rem;
    text-decoration: underline;

}
.description{
    /*définition des marges*/
    margin-top: 2%;
    margin-left: 20%;
    margin-right: 20%;
    margin-bottom: 10%;
    /*réajuster les marges si necessaire*/
    line-height: 2rem; /*interligne*/
    text-align: left;
}

/*_________________________________________FIN_SECTION_DESCRIPTION___________________________________*/

/*---------------------------------------SECTION NOS SERVICES-----------------------------------------*/
h2{
    margin: 0% 5% 2% 5%; /*marge: haut,droite,bas,gauche*/
    font-size: 1.2rem;
    text-decoration: underline;
}
.NosServices{
    /*définition des marges*/
    /* margin: 0% 8% 0% 8%; */
    margin-left: 15%;
    margin-right: 15%;
    display: flex;
    align-items:center;
    gap: 15%; /*5rem*/
    line-height: 3rem;
    font-size: 1.2rem;
}

.ListServiceItalic{
    margin-left: 5%;
    font-size: 1rem;
    font-style: italic;
}

#ImageStock{
    width: 30%; /*22%*/
    height: auto;
}
ul li {
    list-style: none;

}
/*---------------------------------------FIN_SECTION_NOS_SERVICES----------------------------------*/

/*________________________________SECTION DESCRIPTION SERVICE DE FILMAGE______________________________*/
.DescriptionFilmage{
    margin: 5% 15% 10% 15%;
}
h3{
    margin-bottom: 8%;
    text-align: center;
    font-size: 1.1rem;
}
.filmage{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 5vw;
    text-align: justify;
    line-height: 1.8rem;
}
#paletteFilme{
    width: 30%;
    height: auto;
}
/*_______________________________FIN_SECTION_DESCRIPTION_SERVICE_DE_FILMAGE_______________________________*/

/*------------------------------------------------FOOTER--------------------------------------------------*/

.footer{
    background-color: #89c6ff68;
    padding: 3%;
    display: flex;
    justify-content:center;
    align-items: baseline;
    gap: 0.5rem;
}
.mentions a{
    line-height: 1.2rem;
    text-decoration: none;
}
/*----------------------------------------------FIN_FOOTER-----------------------------------------------*/

/*---STYLE DES LIENS---*/

a:hover{
    color: rgb(0, 0, 255);
}


a:active{
    color: rgb(255, 0, 0);
}



/*____________________________________________________PAGE CONTACT_______________________________________________________________*/

.PageContact{
    text-align: center;
    line-height: 5vh;
}

.PageContact2{
    margin-bottom: 10%;
    text-align: center;
}

.map{
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 5vh;
    margin-bottom: 5vh;
}

/*________________________________________________FIN_PAGE_CONTACT_______________________________________________________________*/

/*_________________________________________________PAGE RAJOINDRE________________________________________________________________*/

/* .rejoindreh1{
    margin-top: 4vh;

} */
.Rejoindre{
    margin-left: 15vw;
    margin-right: 15vw;
    text-align: justify;
    line-height: 2rem;
    margin-bottom: 5vh;
}

/*Début Formulaire*/
form{
    display: flex;
    align-items: center;
    justify-content: center;
}
fieldset, .formContact{
    margin: 5% 20% 5% 20%;
    border: 0.15rem solid #89C6FF;
    border-radius: 2rem;
    border-style:groove;
    margin-left: 30%;
    margin-right: 30%;
    


}
fieldset{
    margin-bottom: 10%;
}

legend{
    text-align: center;
    font-size: 1.2rem;
    font-weight: bold;
    margin-bottom: 2.5vh;
}
.formGroup{             /*Pour aligner les champs*/
    margin: 0.3rem;
    display: flex;
    align-items: center;
    margin-right: 7.5vw; 
}
label {
    width: 8rem;
    margin-left: 6vw;
    font-weight: bold;
}
input{
    flex: 1;               /* les inputs prennent tout l’espace restant */
    padding: 5px;/*2px*/
    border: 1px solid #002C84;
    
}
textarea{
    width: 250px;
    height: 100px;
    border: 1px solid #002C84;
}
.pjInput{               /*toujours la stylisation des bouton de pièces jointes*/
    font-size: 0.5rem;
    font-weight: bold;
    margin-top: 2.5vh;
    border: none;
}
.button{                        /*Stylisation du bouton envoyer niveau police*/
    font-size: 0.8rem;
    font-weight: bold;
    background-color: #89c6ff68;
    padding: 0.5rem;
    border-radius: 0.5rem;
    border: 1px solid #001235;
    color: #001235;
}
#button, #buttonContact{                        /*Stylisation du bouton envoyer niveau emplacement*/
    text-align: center;
    margin-top: 2rem;
    margin-bottom: 2rem;
}
.labelPJ{               /*Uniquement pour les labels des pièces jointes*/
    margin-left: 6.5vw;/*4.5vw*/
}
/*style supplémentaire facultatif*/
input:hover{
    color: rgb(255, 0, 0);
}
/*Fin formulaire*/

/*________________________________________________________FIN_PAGE_REJOINDRE_________________________________________________*/

/*-------------------------------------------------MENTIONS LEGALES----------------------------------------------------------*/

.h1mention{
    text-decoration:none;
}
.mention{
    margin: 5% 15% 10% 12%;
    line-height: 2rem;

}
.rouge{
    color: rgb(193, 0, 0);
    text-decoration:underline;
    background-color: yellow;
}
.mention h4{
    color: rgb(193, 0, 0);
    margin: 1.5rem 0rem 0.5rem 0rem;
    font-size: 1.2rem;
    text-decoration: underline;
}
/*---------------------------------------------------REMERCIEMENT------------------------------------*/
.remerciement{
    margin: 5% 25% 5% 25%;
    padding: 2rem 2rem 5rem 2rem;
    border: 2px solid #89C6FF;
    border-radius: 2rem ;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.remerciement h1{
    text-align: center;
    text-decoration: none;
}
.remerciement a:hover{
    font-size: 1rem;

}
.remerciement a{
    font-size: 1rem;
    color: #001235;
    text-decoration: none;
}
#boutonMerci{
    display: block;
    margin: 0 auto;
    background-color: #89c6ff68;
    padding: 0.5rem;
    border-radius: 0.5rem;
    border: 1px solid #001235;
}
.merci{
    text-align: center;
    margin: 2rem;
    line-height: 1.5rem;
}
#messageEnvoye{
    width: 30%;
    height: auto;
   
}