Hey there, welcome to this video. And what we're gonna do now is create our own  custom CSS sheet. Now, um, when we installed Bootstrap a little earlier,  it made this style sheet, okay,  this CSS sheet called Bootstrap css. Now, his job here is to style all the pre-made things  that Bootstrap do for us. Say it's the nav bar, there's a styling in here,  and this big long list here that styles the nav bar,  gives it its color, what fonts to use,  what font sizes, all pre-made for you. Now, what we wanna do now is go  and say, override some of that bootstrap stuff,  or just create our own styles.

Now we don't wanna be editing the Bootstrap css. Why? Because it becomes a big mess, okay? Um, and Dream Mover doesn't let you by. Um, default you can make it writeable,  but it's best to leave it alone. The case, um, it keeps your CSS separate  so you know what's been overwritten.

Yeah. And you just kind of like override the styles  and it becomes a not a lot cleaner having your own style  sheet rather than going in through  and adding this really large version. Okay? So to create your own custom CSS sheet,  and we're gonna move to our CSS designer panel,  and if yours is stuck to current, go to all,  okay, that'll look a little nicer. Mine one's being reset. Um, I'm gonna drag mine around a little bit just  so you can see the bits and pieces.

So there he is. There, there we are. Great. Okay, so the, you are there,  we've only got our bootstrap CSS. Um, so what we need to do is see this little plus button  here, we're gonna create a new CSS style. Um, what are we're gonna call it?

You can call it anything you like. We're gonna call ours main css. You don't have to write the dot CSS in there. You can if you want. Um,  it will add it to there for you though. So it type main CSS click.

Okay. And hey Presto, we have our own CSS sheet. Let's check it out. So let's jump to my desktop. Um, let's have a look. And there's one called Bootstrap website.

And under CSS there's the one that Bootstrap made. Okay? It's a lock file. And this is one we've got. Now, if we have a look at it up here in my app bar,  there's the bootstrap CSS. I'm gonna go to full code view, okay?

This is the big, um, unwieldy bootstrap one. Okay? But look at my CSS nice and pretty and empty. Okay? So what we're allowed to do now is go through  and override the bootstrap, create our own CSS  and our nice tidy little sheet. Okay?

So let's leave it for there,  or let's move into the next video.