<footer class="blocks-footer-04 footer bg-color-ui-01"> <div class="wrapper"> <div class="grid-container"> <div id="scroll-to-top-btn" class="scroll-to-top-btn show-for-smll-only"> <ins-button solid color="grey" id="scroll-to-top" icon="icon-angle-up" label=""> </ins-button> </div> <div class="spacer xxxx-large"></div> <div class="grid-x grid-padding-x gutter-medium"> <div class="large-3 medium-6 small-12 cell"> <ul class="vertical menu"> <li> <a class="navigation-level-1 color-font-head" data-test="footer-link-home">Quick Links</a> <div class="spacer"></div> </li> <li> <a class="footer-links color-font-head" data-test="footer-link-home">About</a> <div class="spacer small"></div> </li> <li><a class="footer-links color-font-head" data-test="">Our Team</a> <div class="spacer small"></div> </li> <li><a class="footer-links color-font-head" data-test="">Locator</a> <div class="spacer small"></div> </li> <li><a class="footer-links color-font-head" data-test="">About Us</a> <div class="spacer small"></div> </li> <li><a class="footer-links color-font-head" data-test="">Blog</a> <div class="spacer small"></div> </li> <li><a class="footer-links color-font-head" data-test="">Pay Your Bill</a> <div class="spacer small"></div> </li> <li><a class="footer-links color-font-head" data-test="">Contact</a> </li> </ul> </div> <div class="large-3 medium-6 small-12 cell"> <div class="spacer xxx-large show-for-small-only"></div> <ul class="vertical menu"> <li><a class="navigation-level-1 color-font-head" data-test="">Our Services</a> <div class="spacer"></div> </li> <li><a class="footer-links color-font-head" data-test="">Store Locator App</a> <div class="spacer small"></div> </li> <li><a class="footer-links color-font-head" data-test="">Database Driven Website</a> <div class="spacer small"></div> </li> <li><a class="footer-links color-font-head" data-test="">Single Customer View</a> <div class="spacer small"></div> </li> <li><a class="footer-links color-font-head" data-test="">Documentation</a> <div class="spacer small"></div> </li> <li><a class="footer-links color-font-head" data-test="">Development</a> <div class="spacer small"></div> </li> <li><a class="footer-links color-font-head" data-test="">Testing</a> <div class="spacer small"></div> </li> <li><a class="footer-links color-font-head" data-test="">Timeframe</a> <div class="spacer small"></div> </li> <li><a class="footer-links color-font-head" data-test="">Ongoing Cost</a> <div class="spacer small"></div> </li> <li><a class="footer-links color-font-head" data-test="">Agreements & Relationships</a> </li> </ul> </div> <div class="large-3 medium-6 small-12 cell"> <div class="spacer xxx-large hide-for-large"></div> <ul class="vertical menu"> <li><a class="navigation-level-1 color-font-head" data-test="">Address 1</a> <div class="spacer"></div> </li> <li> <a class="footer-links color-font-head" data-test=""> <i class="icon-map-pin address"></i> <span class="address"> 1 Insites Street, Melbourne VIC 3000 Australia </span> </a> <div class="spacer small"></div> </li> <li> <a class="footer-links color-font-head" data-test=""> <i class="icon-phone"></i> <span>+1 520 467 4837</span> </a> <div class="spacer small"></div> </li> <li> <a class="footer-links color-font-head" data-test=""> <i class="icon-printer"></i> <span>+1 520 467 4837</span> </a> <div class="spacer small"></div> </li> <li> <a class="footer-links color-font-head" data-test=""> <i class="icon-mail1"></i> <span class="email">blocks@insites.io</span> </a> <div class="spacer xxx-large"></div> </li> </ul> <!-- address 2 --> <ul class="vertical menu"> <li><a class="navigation-level-1 color-font-head" data-test="">Address 1</a> <div class="spacer"></div> </li> <li> <a class="footer-links color-font-head" data-test=""> <i class="icon-map-pin address"></i> <span class="address"> 1 Insites Street, Melbourne VIC 3000 Australia </span> </a> <div class="spacer small"></div> </li> <li> <a class="footer-links color-font-head" data-test=""> <i class="icon-phone"></i> <span>+1 520 467 4837</span> </a> <div class="spacer small"></div> </li> <li> <a class="footer-links color-font-head" data-test=""> <i class="icon-printer"></i> <span>+1 520 467 4837</span> </a> <div class="spacer small"></div> </li> <li> <a class="footer-links color-font-head" data-test=""> <i class="icon-mail1"></i> <span class="email">blocks@insites.io</span> </a> </li> </ul> <!-- /address 2 --> </div> <div class="large-3 medium-6 small-12 cell"> <div class="spacer xxx-large hide-for-large"></div> <span class="navigation-level-1 color-font-head">Follow</span> <div class="spacer"></div> <ul class="menu social"> <li> <a class="footer-links" href="/" data-test="footer-link-facebook" target="_blank" title="facebook" rel="noreferrer"><i class="icon-facebook"></i></a> </li> <li> <a class="footer-links" href="/" data-test="" target="_blank" title="" rel="noreferrer"><i class="icon-twitter"></i></a> </li> <li> <a class="footer-links" href="/" data-test="" target="_blank" title="" rel="noreferrer"><i class="icon-linkedin"></i></a> </li> </ul> </div> </div> <div class="spacer xxxx-large"></div> </div> </div> <div class="bg-color-main"> <div class="wrapper"> <div class="grid-container"> <div class="spacer small"></div> <div class="bottom-footer grid-x align-middle body-small"> <div class="large-6 medium-shrink small-12 cell"> <div class="text-center no-bullet inline-list show-for-small-only"> <div><a>Privacy Policy</a></div> <div class="spacer small"></div> <div><a data-test="footer-link-mobile-privacy-policy">Terms and Conditions</a></div> <!-- <div class="spacer small"></div> --> <!-- <div><a data-test="footer-link-mobile-terms-condition">Sitemap</a></div> --> </div> <ul class="no-bullet inline-list show-for-medium"> <li><a>Privacy Policy</a></li> <li><a data-test="footer-link-privacy-policy">Terms and Conditions</a></li> </ul> </div> <div class="large-6 medium-auto small-12 cell medium-text-right text-center"> <div class="spacer large show-for-small-only"></div> <p class="copyright body-small">Copyright © 2021 Insites Template. Powered by <a href="/" target="_blank" data-test="footer-link-insites">Insites</a>. </p> </div> </div> <div class="spacer small"></div> </div> </div> </div> </footer>
.blocks-footer-04 { padding: 0!important; } footer.blocks-footer-04 .bottom-footer a { font-weight: 400; } .blocks-footer-04 .footer-links { font-weight: 400; font-style: normal; font-size: var(--typography-small, 0.875rem); color: var(--color-font-body, #595959); } .blocks-footer-04 .vertical.menu .footer-links { display: inline-block; } .blocks-footer-04 .vertical.menu [class^="icon-"] { margin-right: 8px; } .blocks-footer-04 .vertical.menu [class^="icon-"].address { vertical-align: top; margin-top: 6px; display: inline-block; } .blocks-footer-04 .vertical.menu span.address { display: inline-block; width: 90%; } .blocks-footer-04 .vertical.menu span.email { text-transform: lowercase; } .blocks-footer-04 .menu.social { justify-content: unset; } .blocks-footer-04 .menu.social .footer-links { margin-right: 24px; } .blocks-footer-04 .grid-container { padding: 0!important; } @media screen and (max-width: 1023px) { footer.blocks-footer-04 .social.menu a { padding-right: unset; } }