Site title to hide on smaller screens using CSS

You can learn more about using media queries that target certain screen sizes here:

http://css-tricks.com/snippets/css/media-queries-for-standard-devices/

http://webdesignerwall.com/tutorials/responsive-design-with-css3-media-queries

The site title can be hidden with this CSS:

.site-title {
  display: none;
}

Putting this CSS within a media query like the ones you see in the tutorials above will restrict the hiding to whatever screen size you like.

For example, if you want to restrict the hiding to devices with screens under 768px wide, you could try this:

@media only screen
and (max-width : 768px) {
  .site-title {
    display: none;
  }
}

Let me know how it goes.