Edit file File name : contact.html Content :<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Contact</title> <link rel="stylesheet" href="./style.css"> </head> <body> <header class="header" id="header"> <div class="header__container container"> <a href="#" class="header__img"> <img src="./assets/img/icons/logo-white.svg" alt="image"> </a> <nav class="nav nav--header" id="nav"> <ul class="nav__list"> <li><a href="#">Your home</a></li> <li><a href="#">Your community</a></li> <li><a href="#">Our story</a></li> <li><a href="#">Wanaka</a></li> <li><a href="#">Contact</a></li> </ul> <div class="nav__links"> <div class="info-row__item"> <span class="info-row__name">Mark Tutty</span> <a href="tel:0212207246" class="info-row__link">021 220 7246</a> <a href="mailto:mark@3plus.co.nz" class="info-row__link">mark@3plus.co.nz</a> </div> <div class="info-row__item"> <span class="info-row__name">David Reid</span> <a href="tel:0212883244" class="info-row__link">021 288 3244</a> <a href="mailto:david@3plus.co.nz" class="info-row__link">david@3plus.co.nz</a> </div> </div> </nav> <div class="burger-menu" id="trigger'"> <span class="burger-menu__span-first"></span> <span class="burger-menu__span-second"></span> <span class="burger-menu__span-third"></span> </div> </div> </header> <main> <section class="hero-section hero-section--simple"> <div class="hero-section__background"> <img src="./assets/img/backgrounds/contact-banner.jpg" alt="image"> </div> <div class="hero-section__container container js-in-viewport-animate-block fade-in"> <h1 class="hero-section__title">Contanct</h1> </div> </section> <section class="text-section text-section--contact"> <div class="text-section__container container"> <div class="text-section__wrap"> <div class="text-section__inner js-in-viewport-animate-children js-prepare-children-fade-in"> <h2>Call Mark or David to discuss your move to The Terrace, Wanaka</h2> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras sed sapien quam. Sed dapibus est id enim facilisis, at posuere turpis adipiscing. Quisque sit amet dui dui. Duis rhoncus velit nec est condimentum feugiat. Donec aliquam augue nec gravida lobortis. Nunc arcu mi, pretium quis dolor id, iaculis euismod ligula.</p> </div> <div class="text-section__inner-contacts"> <div class="text-section__contacts js-in-viewport-animate-children js-prepare-children-fade-in"> <div class="text-section__item"> <p class="text-section__name">Mark Tutty</p> <a href="tel:0212207246" class="text-section__link">021 220 7246</a> <a href="mailto:mark@3plus.co.nz" class="text-section__link">mark@3plus.co.nz</a> </div> <div class="text-section__item"> <p class="text-section__name">David Reid</p> <a href="tel:0212883244" class="text-section__link">021 288 3244</a> <a href="mailto:david@3plus.co.nz" class="text-section__link">david@3plus.co.nz</a> </div> <div class="text-section__item text-section__item--map-link"> <a href="https://goo.gl/maps/6qkKVqP1hGumpMFq7" class="text-section__link">The Terrace Deans Drive Wanaka 9305 New Zealand</a> </div> </div> </div> </div> </div> </section> <section class="map-row map-row--contact"> <div class="map-row__container container container--fw"> <div class="map-row__inner"> <div class="map-row__form-block"> <form action="#" class="form--hidden form form--contact"> <div class="form__item-wrap field"> <input type="text" class="form__input" placeholder="Your name"> </div> <div class="form__item-wrap field"> <input type="email" placeholder="Email" class="form__input"> </div> <div class="form__item-wrap field"> <input type="number" class="form__input" placeholder="Phone"> </div> <div class="form__item-wrap field"> <textarea class="form__text" placeholder="Your message"></textarea> </div> <div class="form__check-wrap"> <label class="container">I agree to receive marketing communications <input type="checkbox" checked="checked"> <span class="checkmark"></span> </label> </div> <button class="form__btn" type="submit"> Send <img src="./assets/img/icons/arrow-contact.svg" alt="image"> </button> </form> <a href="#" class="map-row__follow-wrap"> <p class="map-row__follow">Follow our development on Facebook</p> <div class="map-row__follow-img"> <img src="./assets/img/icons/facebook-contact.svg" alt="image"> </div> </a> </div> <div class="map-row__map"> <div class="map-row__map-wrap"> <iframe src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d2835.3786336500584!2d169.140992!3d-44.7118835!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0xa9d5497d5043c24d%3A0xf2aa9ccfb9e4b09f!2sAlpine%20Estate!5e0!3m2!1sen!2sua!4v1614448552625!5m2!1sen!2sua" style="border:0;" allowfullscreen="" loading="lazy"></iframe> </div> </div> </div> </div> </section> <section class="comment"> <div class="comment__container container container--fw"> <div class="comment__wrap js-in-viewport-animate-children js-prepare-children-fade-in"> <div class="comment__person"> <h4 class="comment__title">Comments from our community.</h4> <div class="comment__img"> <img src="./assets/img/icons/person-item.svg" alt="image"> </div> </div> <div class="comment__content"> <q class="comment__quote"> “Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras sed sapien quam. Sed dapibus est id enim facilisis, at posuere turpis adipiscing. Quisque sit amet dui dui.” </q> <span class="comment__author"> — DAVID REID </span> </div> </div> </div> </section> </main> <footer class="footer"> <div class="info-row info-row--contact"> <div class="info-row__container container container--fw"> <div class="info-row__inner"> <div class="info-row__logo-wrap"> <a href="#" class="info-row__logo"> <img src="./assets/img/icons/logo-white.svg" alt="image"> </a> <div class="info-row__copyright-wrap"> <div class="info-row__common-img"> <img src="./assets/img/icons/common.svg" alt="image"> </div> <p class="info-row__copyright">©2021 The Terrace, Wanaka. Created by <a href="#">Fluid</a>.</p> </div> </div> <div class="info-row__list"> <p class="info-row__title">Sales enquiries.</p> <div class="info-row__wrap"> <div class="info-row__item"> <p class="info-row__name">Mark Tutty</p> <a href="tel:0212207246" class="info-row__link">021 220 7246</a> <a href="mailto:mark@3plus.co.nz" class="info-row__link">mark@3plus.co.nz</a> </div> <div class="info-row__item"> <p class="info-row__name">David Reid</p> <a href="tel:0212883244" class="info-row__link">021 288 3244</a> <a href="mailto:david@3plus.co.nz" class="info-row__link">david@3plus.co.nz</a> </div> <div class="info-row__item--map info-row__item"> <form action="#" class="form"> <div class="form__item-wrap field"> <input type="text" class="form__input" placeholder="Your name"> </div> <div class="form__item-wrap field"> <input type="email" placeholder="Email" class="form__input"> </div> <div class="form__item-wrap field"> <input type="number" class="form__input" placeholder="Phone"> </div> <div class="form__item-wrap field"> <textarea class="form__text" placeholder="Your message"></textarea> </div> <div class="form__check-wrap"> <label class="container">I agree to receive marketing communications <input type="checkbox" checked="checked"> <span class="checkmark"></span> </label> </div> <button class="form__btn" type="submit"> Send <img src="./assets/img/icons/long-arrow-right.svg" alt="image"> </button> </form> </div> <div class="info-row__item--row info-row__item"> <a href="https://goo.gl/maps/6qkKVqP1hGumpMFq7" class="info-row__link">The Terrace Deans Drive Wanaka 9305 New Zealand</a> <a href="#" class="info-row__link-img--mobile-visible info-row__link-img"> <img src="./assets/img/icons/facebook-icon.svg" alt="image"> </a> </div> <div class="info-row__item"> <a href="#" class="info-row__link-img--mobile-hidden info-row__link-img"> <img src="./assets/img/icons/facebook-icon.svg" alt="image"> </a> </div> </div> </div> <nav class="nav--footer nav"> <ul class="nav__list"> <li><a href="#">Your home</a></li> <li><a href="#">Your community</a></li> <li><a href="#">Our story</a></li> <li><a href="#">Wanaka</a></li> <li><a href="#">Contact</a></li> </ul> </nav> </div> </div> </div> </footer> <script src="js/main.js"></script> </body> </html> Save