<style> body * { font-family: courier; } h1, h3 { text-align:center; } #gallery .art { display:inline-block; margin-bottom: 10px; width:300px; height:300px; } .art img { max-width: 300px; max-height: 300px; border:solid 5px white; box-sizing:border-box; } .art img:hover { border:solid 5px #555555; } .nav_ctn { text-align:center; } </style>  <script>window.jQuery || document.write('<script src="js/vendor/jquery-1.10.2.min.js"><\/script>')</script> <script src="js/plugins.js"></script> <script src="js/masonry.pkgd.min.js"></script> <script src="js/imagesloaded.js"></script> <script> var $container = $('#gallery'); // initialize $('#gallery').imagesLoaded( function(){ $container.masonry({ columnWidth: 300, "gutter": 10, itemSelector: '.art' }); }); </script> <!--<script> Pixel Art