Code Review: Dasmoto's Project

Projects Skill Path Projects
1

Hi so I worked and completed this coding project for the Full Stack career path. I was hoping to get any feedback as I do think I probably made it more complicated than it needs to be, but I’m trying to give myself grace as I am still learning.

HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="index.css">
</head>
<body>
    <header style="background-image: url(./resources/Image\ 1.webp);">Dasmoto's Arts & Crafts</header>

    <div class="section first">Brushes</div>
    <img src="./resources/Image 2.webp" alt="Multiple brushes">
    <p class="title">Hacksaw Brushes</p>
    <p>Made of the highest quality oak, Hacksaw brushes are known for their weight and ability to hold paint in large amounts. Available in different sizes. <br><span>Starting at $3.00 / brush</span></p>

    <div class="section second">Frames</div>
    <img src="./resources/Image 3.webp" alt="colored frames">
    <p class="title">Art Frames (assorted)</p>
    <p>Assorted frames made of different material, including MDF, birchwood, and PDE. Select frames can be sanded and painted according to your needs. <br><span>Starting at $2.00 / frame.</span></p>

    <div class="section third">Paint</div>
    <img src="./resources/Image 4.jpeg" alt="tubes of paint">
    <p class="title">Clean Finnish Paint</p>
    <p>Imported paint from Finland. Over 256 colors available in-store, varying in quantity (1 oz. to 8 oz.). Clean Finnish paint microbinds to canvas, increading the finish <br>and longevity of any artwork. <span>Starting at $5.00 / tube.</span></p>
</body>
</html>

CSS

header {
    font-family: Helvetica;
    font-size: 100px;
    font-weight: bold;
    color: khaki;
    text-align: center;
    margin-bottom: 50px;
}

.style {
    width: 50%;
}
body {
    font-family: Helvetica;
}

.section {
    font-family: Helvetica;
    font-size: 32px;
    font-weight: bold;
    color: white;
    margin-bottom: 20px;
    margin-top: 10px;
}

.first {
    background-color: mediumspringgreen;
}

.second {
    background-color: lightcoral;
}

.third {
    background-color: skyblue;
}

.title {
    font-size:large;
    font-weight: bold;
}

span {
    font-weight: bold;
    color: blue;
}