@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');

:root {
    --text-primary: #1B1B1B;
    --text-secondary: #333333;
    --text-tertiary: #696969;
    --text-headline: #E1624F;

    --accent-blue: #0C51A7;
    --accent-orange: #E95E10;
    --accent-pink: #E5245E;
    --accent-purple: #591B98;
}

* {
    margin: 0;
    padding: 0;
}

body {
    background-color: #F5F4F0;
    font-family: "Open Sans", sans-serif;
    padding: 6rem;
}

.content-header img {
    width: 100%;
    height: 660px;
}

.content-header h2 {
    margin-top: 8px;
    margin-bottom: 40px;
    font-size: 36px;
}

.container-header {
    text-align: center;
    color: var(--text-secondary);
    font-style: italic;
}

.container-header p {
    margin-top: 24px;
    margin-bottom: 40px;
}

.content-main {
    margin-top: 64px;
}

.container-main h2 {
    font-size: 32px;
    margin-bottom: 8px;
}

#separator-p {
    margin-bottom: 64px;
}

#title-orange {
    color: var(--accent-orange);
    font-weight: bold;
}
.content-main img {
    width: 100%;
}

#title-main {
    font-size: 28px;
    font-weight: bold;
    color: var(--text-primary);
    margin-bottom: 4px;
}

#category {
    color: var(--accent-blue);
    font-weight: bold;
}

#category2 {
    color: var(--accent-purple);
    font-weight: bold;
}

#category3 {
    color: var(--accent-pink);
    font-weight: bold;
}

#category4 {
    color: var(--accent-orange);
    font-weight: bold;
}

.divider {
  width: 100%;
  height: 1px;
  margin: 36px 0;
  background-color: #d9d9d9;
}

ul {
    list-style: inside;
}

.item01 img,
.item02 img,
.item03 img {
    margin-bottom: 20px;
}

footer {
    text-align: center;
}

footer p {
    margin-bottom: 36px;
}

footer img {
    vertical-align: middle;
}