Responsive Blog card

Hey @Lovethrech, your spacing is good but one major element that needs attention is the box shadow. The box-shadow's x and y positions are wrong and the color should be a solid black. An easy fix is setting the blur value (the third value in your box-shadow property) to 0. You will also need to remove the transparency of your box shadow's color. For the box-shadow to appear on the bottom of the card you have to set the y-offset to a position value.

In short, your box-shadow code should look something like this:

.card-container {
box-shadow: 10px 10px 0px #000000;
}

Another thing to note is that the card's box shadow should change when you hover over it just like your <h1>. This change can be seen in the image showing the active states. For this, all you have to do is add a hover-state on your .card-container class and change the x and y values on the box shadow. An example would be something like this:

.card-container:hover {
box-shadow: 30px 30px 0px #222222;
}