#top-image { position: fixed; width: 100%; height: 100%; overflow: hidden; top: 0; left: 0; z-index: 0; background-image: url('../images/papers.jpg'); background-repeat: no-repeat; background-position: 50% -100px; background-size: 100% 100%; } .content { position: relative; z-index: 1; } #top { padding: 5% 0; margin: 0 auto; color: #FFF; text-shadow: 0 2px 1px rgba(0, 0, 0, .7); background: rgba(0, 0, 0, .4); max-width: 1200px; box-shadow: 0 0 80px 50px rgba(0, 0, 0, .4); } #top h2 { margin-bottom: 90px; font-size: 42px; } header, .insignia { position: relative; } header, .sticky-wrapper { margin-bottom: -150px; } .insignia { display: block; width: 250px; height: 250px; box-sizing: border-box; border-radius: 50%; margin: 0 auto; text-align: center; font: 170px/250px Arvo, sans-serif; text-shadow: 0 3px 2px rgba(0, 0, 0, .5); color: #FFF; z-index: 2; margin-bottom: 30px; } main { padding-top: 0; box-shadow: 0 -2px 15px rgba(0, 0, 0, .5); } .firefox-hack { position: absolute; width: 100%; } h3 { text-align: left; } .showcase { text-align: left; margin-bottom: 40px; background: #1D2933; clear: both; } .showcase a { color: #668B99; } .showcase-title { color: #FFF; font-size: 14px; text-transform: uppercase; padding: 10px 0; background: #2C4252; text-align: center; } .showcase .fa-heart { color: #F00; margin: 0 2px; } .showcase-image img { width: 90%; vertical-align: middle; } .showcase-image .fa-plus { padding: 20px 35px; border: 4px dashed #2C4252; } .showcase-image { width: 200px; height: 100px; line-height: 100px; text-align: center; display: inline-block; transition: background .4s; } .showcase-image:hover { background: #375A77; /* default */ } .showcase-image.smartystreets:hover { background: #FFC200; } .showcase-image.maxcdn:hover { background: #F37121; } .showcase-image.maxcdn img { width: auto; max-height: 20px; } .showcase-add { display: none; color: #DDD; padding: 10px 0; font-size: 16px; text-align: center; border-top: 1px solid #337BAC; } @media (max-width: 900px) { header, .sticky-wrapper { margin-bottom: -120px; } .insignia { font-size: 100px; width: 175px; height: 175px; line-height: 175px; } } @media (max-width: 767px) { /* mobile */ #top-image { background-position: 50% 50%; background-size: auto 100%; } #top h2 { margin-bottom: 20px; } .stuck { position: static; } .insignia { display: none; } .showcase-image { width: 49%; } .showcase img { max-width: 200px; } }