Adjusting h2, h3, h4 for mobile?

It’s a great forum and you nearly get all your queries sorted. This time, I’ve been searching the forum but not finding an answer that works for me:
I have used he h2 and h4 tags to define typo in widgets on the desktop version and I can’t get it right on mobile. It’s all far too big. I got it right in the maintitle slider, though.

This is the code I try to use with no result:

@media only screen and (max-width: 499px){

  h2 .textwidget .panel-widget-style{
    font-size: 36px !important;
  h4 .textwidget .panel-widget-style{
    font-size: 24px !important;

Guess there is som class I’ve missed? Or what else?
My site is at


try this code:

@media only screen and (max-width: 780px){
  .textwidget h2 {
    font-size: 36px;

  .textwidget h4 {
    font-size: 24px;

Perfect! Thanks a lot.