Hi Malcolm,
Here's the actual code and a screen shot of the page preview in the browser below:
View attachment 686
[CODE lang="html" title="index.html"]<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, shrink-to-fit=no">
<link href="images/favicon.png" rel="icon">
<title>DomainX - Domain for Sale Html Template</title>
<meta name="description" content="HTML Template for Domain for Sale">
<meta name="author" content="harnishdesign.net">
<!-- Web Fonts
======================== -->
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Poppins:100,200,300,400,500,600,700,800,900"
type="text/css">
<!-- Stylesheet
======================== -->
<link rel="stylesheet" type="text/css" href="vendor/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="vendor/font-awesome/css/all.min.css">
<link rel="stylesheet" type="text/css" href="css/stylesheet.css">
</head>
<body>
<p>
<!-- Preloader --> </p>
<blockquote> <br>
</blockquote>
<div class="preloader">
<div class="lds-ellipsis">
<div></div>
<div></div>
<div></div>
<div></div>
</div>
</div>
<!-- Preloader End -->
<!-- Document Wrapper
=============================== -->
<div id="main-wrapper">
<!-- Hero Backgroung
========================= -->
<div class="hero-wrap">
<div class="hero-mask opacity-8 bg-dark"></div>
<div class="hero-bg hero-bg-scroll" style="background-image:url('./images/intro-bg.jpg');"></div>
<div class="hero-content fullscreen py-4 py-lg-0">
<div class="container fullscreen">
<div class="row fullscreen">
<!-- Domain Information
========================= -->
<div class="col-lg-8 align-items-center d-flex flex-column">
<div class="container py-5 my-auto">
<div class="row">
<div class="col-12 mx-auto">
<h1 class="text-14 text-white bg-danger d-inline-block font-weight-700 rounded px-4 mb-4">For
Sale!</h1>
<h2 class="text-13 font-weight-700 text-white mb-4">Evergreenwellsprings.com</h2>
<h3 class="text-white font-weight-400 mb-4">Asking price <span
class="badge badge-success text-7 font-weight-600">$1000</span></h3>
<p class="text-light mb-4">This 3 year old premium domain
name is available for instant purchase. Invest in a
premium brandable domain name and launch your brand
today.</p>
</div>
</div>
<div class="row text-white">
<div class="col-sm-6 col-md-4 d-flex align-items-center mt-2 mt-sm-0">
<span class="text-5 mr-2"><i class="fas fa-envelope"></i></span><a
class="text-white"
href="mailto:
[email protected]">
[email protected]</a>
</div>
<div class="col-md-4 d-flex align-items-center mt-2 mt-md-0">
<span class="text-5 mr-2"><i class="fas fa-globe"></i></span><a
class="text-white"
data-toggle="modal"
data-target="#more-domains"
href="#">More
Domains</a> </div>
</div>
</div>
</div>
<!-- Domain Information End -->
<!-- Make Your offer
========================= -->
<div class="col-lg-4 my-auto mx-4 mx-lg-0">
<div class="row bg-light rounded text-center py-4 mb-4 mb-lg-0">
<div class="col-11 mx-auto">
<h3 class="mb-3 mt-3 font-weight-600">Make An Offer</h3>
<p class="text-black-50 mb-4">Please complete the form below
and the seller will receive your message.</p>
<!-- Contact Form -->
<form id="contact-form" action="php/mail.php" method="post">
<div class="form-group icon-group position-relative"> <input
name="name"
class="form-control border-2"
required=""
placeholder="Enter Your Name"
type="text">
<span class="icon-inside"><i class="fas fa-user"></i></span>
</div>
<div class="form-group icon-group position-relative"> <input
name="email"
class="form-control border-2"
required=""
placeholder="Enter Your Email"
type="email">
<span class="icon-inside"><i class="fas fa-envelope"></i></span>
</div>
<div class="form-group icon-group position-relative"> <input
name="offer"
class="form-control border-2"
required=""
placeholder="Enter Your Offer"
type="text">
<span class="icon-inside"><i class="fas fa-dollar-sign"></i></span>
</div>
<div class="form-group mt-4"> <button id="submit-btn" class="btn btn-primary btn-block"
type="submit">Send
My Offer</button> </div>
</form>
</div>
</div>
</div>
<!-- Make Your offer End --> </div>
</div>
</div>
</div>
<!-- Hero Backgroung End --> </div>
<!-- Document Wrapper End -->
<!-- Modal Popup for More Domains
================================== -->
<div id="more-domains" class="modal fade" role="dialog" aria-hidden="true">
<div class="modal-dialog modal-lg modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title"><span class="text-5 mr-1"><i class="fas fa-globe"></i></span>
More Domains For Sale</h5>
<button type="button" class="close font-weight-400" data-dismiss="modal"
aria-label="Close">
<span aria-hidden="true">×</span> </button> </div>
<div class="modal-body p-4">
<p>Below all Domains are available for sale. Please click on domain
link for further information.</p>
<div class="row">
<div class="col-sm-6 col-lg-4">
<ul class="list-style-2">
<li><a href="#">MyDomain.com</a></li>
<li><a href="#">YourExample.com</a></li>
<li><a href="#">WeDomainNew.com</a></li>
<li><a href="#">MyExample.com</a></li>
<li><a href="#">SaleMyDomain.com</a></li>
</ul>
</div>
<div class="col-sm-6 col-lg-4">
<ul class="list-style-2">
<li><a href="#">MyDomain.net</a></li>
<li><a href="#">YourExample.net</a></li>
<li><a href="#">WeDomainNew.net</a></li>
<li><a href="#">MyExample.net</a></li>
<li><a href="#">SaleMyDomain.net</a></li>
</ul>
</div>
<div class="col-sm-6 col-lg-4">
<ul class="list-style-2">
<li><a href="#">MyDomain.com</a></li>
<li><a href="#">YourExample.com</a></li>
<li><a href="#">WeDomainNew.com</a></li>
<li><a href="#">MyExample.com</a></li>
<li><a href="#">SaleMyDomain.com</a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Modal Popup for More Domains End -->
<!-- Script -->
<script src="vendor/jquery/jquery.min.js"></script>
<script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="js/theme.js"></script>
</body>
</html>[/CODE]