html{
    /* background:  url(images_2/fond_vert_1920.jpg); */
    background:  url(images_2/fond_vert_1920_noir.png);
    background-attachment: fixed;
    scroll-behavior: smooth;
}

 body {
    font-size:20px;
    margin-left: 4em;
    margin-right: 4em;
    margin-bottom: 2em;
    margin-top: 2em;
}

.textimage{
    text-decoration: none;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap : 5px;
    /*height : 100%;*/
    text-align: center;
    }

.grilleauto {   
    border-radius: 25px;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap : 60px;
    text-align: center;
    scroll-margin-top: 25px;
    padding: 10px;
    margin: 10px;
}
.galerie {
    display: flex;
    gap : 60px;
}
h1{
    text-shadow: 3px 3px 10px, rgba(0,0,0,0.5);
    color:cornsilk;
    font-size: 6.0rem;
    font-family: "manihot", sans-serif;
    text-align: right;
    margin: 0em;
}

h2{ 
    text-indent: 1em;
    color : cornsilk;
    /* font-family: "slack-casual", sans-serif; */
    font-family: "manihot", sans-serif;
    text-align: center;
    font-size: 2.5rem;
    margin: 2em;
}

h3{ 
    text-indent: 1em;
    color:cornsilk;
    font-family: "manihot", sans-serif;
    text-align: center;
    font-size: 5rem;
    border-radius: 25px;
    margin: 2rem;
}

h4{
    text-shadow: 3px 3px 10px, rgba(0,0,0,0.5);
    color:cornsilk;
    font-size: 7.0rem;
    font-family: "manihot-dingbats", sans-serif;
    text-align: center;
    margin: 0em;
    margin-bottom: 2rem ;
}

p {
    margin: 0px;
    padding: 0px;
    /* font-family: "rl-horizon", sans-serif; */
    font-family: "manihot", sans-serif;
    font-size: 1.5rem;
    color: darkolivegreen;
    background-color: rgba(255, 248, 220, 0.688);
    border-radius: 25px;
    letter-spacing: 0.2rem;
}

p a {
    display: flex;
    flex-direction: column;
    color: currentColor;
    text-decoration: none;
    }

/* mettre transform: scale(1.1) pour faire zoomer les images et pas dézoomer
p:hover img {
  transform: scale(1.1);
}*/

img {
    border-radius: 15px;
    width: 100%;
    height: 100%;
    object-fit: cover;
    flex: 1;
    /*filter: grayscale(1);
    mix-blend-mode: multiply;*/
    transition: all .5s;
}

.droite{
    transform: rotate(15deg);
}
.milieu_gauche{
    transform: rotate(-5deg);
}

.milieu_droite{
    transform: rotate(5deg);
}

.gauche{
    transform: rotate(-15deg);
}

/*margin = marge ; padding = marge intérieure*/

.choix {
    display: flex;
    max-width: 800px;
    gap: 170px;
    margin: auto;
    align-items: start;
}
.choix p {
    padding: 1em;
}
.choix img {
    margin:-1em -1em .5em -1em;
    width: calc(100% + 2em);
}

/*POLICES :

 Slack Casual Medium
    font-family: "slack-casual", sans-serif;
    font-weight: 500;
    font-style: normal;

Slack Casual Medium Italic
    font-family: "slack-casual", sans-serif;
    font-weight: 500;
    font-style: italic;

Slack Casual Bold
    font-family: "slack-casual", sans-serif;
    font-weight: 700;
    font-style: normal;

Slack Casual Bold Italic
    font-family: "slack-casual", sans-serif;
    font-weight: 700;
    font-style: italic; 
    

    
RL Horizon Regular
    font-family: "rl-horizon", sans-serif;
    font-weight: 400;
    font-style: normal;

RL Horizon Italic
    font-family: "rl-horizon", sans-serif;
    font-weight: 400;
    font-style: italic;

RL Horizon Bold
    font-family: "rl-horizon", sans-serif;
    font-weight: 700;
    font-style: normal;

RL Horizon Bold Italic
    font-family: "rl-horizon", sans-serif;
    font-weight: 700;
    font-style: italic;*/