html{background-color: cornsilk;}
 
 body {
    font-size:30px;
    color: black;
    background: -moz-linear-gradient(lightcoral);
    margin:0px;
 }

     .textimage{
        color :black;
        text-decoration: none;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        gap : 10px;
        height : 100%;
        text-align: center;
    }

div {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap : 50px;
    text-align: center;
    background: -moz-linear-gradient(lightcoral, cornsilk) ;
}
h1{
    color:lightblue; 
    text-decoration: underline;
    font-size: 6.0rem;
    font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
    text-align: center;
}

h2{ color:lightblue; 
    background-color: cornsilk;
    font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
    text-align: left;
}

h3{ font-style: italic;
    color:lightblue;
    text-align: left;
    font-family: "Fraunces";
    font-weight: 900;
}

p {
    margin: 0px;}

p a {
  height: 100%;
  display: flex;
  flex-direction: column;
  color: currentColor;
  text-decoration: none;
}

p:hover img {
  transform: scale(1.1);
}

/* img { height: 200px;} */
img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    flex: 1;
    /*filter: grayscale(1);*/
    /*mix-blend-mode: multiply;*/
    transition: all .5s;
}

@font-face {
    font-family: "Fraunces";
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
    src: url("fraunces.woff2") format(woff2) tech(variations),
         url("fraunces.woff2") format("woff2-variations");
}
.fraunces {
    font-variation-settings: "opsz" var(--fraunces-opsz, 9), "wght" var(--fraunces-wght, 900), "SOFT" var(--fraunces-SOFT, 0), "WONK" var(--fraunces-WONK, 1);
}@font-face {
    font-family: "Fraunces";
    font-weight: 100 900;
    font-style: italic;
    font-display: swap;
    src: url("fraunces-italic.woff2") format(woff2) tech(variations),
         url("fraunces-italic.woff2") format("woff2-variations");
}
.fraunces {
    font-variation-settings: "opsz" var(--fraunces-opsz, 9), "wght" var(--fraunces-wght, 900), "SOFT" var(--fraunces-SOFT, 0), "WONK" var(--fraunces-WONK, 1);
}


/* pour faire zoomer le titre (h1) : */

  .float-zoom
  {opacity: 0;
  transform: scale(0.8) translateY(0);
  animation: floatZoomIn 7s ease-in-out infinite;}

@keyframes floatZoomIn
  {0% {opacity: 0;
  transform: scale(0.8) translateY(0);}
  50% { opacity: 1;
  transform: scale(1.1) translateY(-15px);}
  70% {transform: scale(1) translateY(-7px);}
  100% {opacity: 1;
  transform: scale(1) translateY(0);}}