Try to use col-xs-12" and “col-sm-6” for your thumbnails. And if you use CSS for styling the page you need @media queries for adaptive same objects to different viewport. For example:
at big screens you have CSS rule “padding: 150px 100px 200px 100px”, but on mobile phones every element will be padding 200 px from left side too. Think about 400px display.Then half of 400px device width will be empty place and full your content is unreadable.
Second issue is here. Now you redefine defaul Bootstrap CSS properties like float and display.
Third. For responive fonts use ’ em ’ or ’ % ’ or any other values which browser calculated automatically based on defauld browser font size (16px usually). Read more here