:root {
    --primary: rgb(230, 75, 60); /* ROUGE */
    --secondary: rgb(235, 240, 240); /* GRIS */
    --light: white;
}

* {
   
}

html {
    font-size: 62.5%;
}

body {
    margin: 0;
    background-color: var(--secondary);
    font-family:Arial, Helvetica, sans-serif;
    font-size: 1.6rem;
}

body > header {
    background: var(--primary);
    box-shadow: 0 0 1rem 0 black;
}

body > header > h1 {
    font-size: 2rem;
    margin: 0;
    padding: 2rem 0;
   /* padding-top: 10px;
    padding-right: 80px;
    padding-bottom: 500px;
    padding-left: 50px;*/
    text-align: center;
    color: var(--secondary);
}

main {
    display: grid;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr 1fr;
    column-gap: 10px;
    width: 100rem;
    max-width: 100%;
    margin: 10px auto;
}

article {
    background-color: var(--light);
}

article h2 {
    color: var(--primary);
    padding-left: 15px;
}

article p {
    padding: 0 15px;
}


figure {
    margin: 0;
    width: 100%;
    height: 240px;
    background-repeat:no-repeat;
    background-size: cover;
}

#cat1 {
    background-image: url('../img/cat1.jpg');
}

#cat2 {
    background-image: url('../img/cat2.jpg');
}

#cat3 {
    background-image: url('../img/cat3.jpg');
}