Hi my CSS won't apply to my *about* section - I don't know why. I've tried using a different browser but no luck. I have also tried using a different IDE but didn't fix it. Any help would be using thanks. I have been following a [tutorial from youtube](https://www.youtube.com/watch?v=5bMdjkfvONE&t=2627s). My code is the same as his and I don't know why it's not working.  

I'm not sure why please help

```css
.nav-wrapper {
    display: flex;
    justify-content: space-between;
    padding: 38px;
}

.left-side {
    display: flex;
}

.nav-wrapper > .left-side > div {
    margin-right: 20px;
    font-size: 0.9em;
    text-transform: uppercase;
}

.nav-link-wrapper {
    height: 22px;
    border-bottom: 1px solid transparent;
    transition: border-bottom 0.5s;
}

.nav-link-wrapper a {
    color: #8a8a8a;
    text-decoration: none;
    transition: color 0.5s;
}

.nav-link-wrapper:hover {
    border-bottom: 1px solid black;
}

.nav-link-wrapper a:hover {
    color: black;
}
```

```html
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>page title</title>
    <link rel="stylesheet" href="style.css"?
</head>
<body>
    <div class="container">
        <div class="nav-wrapper">
            <div class="left-side">
                <div class="nav-link-wrapper">
                    <a href="index.html">Home</a>
                </div>

                <div class="nav-link wrapper">
                    <a href="about.html">About</a>
                </div>
            </div>

            <div class="right-side">
                <div class="brand">
                    <div> my name </div>
                </div>
            </div>
        </div>

    </div>
</body>
</html>
```