Website more mobile friednly

[Stef]

I want my website to look more mobile friendly.
google.com/webmasters/tools/mobile-friendly/ says it is, but i dont like how it looks like. Header picture looks like its two times there, and fonts of the articles are too big.

1) How can I make fonts for the articles smaller just for mobile?

2) is there a way to make widgets as well smaller for mobile?

3) is there a way to make featured image for posts smaller for mobile?

[Themonic-Support]

You do not have permission to view this content.

[Stef]

I tried doing it like this, but its not working, nothing really changes:

`@media screen and (max-width: 300px) {
hgroup a {
font-size: 12px;
}
hgroup .site-description {
font-size: 9px;
}
}

I would really want to change it myself, if you can point me at the right direction, as I want to imporve myself with this.

[Themonic-Support]

You do not have permission to view this content.

[Stef]

Thank you, only got one more problem.
The posts dont take the full width, they look a bit cut out, as in shown on the half of the screen. While widgets take full width, and I dont get why.
my website is http://www.malwarehero.com , and here is the picture of how it looks like:
Picture
If you can just help me out how to fix that, I would really appreciate.

[Themonic-Support]

You do not have permission to view this content.

[Stef]

It worked! Thank youuuu

[Author]

Posts