Logo and Jumbotron title text not resizing properly for iphone 6S/5 screen

The logo and jumbotron title text are not resizing properly on iphone 6S or 5 screens. How can I edit the CSS to modify these sections for these types of media devices?

I hope you are well today and thank you for your question.

You can try achieving this by adding the following CSS code in the Custom CSS option of your theme on the below path.

Admin Area -> Appearance -> Customize -> Additional CSS

/*iphone 6*/
@media only screen 
and (min-device-width : 375px) 
and (max-device-width : 667px) { 
  #header .bottom-header h1{
    font-size:30px
  }
}
/*iphone 5*/
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 568px) { 
  #header .bottom-header h1{
    font-size:30px
  }
}

Best Regards,
Support

Good morning,

I added the above css code to the additional CSS page but the text is still displaying the same size on both iphone 5 as well as iphone 6 screens. I also tried adding !important to the css code and it still is displaying at the 70px font size.

Still experiencing this issue, Any other alternative?

Also need to shrink the logo on the 65, 5 screens