This is the include that is being called on resolutions below 1000px. I think it's just the necessary code. It shouldn't make a difference if I were to paste it directly in the body of my webpage. <header class="header" id="header"> Leeighton Talks About Pokémon </header> <meta name="viewport" content="width=device-width, initial-scale=1"> <style> body { font-family: 'Josefin Sans', sans-serif; } .overlay { height: 0%; width: 100%; position: fixed; z-index: 100; top: 0; left: 0; background-color: rgba(255,255,255,1.00); background-color: rgba(255,255,255, 0.9); overflow-y: hidden; transition: 0.5s; } .overlay-content { position: relative; top: 12%; width: 100%; text-align: center; margin-top: 10px; } .overlay a { padding: 8px; text-decoration: none; font-size: 48px; color: #b9b9b9; display: block; transition: 0.3s; } .overlay a:hover, .overlay a:focus { color: #000000; } .overlay .closebtn { position: absolute; top: 20px; right: 45px; font-size: 60px; } .navigation { overflow: hidden; background-color: #ffffff; position: fixed; /* Set the navbar to fixed position */ top: 0; /* Position the navbar at the top of the page */ width: 100%; /* Full width */ padding-top: 10px; } .overlay .closebtn { font-size: 80px; top: -40px; right: -15px; margin-right:10px; padding-top: 15px; } @media screen and (max-height: 450px) { .overlay { overflow-y: auto; } .overlay a { font-size: 20px } .overlay .closebtn { font-size: 40px; top: 15px; right: 35px; } } </style> <div id="myNav" class="overlay"> <a href="javascript:void(0)" class="closebtn" onclick="closeNav()">×</a> <div class="overlay-content"> <a class="homepage" href="index.html">Home Page</a> <a class="news" href="news.html">News</a> <a class="videogames" href="video-games.html">Video Games</a> <a class="leeightonsanimewalkthrough" href="leeighton-s-anime-walkthrough.html">Leeighton's Anime Walkthrough</a> <a class="pokedex" href="pokedex.html">Pokédex</a> <a class="forums" href="https://www.leeightontalksaboutpokemonforums.net/">Forums</a> </div> </div> <div class="navigation"> <span style="float:right;margin-right:15px;font-size:30px;cursor:pointer" onclick="openNav()">☰ </span> </div> <script> function openNav() { document.getElementById("myNav").style.height = "100%"; } function closeNav() { document.getElementById("myNav").style.height = "0%"; } </script> <style> body.homepage a.homepage, body.news a.news, body.videogames a.videogames, body.leeightonsanimewalkthrough a.leeightonsanimewalkthrough, body.pokedex a.pokedex, body.forums a.forums, { color: #000000; } </style> <div> <script type="text/javascript" src="returntothetopbutton.js"></script> <button onclick="topFunction()" id="myBtn" title="Go to top">↑</button> </div> <div class="social-media"> <a href="https://www.facebook.com/" target="_blank"> <img src="pictures/social-media/facebook.png" width="100" height="100" alt=""/> </a> <a href="https://www.twitter.com/" target="_blank"> <img src="pictures/social-media/twitter.png" width="100" height="100" alt=""/> </a> <a href="https://www.youtube.com/" target="_blank"> <img src="pictures/social-media/youtube.png" width="100" height="100" alt=""/> </a> <a href="https://www.instagram.com/" target="_blank"> <img src="pictures/social-media/instagram.png" width="100" height="100" alt=""/> </a> </div> <link href="http://netdna.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.css" rel="stylesheet"> <style> .btn.share-btn { border: medium none; box-shadow: 0 2px 0 0 rgba(0, 0, 0, 0.2); color: #fff; cursor: pointer; display: inline-block; font-size: 1.2em; margin-top: 6px; opacity: 0.9; outline: medium none; padding: 8px 16px; } .share-btn { display: inline-block; color: #ffffff; border: none; padding: 0.2em; width: 4em; opacity: 0.9; box-shadow: 0 2px 0 0 rgba(0,0,0,0.2); outline: none; text-align: center; } .share-btn:hover, .share-btn:focus { color: #eeeeee; } .share-btn:active { position: relative; top: 2px; box-shadow: none; color: #e2e2e2; opacity: 1; outline: medium none; position: relative; top: 2px; } .twitter { background: #55acee none repeat scroll 0 0; } .facebook { background: #3b5998 none repeat scroll 0 0; } .reddit { background: #ff5700 none repeat scroll 0 0; } .email { background: #444444 none repeat scroll 0 0; } </style> <!-- Social Button HTML --> <div class="sharebuttons"> <!-- Facebook --> <a href="http://www.facebook.com/sharer/sharer.php?u=<URL>" target="_blank" class="btn share-btn facebook"> <i class="fa fa-facebook"></i> </a> <!-- Twitter --> <a href="http://twitter.com/share?url=<URL>&text=<TEXT>&via=<VIA>" target="_blank" class="btn share-btn twitter"> <i class="fa fa-twitter"></i> </a> <!-- Reddit (url, title) --> <a href="http://reddit.com/submit?url=<URL>&title=<TITLE>" target="_blank" class="btn share-btn reddit"> <i class="fa fa-reddit"></i> </a> <!-- Email --> <a href="mailto:?subject=<SUBJECT&body=<BODY>" target="_blank" class="btn share-btn email"> <i class="fa fa-envelope"></i> </a> </div>
... View more