CCM Web Design Standards

Footer

<footer>
        <div class="ankle">
            <div class="containFooter">
                <a href="#">EPDM</a>
                <a href="#">TPO</a>
                <a href="#">FleeceBACK</a>
                <a href="#">PVC</a>
                <a href="#">Insulation</a>
                <a href="#">Skylights</a>
                <a href="#">Roof Garden</a>
                <a href="#">Multiple-Ply</a>
                <a href="#">Coatings</a>
                <a href="#">Edge Metal</a>
                <a href="#">NVELOP</a>
                <a href="#">Metal Products</a>
                <a href="#">AVB</a>
            </div>
        </div>
        <div class="heel">
            <div class="containFooter">
                <div class="leftFoot">
                    <h2>Go Mobile</h2>
                    <a href="#"><img src="/Assets/CarlisleSyntec/_images/app-icon-ios.png"/></a>
                    <a href="#"><img src="/Assets/CarlisleSyntec/_images/app-icon-android.png" /></a>
                </div>
                <div class="middleFoot">
                    <h2>Product &amp; Website Support</h2>
                    <p>24/7 website and technology-related assistance.</p>
                    <button class="btn btn-primary" type="button">Contact Carlisle</button>
                </div>
                <div class="rightFoot">
                    <h2>Stay Connected</h2>
                    <ul class="social-ul">
                        <li class="fb" title="Connect on Facebook"><a href="https://www.facebook.com/CarlisleSynTec" target="_blank">Facebook</a></li>
                        <li class="tw" title="Follow us on Twitter"><a href="http://www.twitter.com/carlislesyntec" target="_blank">Twitter</a></li>
                        <li class="li" title="Connect on LinkedIn"><a href="http://www.linkedin.com/company/137227?trk=tyah" target="_blank">LinkedIn</a></li>
                        <li class="ig" title="Follow us on Instagram"><a href="https://www.instagram.com/carlislesyntec/" target="_blank">Instagram</a></li>
                        <li class="yt" title="Watch us on YouTube"><a href="http://www.youtube.com/user/CarlisleSynTec" target="_blank">YouTube</a></li>
                        <li class="fr" title="Follow us on Flickr"><a href="https://www.flickr.com/photos/50720705@N05/" target="_blank">Flickr</a></li>
                    </ul>
                </div>
                <div class="sole">
                    <hr />
                    Carlisle SynTec Systems &nbsp;|&nbsp; P.O. Box 7000, Carlisle, PA 17013 &nbsp;|&nbsp; Fax: 717-245-7053
                    <hr />
                    Made in the USA &nbsp;|&nbsp; <a href="#">Privacy Policy</a>
                </div>
            </div>
        </div>
    </footer>
  • Links must be white.
  • Buttons take on standard styling.
  • For proper display, make sure you are viewing the footer at full size before viewing it at a smaller screen size so you can see how the layout responds to the viewport.