MMadshadowCPMar 7, 2017
I am using the following code for the slider on my index page. When I view this page on a phone (or simply make my browser window small) all the slider text disappears.
I used the index-fullscreen-image.html template for this page. I see that even your clean version of this displays the same behavior. Every other page on my site (built with other templates) displays properly when the screen size is reduced. Can I fix this, or do I need to recreate my home page with another template (every other one I've tested works ok).
Thanks
<!DOCTYPE html>
<html dir="ltr" lang="en-US">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="author" content="Madshadow Custom Paint"/>
<meta name="description" content="Custom Painter and Airbrush Artist in Western MT. | Madshadow Custom Paint" />
<meta name="keywords" content="gallery, examples, photos, awards, pictures, skulls, true fire, portraits, women, fantasy, warrior, hot rod, tank, fairing, gun safe, custom motorcycle paint jobs, custom painting, air brush, airbrush, graphics, pin-striping, flames, chicks, autos, boats, helmets, airbrushing, custom, paint, painter, design, motorcycle, bicycle, mountain bike, race car, Harley Davidson, bikes, sport bikes, planes, airplane, truck, graffiti, tribal, lightning, animals, horses, bear, wolf, celtic, anime, cartoon, faux, tailgate, panel, art, Missoula, Montana, Northwest">
<meta name="robots" content="index,follow" />
<!--Google Analytics
===========================================-->
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-8929360-1', 'auto');
ga('send', 'pageview');
</script>
<!-- Stylesheets
============================================= -->
<link href="http://fonts.googleapis.com/css?family=Lato:300,400,400italic,600,700|Raleway:300,400,500,600,700|Crete+Round:400italic" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="css/bootstrap.css" type="text/css" />
<link rel="stylesheet" href="style.css" type="text/css" />
<link rel="stylesheet" href="css/dark.css" type="text/css" />
<link rel="stylesheet" href="css/font-icons.css" type="text/css" />
<link rel="stylesheet" href="css/animate.css" type="text/css" />
<link rel="stylesheet" href="css/magnific-popup.css" type="text/css" />
<link rel="stylesheet" href="css/responsive.css" type="text/css" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<!-- Document Title
============================================= -->
<title>Motorcycle Airbrush Painting by Madshadow Custom Paint</title></head>
<body class="stretched">
<!-- Document Wrapper
============================================= -->
<div id="wrapper" class="clearfix">
<!-- Header
============================================= -->
<header id="header" class="transparent-header dark full-header sticky">
<div id="header-wrap">
<div class="container clearfix">
<div id="primary-menu-trigger"><i class="icon-reorder"></i></div>
<!-- Logo
============================================= -->
<div id="logo">
[
](index.html)
</div><!-- #logo end -->
<!-- Primary Navigation
============================================= -->
<nav id="primary-menu" class="transparent-header full-header dark"><div><i class="icon-phone3"></i>(406) 626.4749</div>
<!-- Top Search ============================================= --> <div id="top-search"> [](#) <form action="search.html" method="get"> </form> </div><!-- #top-search end --> </nav><!-- #primary-menu end --> </div> </div> </header><!-- #header end --> <section id="slider" class="force-full-screen full-screen"> <div class="force-full-screen full-screen dark" style="background-image: url('images/index.jpg');background-position: 50% 0;"> <div class="container clearfix"> <div class="slider-caption slider-caption-center"> <h2 data-animate="fadeInDown">Madshadow Custom Paint</h2> <h3 data-animate="fadeInUp" data-delay="400">Your source for world class custom airbrushing in Western Montana</h3> <p data-animate="fadeInUp" data-delay="600">Flames, Skulls, Fantasy, Portraits, Nature, Graphics, Murals...</p> <p data-animate="fadeInUp" data-delay="800">Motorcycles, Cars, Trucks, Boats, Planes, Snowmobiles, Mountain Bikes, Helmets, Guitars, Art Panels... </p> <p data-animate="fadeInUp" data-delay="1000">Let MCP help deliver the paint job of your dreams. </p> </div> </div> </div> </section> <!-- Footer ============================================= --> <footer id="footer" class="dark"> <!-- Copyrights ============================================= --> <div id="copyrights"> <div class="container clearfix"> <div class="col_half"> Copyrights © 2017 All Rights Reserved by Mark Chase dba Madshadow Custom Paint<br> Huson, Montana (406) 626-4749 </div> <div class="col_half col_last tright"> <div class="copyrights-menu copyright-links fright clearfix"> [Home](index.html)/[Gallery](gallery.html)/[About Us](about.html)/[Info](info.html)/[Road Warrior Plus](rwp-home.html) </div> <div class="fright clearfix"> [ ](https://www.facebook.com/MadshadowCustomPaint/) [ ](https://www.pinterest.com/chase5290/madshadow-custom-paint/) </div> </div> </div> </div><!-- #copyrights end --> </footer><!-- #footer end --></div><!-- #wrapper end-->
<!-- Go To Top
============================================= -->
<div id="gotoTop" class="icon-angle-up"></div><!-- External JavaScripts
============================================= -->
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/plugins.js"></script><!-- Footer Scripts
============================================= -->
<script type="text/javascript" src="js/functions.js"></script>
</body>
</html>