Fixed bootstrap column classes and css media queries

- got columns into almost optimal positions with bootstrap column
classes
- might need to move some into media queries so portrait and landscape
tablet views don't have the same offset column classes
- got font size of header to appropriate size for mobile by reducing
the range from 320 to 300 for mobile devices (320 px wide screen wasn't
in the scope of the mobile media query. 319 would probably have worked
also, but I did 300 to account for more screen sizes)