I've been trying to convert a website design to shopify and have run into a few issues. This is just a test site - if I can get it looking the way it's supposed to I planned on messing with it to have the info needed.
(This is one page only - the rest of the production site will run on the Supply theme)
I was wondering if someone could take a look and figure out where I went wrong, since I know just about nothing about shopify.
Here's the test page: https://gts-test-dev.myshopify.com/pages/test#about
Here's the preview page of what it should look like: https://colorlib.com/demo?theme=creative-agency
Here's my page code - you can see where I attempted to translate it to shopify. All the css, fonts, etc that came with the free design I put in assets.
{% layout 'theme.subscription' %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<title>Title?</title>
<!-- Google font -->
<link href="https://fonts.googleapis.com/css?family=Montserrat:400,700%7CVarela+Round" rel="stylesheet">
{{ 'google-font.css' | asset_url | stylesheet_tag }}
<!-- Bootstrap -->
<link type="text/css" rel="stylesheet" href="css/bootstrap.min.css" />
{{ 'bootstrap.min.css' | asset_url | stylesheet_tag }}
<!-- Owl Carousel -->
<link type="text/css" rel="stylesheet" href="css/owl.carousel.css" />
{{ 'owl.carousel.css' | asset_url | stylesheet_tag }}
<link type="text/css" rel="stylesheet" href="css/owl.theme.default.css" />
{{ 'owl.theme.default.css' | asset_url | stylesheet_tag }}
<!-- Magnific Popup -->
<link type="text/css" rel="stylesheet" href="css/magnific-popup.css" />
{{ 'magnific-popup.css' | asset_url | stylesheet_tag }}
<!-- Font Awesome Icon -->
<link rel="stylesheet" href="css/font-awesome.min.css">
{{ 'font-awesome.min.css' | asset_url | stylesheet_tag }}
<!-- Custom stlylesheet -->
<link type="text/css" rel="stylesheet" href="css/style.css" />
{{ 'style.css' | asset_url | stylesheet_tag }}
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body >
<!-- Header -->
<header id="home">
<!-- Background Image -->
<div class="bg-img"> <img src="https://cdn.shopify.com/s/files/1/2875/3800/t/2/assets/background1.jpg?11898970986288917917"/>
<div class="overlay"></div>
</div>
<!-- /Background Image -->
<!-- Nav -->
<nav id="nav" class="navbar nav-transparent">
<div class="container">
<div class="navbar-header">
<!-- Logo -->
<div class="navbar-brand">
<a href="index.html">
<img class="logo" src="https://cdn.shopify.com/s/files/1/2875/3800/t/2/assets/logo1.png?14440651309315112879" alt="logo">
<img class="logo-alt" src="https://cdn.shopify.com/s/files/1/2875/3800/t/2/assets/logo-alt1.png?14440651309315112879" alt="logo">
</a>
</div>
<!-- /Logo -->
<!-- Collapse nav button -->
<div class="nav-collapse">
<span></span>
</div>
<!-- /Collapse nav button -->
</div>
<!-- Main navigation -->
<ul class="main-nav nav navbar-nav navbar-right">
<li><a href="#home">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#portfolio">Portfolio</a></li>
<li><a href="#service">Services</a></li>
<li><a href="#pricing">Prices</a></li>
<li><a href="#team">Team</a></li>
<li class="has-dropdown"><a href="#blog">Blog</a>
<ul class="dropdown">
<li><a href="blog-single.html">blog post</a></li>
</ul>
</li>
<li><a href="#contact">Contact</a></li>
</ul>
<!-- /Main navigation -->
</div>
</nav>
<!-- /Nav -->
<!-- home wrapper -->
<div class="home-wrapper">
<div class="container">
<div class="row">
<!-- home content -->
<div class="col-md-10 col-md-offset-1">
<div class="home-content">
<h1 class="white-text">Website Title?</h1>
<p class="white-text">Morbi mattis felis at nunc. Duis viverra diam non justo. In nisl. Nullam sit amet magna in magna gravida vehicula. Mauris tincidunt sem sed arcu. Nunc posuere.
</p>
<button class="white-btn">Get Started!</button>
<button class="main-btn">Learn more</button>
</div>
</div>
<!-- /home content -->
</div>
</div>
</div>
<!-- /home wrapper -->
</header>
<!-- /Header -->
<!-- About -->
<div id="about" class="section md-padding">
<!-- Container -->
<div class="container">
<!-- Row -->
<div class="row">
<!-- Section header -->
<div class="section-header text-center">
<h2 class="title">Welcome To The Website</h2>
</div>
<!-- /Section header -->
<!-- about -->
<div class="col-md-4">
<div class="about">
<i class="fa fa-cogs"></i>
<h3>Fully Customizible</h3>
<p>We can change what these say or remove them all together.</p>
<a href="#">Read more</a>
</div>
</div>
<!-- /about -->
<!-- about -->
<div class="col-md-4">
<div class="about">
<i class="fa fa-magic"></i>
<h3>Awesome Features</h3>
<p>There's potential to add other features later.</p>
<a href="#">Read more</a>
</div>
</div>
<!-- /about -->
<!-- about -->
<div class="col-md-4">
<div class="about">
<i class="fa fa-mobile"></i>
<h3>Fully Responsive</h3>
<p>Everything SHOULD work once everything is in place.</p>
<a href="#">Read more</a>
</div>
</div>
<!-- /about -->
</div>
<!-- /Row -->
</div>
<!-- /Container -->
</div>
<!-- /About -->
<!-- Portfolio -->
<div id="portfolio" class="section md-padding bg-grey">
<!-- Container -->
<div class="container">
<!-- Row -->
<div class="row">
<!-- Section header -->
<div class="section-header text-center">
<h2 class="title">Featured Boxes</h2>
</div>
<!-- /Section header -->
<!-- Work -->
<div class="col-md-4 col-xs-6 work">
<img class="img-responsive" src="https://cdn.shopify.com/s/files/1/2875/3800/t/2/assets/work1.jpg?11898970986288917917" alt="">
<div class="overlay"></div>
<div class="work-content">
<span>Category</span>
<h3>These</h3>
<div class="work-link">
<a href="#"><i class="fa fa-external-link"></i></a>
<a class="lightbox" href="./img/work1.jpg"><i class="fa fa-search"></i></a>
</div>
</div>
</div>
<!-- /Work -->
<!-- Work -->
<div class="col-md-4 col-xs-6 work">
<img class="img-responsive" src="https://cdn.shopify.com/s/files/1/2875/3800/t/2/assets/work2.jpg?11898970986288917917" alt="">
<div class="overlay"></div>
<div class="work-content">
<span>Category</span>
<h3>Could</h3>
<div class="work-link">
<a href="#"><i class="fa fa-external-link"></i></a>
<a class="lightbox" href="./img/work2.jpg"><i class="fa fa-search"></i></a>
</div>
</div>
</div>
<!-- /Work -->
<!-- Work -->
<div class="col-md-4 col-xs-6 work">
<img class="img-responsive" src="https://cdn.shopify.com/s/files/1/2875/3800/t/2/assets/work3.jpg?11898970986288917917" alt="">
<div class="overlay"></div>
<div class="work-content">
<span>Category</span>
<h3>Be</h3>
<div class="work-link">
<a href="#"><i class="fa fa-external-link"></i></a>
<a class="lightbox" href="./img/work3.jpg"><i class="fa fa-search"></i></a>
</div>
</div>
</div>
<!-- /Work -->
<!-- Work -->
<div class="col-md-4 col-xs-6 work">
<img class="img-responsive" src="https://cdn.shopify.com/s/files/1/2875/3800/t/2/assets/work4.jpg?11898970986288917917" alt="">
<div class="overlay"></div>
<div class="work-content">
<span>Category</span>
<h3>Different</h3>
<div class="work-link">
<a href="#"><i class="fa fa-external-link"></i></a>
<a class="lightbox" href="./img/work4.jpg"><i class="fa fa-search"></i></a>
</div>
</div>
</div>
<!-- /Work -->
<!-- Work -->
<div class="col-md-4 col-xs-6 work">
<img class="img-responsive" src="https://cdn.shopify.com/s/files/1/2875/3800/t/2/assets/work5.jpg?11898970986288917917" alt="">
<div class="overlay"></div>
<div class="work-content">
<span>Category</span>
<h3>Style</h3>
<div class="work-link">
<a href="#"><i class="fa fa-external-link"></i></a>
<a class="lightbox" href="./img/work5.jpg"><i class="fa fa-search"></i></a>
</div>
</div>
</div>
<!-- /Work -->
<!-- Work -->
<div class="col-md-4 col-xs-6 work">
<img class="img-responsive" src="https://cdn.shopify.com/s/files/1/2875/3800/t/2/assets/work6.jpg?11898970986288917917" alt="">
<div class="overlay"></div>
<div class="work-content">
<span>Category</span>
<h3>Boxes</h3>
<div class="work-link">
<a href="#"><i class="fa fa-external-link"></i></a>
<a class="lightbox" href="./img/work6.jpg"><i class="fa fa-search"></i></a>
</div>
</div>
</div>
<!-- /Work -->
</div>
<!-- /Row -->
</div>
<!-- /Container -->
</div>
<!-- /Portfolio -->
<!-- Service -->
<div id="service" class="section md-padding">
<!-- Container -->
<div class="container">
<!-- Row -->
<div class="row">
<!-- Section header -->
<div class="section-header text-center">
<h2 class="title">What we offer - This will probably be removed</h2>
</div>
<!-- /Section header -->
<!-- service -->
<div class="col-md-4 col-sm-6">
<div class="service">
<i class="fa fa-diamond"></i>
<h3>App Development</h3>
<p>Maecenas tempus tellus eget condimentum rhoncus sem quam semper libero.</p>
</div>
</div>
<!-- /service -->
<!-- service -->
<div class="col-md-4 col-sm-6">
<div class="service">
<i class="fa fa-rocket"></i>
<h3>Graphic Design</h3>
<p>Maecenas tempus tellus eget condimentum rhoncus sem quam semper libero.</p>
</div>
</div>
<!-- /service -->
<!-- service -->
<div class="col-md-4 col-sm-6">
<div class="service">
<i class="fa fa-cogs"></i>
<h3>Creative Idea</h3>
<p>Maecenas tempus tellus eget condimentum rhoncus sem quam semper libero.</p>
</div>
</div>
<!-- /service -->
<!-- service -->
<div class="col-md-4 col-sm-6">
<div class="service">
<i class="fa fa-diamond"></i>
<h3>Marketing</h3>
<p>Maecenas tempus tellus eget condimentum rhoncus sem quam semper libero.</p>
</div>
</div>
<!-- /service -->
<!-- service -->
<div class="col-md-4 col-sm-6">
<div class="service">
<i class="fa fa-pencil"></i>
<h3>Awesome Support</h3>
<p>Maecenas tempus tellus eget condimentum rhoncus sem quam semper libero.</p>
</div>
</div>
<!-- /service -->
<!-- service -->
<div class="col-md-4 col-sm-6">
<div class="service">
<i class="fa fa-flask"></i>
<h3>Brand Design</h3>
<p>Maecenas tempus tellus eget condimentum rhoncus sem quam semper libero.</p>
</div>
</div>
<!-- /service -->
</div>
<!-- /Row -->
</div>
<!-- /Container -->
</div>
<!-- /Service -->
<!-- Why Choose Us -->
<div id="features" class="section md-padding bg-grey">
<!-- Container -->
<div class="container">
<!-- Row -->
<div class="row">
<!-- why choose us content -->
<div class="col-md-6">
<div class="section-header">
<h2 class="title">Why Choose Us - Basically an About Us section</h2>
</div>
<p>Molestie at elementum eu facilisis sed odio. Scelerisque in dictum non consectetur a erat. Aliquam id diam maecenas ultricies mi eget mauris. Ultrices sagittis orci a scelerisque purus.</p>
<div class="feature">
<i class="fa fa-check"></i>
<p>Quis varius quam quisque id diam vel quam elementum.</p>
</div>
<div class="feature">
<i class="fa fa-check"></i>
<p>Mauris augue neque gravida in fermentum.</p>
</div>
<div class="feature">
<i class="fa fa-check"></i>
<p>Orci phasellus egestas tellus rutrum.</p>
</div>
<div class="feature">
<i class="fa fa-check"></i>
<p>Nec feugiat nisl pretium fusce id velit ut tortor pretium.</p>
</div>
</div>
<!-- /why choose us content -->
<!-- About slider -->
<div class="col-md-6">
<div id="about-slider" class="owl-carousel owl-theme">
<img class="img-responsive" src="https://cdn.shopify.com/s/files/1/2875/3800/t/2/assets/about1.jpg?11898970986288917917" alt="">
<img class="img-responsive" src="https://cdn.shopify.com/s/files/1/2875/3800/t/2/assets/about2.jpg?11898970986288917917" alt="">
<img class="img-responsive" src="https://cdn.shopify.com/s/files/1/2875/3800/t/2/assets/about1.jpg?11898970986288917917" alt="">
<img class="img-responsive" src="https://cdn.shopify.com/s/files/1/2875/3800/t/2/assets/about2.jpg?11898970986288917917" alt="">
</div>
<!-- /About slider -->
</div>
<!-- /Row -->
</div>
<!-- /Container -->
</div>
<!-- /Why Choose Us -->
<!-- Numbers -->
<div id="numbers" class="section sm-padding">
<!-- Background Image -->
<div class="bg-img"> <img src="https://cdn.shopify.com/s/files/1/2875/3800/t/2/assets/background2.jpg?11898970986288917917";>
<div class="overlay"></div>
</div>
<!-- /Background Image -->
<!-- Container -->
<div class="container">
<!-- Row -->
<div class="row">
<!-- number -->
<div class="col-sm-3 col-xs-6">
<div class="number">
<i class="fa fa-users"></i>
<h3 class="white-text"><span class="counter">451</span></h3>
<span class="white-text">Happy clients</span>
</div>
</div>
<!-- /number -->
<!-- number -->
<div class="col-sm-3 col-xs-6">
<div class="number">
<i class="fa fa-trophy"></i>
<h3 class="white-text"><span class="counter">12</span></h3>
<span class="white-text">Awards won</span>
</div>
</div>
<!-- /number -->
<!-- number -->
<div class="col-sm-3 col-xs-6">
<div class="number">
<i class="fa fa-coffee"></i>
<h3 class="white-text"><span class="counter">154</span>K</h3>
<span class="white-text">Cups of Coffee</span>
</div>
</div>
<!-- /number -->
<!-- number -->
<div class="col-sm-3 col-xs-6">
<div class="number">
<i class="fa fa-file"></i>
<h3 class="white-text"><span class="counter">45</span></h3>
<span class="white-text">Projects completed</span>
</div>
</div>
<!-- /number -->
</div>
<!-- /Row -->
</div>
<!-- /Container -->
</div>
<!-- /Numbers -->
<!-- Pricing -->
<div id="pricing" class="section md-padding">
<!-- Container -->
<div class="container">
<!-- Row -->
<div class="row">
<!-- Section header -->
<div class="section-header text-center">
<h2 class="title">Pricing Table</h2>
</div>
<!-- /Section header -->
<!-- pricing -->
<div class="col-sm-4">
<div class="pricing">
<div class="price-head">
<span class="price-title">Basic plan</span>
<div class="price">
<h3>$9<span class="duration">/ month</span></h3>
</div>
</div>
<ul class="price-content">
<li>
<p>1GB Disk Space</p>
</li>
<li>
<p>100 Email Account</p>
</li>
<li>
<p>24/24 Support</p>
</li>
</ul>
<div class="price-btn">
<button class="outline-btn">Purchase now</button>
</div>
</div>
</div>
<!-- /pricing -->
<!-- pricing -->
<div class="col-sm-4">
<div class="pricing">
<div class="price-head">
<span class="price-title">Silver plan</span>
<div class="price">
<h3>$19<span class="duration">/ month</span></h3>
</div>
</div>
<ul class="price-content">
<li>
<p>1GB Disk Space</p>
</li>
<li>
<p>100 Email Account</p>
</li>
<li>
<p>24/24 Support</p>
</li>
</ul>
<div class="price-btn">
<button class="outline-btn">Purchase now</button>
</div>
</div>
</div>
<!-- /pricing -->
<!-- pricing -->
<div class="col-sm-4">
<div class="pricing">
<div class="price-head">
<span class="price-title">Gold plan</span>
<div class="price">
<h3>$39<span class="duration">/ month</span></h3>
</div>
</div>
<ul class="price-content">
<li>
<p>1GB Disk Space</p>
</li>
<li>
<p>100 Email Account</p>
</li>
<li>
<p>24/24 Support</p>
</li>
</ul>
<div class="price-btn">
<button class="outline-btn">Purchase now</button>
</div>
</div>
</div>
<!-- /pricing -->
</div>
<!-- Row -->
</div>
<!-- /Container -->
</div>
<!-- /Pricing -->
<!-- Testimonial -->
<div id="testimonial" class="section md-padding">
<!-- Background Image -->
<div class="bg-img" src='https://cdn.shopify.com/s/files/1/2875/3800/t/2/assets/background3.jpg?11898970986288917917';>
<div class="overlay"></div>
</div>
<!-- /Background Image -->
<!-- Container -->
<div class="container">
<!-- Row -->
<div class="row">
<!-- Testimonial slider -->
<div class="col-md-10 col-md-offset-1">
<div id="testimonial-slider" class="owl-carousel owl-theme">
<!-- testimonial -->
<div class="testimonial">
<div class="testimonial-meta">
<img src="https://cdn.shopify.com/s/files/1/2875/3800/t/2/assets/perso1.jpg?11898970986288917917" alt="">
<h3 class="white-text">John Doe</h3>
<span>Web Designer</span>
</div>
<p class="white-text">Molestie at elementum eu facilisis sed odio. Scelerisque in dictum non consectetur a erat. Aliquam id diam maecenas ultricies mi eget mauris.</p>
</div>
<!-- /testimonial -->
<!-- testimonial -->
<div class="testimonial">
<div class="testimonial-meta">
<img src="https://cdn.shopify.com/s/files/1/2875/3800/t/2/assets/perso2.jpg?11898970986288917917" alt="">
<h3 class="white-text">John Doe</h3>
<span>Web Designer</span>
</div>
<p class="white-text">Molestie at elementum eu facilisis sed odio. Scelerisque in dictum non consectetur a erat. Aliquam id diam maecenas ultricies mi eget mauris.</p>
</div>
<!-- /testimonial -->
</div>
</div>
<!-- /Testimonial slider -->
</div>
<!-- /Row -->
</div>
<!-- /Container -->
</div>
<!-- /Testimonial -->
<!-- Team -->
<div id="team" class="section md-padding">
<!-- Container -->
<div class="container">
<!-- Row -->
<div class="row">
<!-- Section header -->
<div class="section-header text-center">
<h2 class="title">Our Team</h2>
</div>
<!-- /Section header -->
<!-- team -->
<div class="col-sm-4">
<div class="team">
<div class="team-img">
<img class="img-responsive" src="https://cdn.shopify.com/s/files/1/2875/3800/t/2/assets/team1.jpg?11898970986288917917" alt="">
<div class="overlay">
<div class="team-social">
<a href="#"><i class="fa fa-facebook"></i></a>
<a href="#"><i class="fa fa-google-plus"></i></a>
<a href="#"><i class="fa fa-twitter"></i></a>
</div>
</div>
</div>
<div class="team-content">
<h3>John Doe</h3>
<span>Web Designer</span>
</div>
</div>
</div>
<!-- /team -->
<!-- team -->
<div class="col-sm-4">
<div class="team">
<div class="team-img">
<img class="img-responsive" src="https://cdn.shopify.com/s/files/1/2875/3800/t/2/assets/team2.jpg?11898970986288917917" alt="">
<div class="overlay">
<div class="team-social">
<a href="#"><i class="fa fa-facebook"></i></a>
<a href="#"><i class="fa fa-google-plus"></i></a>
<a href="#"><i class="fa fa-twitter"></i></a>
</div>
</div>
</div>
<div class="team-content">
<h3>John Doe</h3>
<span>Web Designer</span>
</div>
</div>
</div>
<!-- /team -->
<!-- team -->
<div class="col-sm-4">
<div class="team">
<div class="team-img">
<img class="img-responsive" src="https://cdn.shopify.com/s/files/1/2875/3800/t/2/assets/team3.jpg?11898970986288917917" alt="">
<div class="overlay">
<div class="team-social">
<a href="#"><i class="fa fa-facebook"></i></a>
<a href="#"><i class="fa fa-google-plus"></i></a>
<a href="#"><i class="fa fa-twitter"></i></a>
</div>
</div>
</div>
<div class="team-content">
<h3>John Doe</h3>
<span>Web Designer</span>
</div>
</div>
</div>
<!-- /team -->
</div>
<!-- /Row -->
</div>
<!-- /Container -->
</div>
<!-- /Team -->
<!-- Blog -->
<div id="blog" class="section md-padding bg-grey">
<!-- Container -->
<div class="container">
<!-- Row -->
<div class="row">
<!-- Section header -->
<div class="section-header text-center">
<h2 class="title">Recents news</h2>
</div>
<!-- /Section header -->
<!-- blog -->
<div class="col-md-4">
<div class="blog">
<div class="blog-img">
<img class="img-responsive" src="https://cdn.shopify.com/s/files/1/2875/3800/t/2/assets/blog1.jpg?11898970986288917917" alt="">
</div>
<div class="blog-content">
<ul class="blog-meta">
<li><i class="fa fa-user"></i>John doe</li>
<li><i class="fa fa-clock-o"></i>18 Oct</li>
<li><i class="fa fa-comments"></i>57</li>
</ul>
<h3>Molestie at elementum eu facilisis sed odio</h3>
<p>Nec feugiat nisl pretium fusce id velit ut tortor pretium. Nisl purus in mollis nunc sed. Nunc non blandit massa enim nec.</p>
<a href="blog-single.html">Read more</a>
</div>
</div>
</div>
<!-- /blog -->
<!-- blog -->
<div class="col-md-4">
<div class="blog">
<div class="blog-img">
<img class="img-responsive" src="https://cdn.shopify.com/s/files/1/2875/3800/t/2/assets/blog2.jpg?11898970986288917917" alt="">
</div>
<div class="blog-content">
<ul class="blog-meta">
<li><i class="fa fa-user"></i>John doe</li>
<li><i class="fa fa-clock-o"></i>18 Oct</li>
<li><i class="fa fa-comments"></i>57</li>
</ul>
<h3>Molestie at elementum eu facilisis sed odio</h3>
<p>Nec feugiat nisl pretium fusce id velit ut tortor pretium. Nisl purus in mollis nunc sed. Nunc non blandit massa enim nec.</p>
<a href="blog-single.html">Read more</a>
</div>
</div>
</div>
<!-- /blog -->
<!-- blog -->
<div class="col-md-4">
<div class="blog">
<div class="blog-img">
<img class="img-responsive" src="https://cdn.shopify.com/s/files/1/2875/3800/t/2/assets/blog3.jpg?11898970986288917917" alt="">
</div>
<div class="blog-content">
<ul class="blog-meta">
<li><i class="fa fa-user"></i>John doe</li>
<li><i class="fa fa-clock-o"></i>18 Oct</li>
<li><i class="fa fa-comments"></i>57</li>
</ul>
<h3>Molestie at elementum eu facilisis sed odio</h3>
<p>Nec feugiat nisl pretium fusce id velit ut tortor pretium. Nisl purus in mollis nunc sed. Nunc non blandit massa enim nec.</p>
<a href="blog-single.html">Read more</a>
</div>
</div>
</div>
<!-- /blog -->
</div>
<!-- /Row -->
</div>
<!-- /Container -->
</div>
<!-- /Blog -->
<!-- Contact -->
<div id="contact" class="section md-padding">
<!-- Container -->
<div class="container">
<!-- Row -->
<div class="row">
<!-- Section-header -->
<div class="section-header text-center">
<h2 class="title">Get in touch</h2>
</div>
<!-- /Section-header -->
<!-- contact -->
<div class="col-sm-4">
<div class="contact">
<i class="fa fa-phone"></i>
<h3>Phone</h3>
<p>512-421-3940</p>
</div>
</div>
<!-- /contact -->
<!-- contact -->
<div class="col-sm-4">
<div class="contact">
<i class="fa fa-envelope"></i>
<h3>Email</h3>
<p>email@support.com</p>
</div>
</div>
<!-- /contact -->
<!-- contact -->
<div class="col-sm-4">
<div class="contact">
<i class="fa fa-map-marker"></i>
<h3>Address</h3>
<p>1739 Temp Address Drive</p>
</div>
</div>
<!-- /contact -->
<!-- contact form -->
<div class="col-md-8 col-md-offset-2">
<form class="contact-form">
<input type="text" class="input" placeholder="Name">
<input type="email" class="input" placeholder="Email">
<input type="text" class="input" placeholder="Subject">
<textarea class="input" placeholder="Message"></textarea>
<button class="main-btn">Send message</button>
</form>
</div>
<!-- /contact form -->
</div>
<!-- /Row -->
</div>
<!-- /Container -->
</div>
<!-- /Contact -->
<!-- Footer -->
<footer id="footer" class="sm-padding bg-dark">
<!-- Container -->
<div class="container">
<!-- Row -->
<div class="row">
<div class="col-md-12">
<!-- footer logo -->
<div class="footer-logo">
<a href="index.html"><img src="https://cdn.shopify.com/s/files/1/2875/3800/t/2/assets/logo-alt1.png?11898970986288917917" alt="logo"></a>
</div>
<!-- /footer logo -->
<!-- footer follow -->
<ul class="footer-follow">
<li><a href="#"><i class="fa fa-facebook"></i></a></li>
<li><a href="#"><i class="fa fa-twitter"></i></a></li>
<li><a href="#"><i class="fa fa-google-plus"></i></a></li>
<li><a href="#"><i class="fa fa-instagram"></i></a></li>
<li><a href="#"><i class="fa fa-linkedin"></i></a></li>
<li><a href="#"><i class="fa fa-youtube"></i></a></li>
</ul>
<!-- /footer follow -->
<!-- footer copyright -->
<div class="footer-copyright">
<p>Copyright © 2017. All Rights Reserved. Designed by <a href="https://colorlib.com" target="_blank">Colorlib</a></p>
</div>
<!-- /footer copyright -->
</div>
</div>
<!-- /Row -->
</div>
<!-- /Container -->
</footer>
<!-- /Footer -->
<!-- Back to top -->
<div id="back-to-top"></div>
<!-- /Back to top -->
<!-- jQuery Plugins -->
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/owl.carousel.min.js"></script>
<script type="text/javascript" src="js/jquery.magnific-popup.js"></script>
<script type="text/javascript" src="js/main.js"></script>
</body>
</html>
Thoughts?
Shopify Discussion
Partners and Developers
