/* Polices  */
@font-face {
    font-family: "Tagesschrift" face;
    src: url(./Fonts/Tagesschrift-Regular.ttf);
} 

@font-face {
    font-family: "Anvers" face;
    src: url(./Fonts/Anvers-Semibold.ttf);
}



/* CORPS du site  */
body {    
    font-family: "Anvers", 'Times New Roman', Times, serif;
    background: #f4f7f7; 
    color: #222;
    font-size: 1.1rem;
}

p {text-align: justify;}

ul, li {line-height:1.7;}

/* Mise en forme titres / se différencier de 'body' */
h1 {
    font-family: "Tagesschrift", 'Times New Roman', Times, serif;  
    color: whitesmoke;
    letter-spacing: 3px;
    text-shadow: 7px 7px 3px #00000059;
}

h2 {
    font-family: "Tagesschrift", 'Times New Roman', Times, serif;  
    color: whitesmoke;
    letter-spacing: 2px;
    text-shadow: 7px 7px 3px #00000059;
}

h3 {
    color:#006666;
    font-size: 1.5rem;
}

h4 {
    text-align: center;
}


/* TETE ET PIED de page  */
header, footer {
    background-color: #006666; 
    color: white; 
    /* grandeur du background des tete/pied page à priori verticale et horizontale mais je ne vois que vertical  */
    padding: 5% 0;
}
/* je ne sais pas à quoi ça sert mais c'est autour de mon logo : grandeur max / marge sous le logo */
header img {
    max-width:180px;
    margin-bottom:20px
}
/* BANNIERE TETE : alignement centré et grandeur titre  */
header {text-align:center; font-size:1.4rem;}

/* MENU : grandeur de l'espace du menu en hauteur / couleur  */
nav {padding:12px 0; background: #eb983d;}
nav {font-size: 1.2rem;}
/* couleur du menu / déco / espacement des choix du menu  */
nav a {color:#fff;text-decoration:none; padding:16px;}
/* couleur de la case lorsqu'on passe la souris sur les choix du menu  */
nav a:hover {background: #006666;}


.container {max-width:950px; margin:auto;}
section {background:white; border-radius:14px; margin:30px 0; padding:36px 22px;}

.tarifs ul {font-size:1.1rem;}
.equipe-profil {margin-bottom:18px;}
.equipe-profil img {width:20%; border-radius:50%; vertical-align:middle; margin-right:12px;}
footer {text-align:center; font-size:1.1rem;}



.seance {margin-bottom:10%;}
.seance img {width:40%; display: block; border-radius: 50%; margin: auto; object-fit: cover;}


/* MEDIA QUERIES  */
@media(max-width:767px) {
    /* concernant toutes les parties du corps - changement phone view  */
    .container{padding:18px;}
    /* j'ai l'impression que ça ne change rien  */
    .gallery img{width: 100%;} } 


.gallery {display:flex; flex-wrap:wrap; gap:18px; justify-content:center;}
.gallery img {width:40%; height: auto;  border-radius:20%; object-fit:cover}