Having Trouble Linking Typography on Build A Website Design System Challenge

I’m stuck on building a website design system! I’m trying to make the color boxes span the entire page instead of just stick to one side and when I input the fonts into CSS they aren’t showing up on the page. I feel like I’m missing something super basic? Here’s the code below:

`<!Doctypehtml>

Meg's Style Guide

My Website Style Guide

Colors

Cool Blue

#2d5dcc

Light Pink

#FEC3FB

Purple

#cc33f2

Green

#05f224

Fonts

Merriweather

The Cute Lil Sloth Wore Three Trenchcoats and Pretended to be Human

`

For CSS:

`.color-container {
border: 1px solid black;
display: inline-block;
text-align: center;
width: 45%;
min-height: 20px;
}
.cool-blue{
background-color: #2d5dcc;
color: white;
}
.pink{
background-color: #FEC3FB;
color: white;
}
.purple{
background-color: #cc33f2;
color: white;
}
.green{
background-color: #05f224;
color: white;

.text-container{
border: 1px solid black;
display: inline-block;
text-align: center;
width: 45%;
min-height: 20px;
}
.font-name{
font-size:20px;
text-decoration: underline;
}`