@font-face {
  font-family: 'Amatic SC';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(amaticsc_TUZ3zwprpvBS1izr_vOMscGKfrUC.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
div.title-header {
        background-image: url("header.jpg");
	background-color: #16174A;
        width: 100%;
        background-position: center 85%;
        background-size: cover;
        background-repeat: no-repeat;
        min-height: 50vh;
        display: flex;
        align-items: center;
}
@media (min-width: 576px) { div.title-header h1 { max-width: 510px; } }
@media (min-width: 768px) { div.title-header h1 { max-width: 700px; } }
@media (min-width: 992px) { div.title-header h1 { max-width: 920px; } }
@media (min-width: 1200px) { div.title-header h1 { max-width: 1130px; } }

div.title-header h1 {
        color: white;
        width: 100%;
        margin: 0 auto;
        padding: 2rem 0;
        font-size: 4rem;
        text-align: center;
	font-family: 'Amatic SC', cursive;
	font
}



section .grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    grid-auto-rows: minmax(100px, auto);
    gap: 20px;

}
.left { float: left; }
.right { float: right; }
.clear { clear: both; }
.info { font-weight: 700; }
.qte {
    clear: both;
    float: right;
    font-size: 1.5rem;
}
main section article {
    padding-bottom: 0;
}

section.se-deplacer { --section-color: #F1A208; }
section.dormir { --section-color: #155166; }
section.se-laver { --section-color: #ACC3A6; }
section.manger { --section-color: #4B3B47; }
section.s-habiller { --section-color: #BCB3BB; }
section.jouer { --section-color: #6F1D1B; }
section h2 {
    border-bottom: 1rem solid var(--section-color);
    line-height: 2rem;
    padding-bottom: 0;
    margin-bottom: calc(var(--typography-spacing-vertical)/3);
}

section.se-deplacer article header { background-color: #F1A208; }
section.dormir article header { background-color: #155166; color: #d5dce2; } section.dormir article header h3 { color: #d5dce2; }
section.se-laver article header { background-color: #ACC3A6; }
section.manger article header { background-color: #4B3B47; color: #d5dce2; } section.manger article header h3 { color: #d5dce2; }
section.s-habiller article header { background-color: #BCB3BB; }
section.jouer article header { background-color: #6F1D1B; color: #d5dce2; } section.jouer article header h3 { color: #d5dce2; }

h2 {
    --font-size: 2rem;
}
article h3 {
    --typography-spacing-vertical: 0;
}
/*
Jaune : F1A208
Bleu : 155166
Laurier : ACC3A6
Aubergine : 4B3B47
Gris : BCB3BB
Bordeaux : 6F1D1B
*/
header h1 {
    --font-size: 2.5rem;
    --typography-spacing-vertical: 2rem;
}
header article {
    --block-spacing-vertical: calc(var(--spacing) * 2);
}
main section article {
    --block-spacing-vertical: calc(var(--spacing) * 1);
}
.prev-list {
    margin-bottom: calc(var(--typography-spacing-vertical) / 4);
}
article.deja { opacity: 0.3; }
article.deja h3 { text-decoration: line-through; }


main section article p img {
    max-height: 33vh;
    display: block;
    margin: 0 auto;
}