New Template making junk pages
I am an automotive technician. I have been using Dreamweaver to make websites for my shops since Dreamweaver 3. I am currently running the newest version on my pc. I created a Template which looks pretty nice. I based it off of my index page at http://gallatinautorepairs.com. The template looks good and shows no html errors in Dreamweaver. When I attempt to make a new page from the template i get an error message, "error on line 2 unbalanced instance begin tag". Several tags are missing from the end of the document (</div></div></section></main></body></html>) I have checked every tag in the template and they are all balanced. The only thing that I am doing differently in this template that I have never done before is that I am using optional editable regions. I have tried both with and without the schema declaration in the html. ( I used the schema declarations in my last template with no issues). Here is the template html:
<!DOCTYPE html>
<html itemscope itemtype="http://schema.org/AutoRepair" lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="../css/components.css">
<link rel="stylesheet" href="../css/icons.css">
<link rel="stylesheet" href="../css/responsee.css">
<link rel="stylesheet" href="../owl-carousel/owl.carousel.css">
<link rel="stylesheet" href="../owl-carousel/owl.theme.css">
<link rel="stylesheet" href="../css/lightcase.css">
<!-- CUSTOM STYLE -->
<link rel="stylesheet" href="../css/template-style.css">
<link href="https://fonts.googleapis.com/css?family=Poppins:100,200,300,400,700,900&subset=latin-ext" rel="stylesheet">
<script type="text/javascript" src="../js/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="../js/jquery-ui.min.js"></script>
<!-- TemplateBeginEditable name="Meta_Info" -->
<title>Welcome to Rockridge Automotive Repair</title>
<meta name="description" content="Rockbridge Automotive does quality automotive repair and service in Bethpage Tennessee">
<meta name="keywords" content="Gallatin, auto repair, portland, bethpage, brakes, oil change, auto restoration, castillion springs">
<!-- TemplateEndEditable -->
<!-- TemplateParam name="Optional_Subject_Photo" type="boolean" value="true" -->
<!-- TemplateParam name="Optional_Picture_2" type="boolean" value="true" -->
</head>
<body class="size-1280">
<!-- HEADER -->
<header role="banner" class="position-absolute">
<!-- Top Navigation -->
<nav class="background-transparent background-primary-dott full-width sticky">
<div class="top-nav">
<!-- mobile version logo -->
<div class="logo hide-l hide-xl hide-xxl">
<a href="../index.html" class="logo">
<!-- Logo White Version -->
<img class="logo-white" src="../img/logo.svg" alt="">
<!-- Logo Dark Version -->
<img class="logo-dark" src="../img/wrench-and-screwdriver.png" alt="">
</a>
</div>
<p class="nav-text"></p>
<!-- left menu items -->
<div class="top-nav left-menu">
<ul class="right top-ul chevron">
<li><a href="../index.html">Home</a></li>
<li><a href="../about-us.html">About Us</a></li>
<li><a href="../services.html">Our Services</a></li>
</ul>
</div>
<!-- logo -->
<ul class="logo-menu">
<a href="../index.html" class="logo">
<!-- Logo White Version -->
<img class="logo-white" src="../img/wrench-and-screwdriver.png" alt="">
<!-- Logo Dark Version -->
<img class="logo-dark" src="../img/wrench-and-screwdriver.png" alt="">
</a>
</ul>
<!-- right menu items -->
<div class="top-nav right-menu">
<ul class="top-ul chevron">
<li>
<a>Products</a>
<ul>
<li><a>Product 1</a></li>
<li><a>Product 2</a></li>
</ul>
</li>
<li><a href="../gallery.html">Gallery</a></li>
<li><a href="../contact.html">Contact</a></li>
</ul>
</div>
</div>
</nav>
</header>
<!-- MAIN -->
<main role="main">
<!-- Header -->
<header class="section-top-padding background-image text-center" style="background-image:url(../img/img-05.jpg)">
<h1 class="text-extra-thin text-white text-s-size-30 text-m-size-40 text-size-50 text-line-height-1 margin-bottom-40 margin-top-130">
Rockbridge Automotive
</h1>
<!-- TemplateBeginEditable name="Page_Title" -->
<h2 class="text-extra-thin text-white text-s-size-30 text-m-size-30 text-size-30 text-line-height-1 margin-bottom-40">
Auto Repair Facility In Gallatin TN
</h2>
<!-- TemplateEndEditable -->
<!-- TemplateBeginEditable name="Page_Description" -->
<h3>Page_Description</h3>
<!-- TemplateEndEditable -->
<!-- TemplateBeginEditable name="Page_Text" -->
<p class="text-white">Some text</p>
<p class="text-white"> more text and <a class="text-primary-hover" href="../services.html"> services link</a></p>
<!-- TemplateEndEditable -->
<i class="slow icon-sli-arrow-down text-white margin-top-20 text-size-16"></i>
<!-- Image -->
<!-- TemplateBeginIf cond="Optional_Subject_Photo" -->Optional_Subject_Photo
<img class="margin-top-20 center" src="../img/cars/2015-challenger.jpg" alt="">
<!-- TemplateEndIf -->
<!-- dark full width arrow object -->
<img class="arrow-object" src="../img/arrow-object-dark.svg" alt="">
</header>
<!-- Section 1 -->
<section class="section-small-padding background-dark text-center">
<div class="line">
<div class="m-10 l-6 xl-4 center">
<div class="margin">
<a class="s-12 m-6 margin-s-bottom" href="/">
<img class="full-img right" src="../img/ase-certified.png" alt="">
</a>
<a class="s-12 m-6" href="/">
<img class="full-img" src="../img/MACS_bevel_logo-small.gif" alt="">
</a>
</div>
</div>
</div>
</section>
<!-- Section 4 -->
<section class="background-primary full-width">
<div class="m-12 l-6 xl-5 xxl-4">
<!-- TemplateBeginIf cond="Optional_Picture_2" -->Optional_Picture_2
<img class="full-img" src="../img/engines/67-nascar-dodge-hemi-with-dual-carb.jpg"/>
<!-- TemplateEndIf -->
</div>
<div class="m-12 l-6 xl-7 xxl-8">
<div class="l-12 xl-11 xxl-8 padding-2x">
<!-- TemplateBeginIf cond="Optional_Text_2" -->
<h2 class="text-l-size-40 text-size-30 text-white">We Service <b>Old Or New</b></h2>
<p class="margin-bottom">We enjoy repairing the cars and equipment from the old days like this killer Dodge Hemi engine but I love the fuel injected, supercharged monster that we get in the shop today as well. I love the shreaking sound of four cylinder motors, (especially motorcycles) but I love the deep thump of a V-twin, a V-8 or V-10 engine. I dig turbocharged and supercharged engines. I love two strokes. I guess I am just a gear-head!</p>
<!-- white Start your Business object -->
<img class="margin-left-20 margin-top-30 margin-bottom-60" src="../img/start-your-business.svg" alt="">
<!-- TemplateEndIf -->
</div>
</div>
</section>
<!-- Section 5 -->
<section class="section-small-padding background-grey">
<div class="margin2x">
<div class="m-6 l-1">
<img class="margin-bottom" src="../img/logos/ford-logo.jpg"/>
</div>
<div class="m-6 l-1">
<img class="margin-bottom" src="../img/logos/Chevrolet-Logo.jpg"/>
</div>
<div class="m-6 l-1">
<img class="margin-bottom" src="../img/logos/Buick-Logo.jpg"/>
</div>
<div class="m-6 l-1">
<img class="margin-bottom" src="../img/logos/Chrysler-Logo (1).jpg"/>
</div>
<div class="m-6 l-1">
<img class="margin-bottom" src="../img/logos/honda-logo.jpg"/>
</div>
<div class="m-6 l-1">
<img class="margin-bottom" src="../img/logos/toyota-logo1.jpg"/>
</div>
<div class="m-6 l-1">
<img class="margin-bottom" src="../img/logos/nissan-logo.jpg"/>
</div>
<div class="m-6 l-1">
<img class="margin-bottom" src="../img/logos/Jeep-Logo.jpg"/>
</div>
<div class="m-6 l-1">
<img class="margin-bottom" src="../img/logos/Infiniti-Logo (1).jpg"/>
</div>
<div class="m-6 l-1">
<img class="margin-bottom" src="../img/logos/lexus-logo.jpg"/>
</div>
<div class="m-6 l-1">
<img class="margin-bottom" src="../img/logos/mazda-logo (1).jpg"/>
</div>
<div class="m-6 l-1">
<img class="margin-bottom" src="../img/logos/RAM-Logo.jpg"/>
</div>
</div>
</section>
<!-- Section 7 -->
<section class="section-small-padding background-dark text-center">
<div class="line">
<h2 class="text-white text-size-50 text-m-size-40 margin-bottom-20">Quality Auto Repair </h2>
<div class="m-10 l-6 xl-4 center">
<div class="margin">
<a class="s-12 m-6 margin-s-bottom" href="/">
</a>
<a class="s-12 m-6" href="/">
</a>
</div>
</div>
</div>
</section>
</main>
<!-- FOOTER -->
<footer>
<!-- Social -->
<div class="background-primary padding text-center">
<a href="/"><i class="icon-facebook_circle text-size-25 text-dark"></i></a>
<a href="/"><i class="icon-twitter_circle text-size-25 text-dark"></i></a>
<a href="/"><i class="icon-google_plus_circle text-size-25 text-dark"></i></a>
<a href="/"><i class="icon-instagram_circle text-size-25 text-dark"></i></a>
<a href="/"><i class="icon-linked_in_circle text-size-25 text-dark"></i></a>
</div>
<!-- Main Footer -->
<section class="section background-dark">
<div class="line">
<div class="margin2x">
<div class="s-12 m-6 l-3 xl-5">
<h4 class="text-white text-strong">Our Mission</h4>
<p>
<b class="text-size-20">Reliable friendly Service!</b> We strive to give our clients the best auto repair service in Sumner County. We provide <b class="text-size-20">Christian Automotive Repairs</b>, because we have to answer to a much higher authority.
</p>
</div>
<div class="s-12 m-6 l-3 xl-2">
<h4 class="text-white text-strong margin-m-top-30">Useful Links</h4>
<a class="text-primary-hover" href="../page.html">FAQ</a><br>
<a class="text-primary-hover" href="../contact.html">Contact Us</a><br>
<a class="text-primary-hover" href="../blog.html">Blog</a>
</div>
<div class="s-12 m-6 l-3 xl-2">
<h4 class="text-white text-strong margin-m-top-30">Term of Use</h4>
<a class="text-primary-hover" href="../page.html">Terms and Conditions</a><br>
<a class="text-primary-hover" href="../page.html">Refund Policy</a><br>
<a class="text-primary-hover" href="../page.html">Disclaimer</a>
</div>
<div itemscope itemtype="http://schema.org/AutoRepair" class="s-12 m-6 l-3 xl-3">
<h4 class="text-white text-strong margin-m-top-30">Contact Us</h4>
<a class="text-primary-hover" href="mailto:info@gallatinautorepairs.com"><i class="icon-sli-mouse text-primary"></i> info@gallatinautorepairs</a><br>
<p><i class="icon-sli-screen-smartphone text-primary"></i>
<span itemprop="telephone"> 615-946-2079</span></p>
<i class="icon-mail text-primary"></i><span itemprop="streetAddress"> 105 Red Tuttle Road</span><br>
<i class="icon-home text-primary"></i><span itemprop="addressLocality"> Bethpage</span>,
<span itemprop="addressRegion">TN</span>
<span itemprop="postalCode">37022</span>
</div>
</div>
</div>
</section>
<div class="background-dark">
<div class="line">
<hr class="break margin-top-bottom-0" style="border-color: #777;">
</div>
</div>
<!-- Bottom Footer -->
<section class="padding-2x background-dark full-width">
<div class="line">
<div class="s-12 l-6">
<p class="text-size-12">©Copyright 2018, Rockbridge Automotive</p>
<p class="text-size-12">I would like to thank the designers at <a class="text-primary-hover" href="https://signup.graphicszoo.com/get-started/">Graphic Zoo</a> for this website design.</p>
</div>
<div class="s-12 l-6">
<a class="right text-size-12 text-primary-hover" href="http://www.myresponsee.com" title="Responsee - lightweight responsive framework">Design and coding<br> by Responsee Team</a>
</div>
</div>
</section>
</footer>
<script type="text/javascript" src="../js/responsee.js"></script>
<script type="text/javascript" src="../owl-carousel/owl.carousel.js"></script>
<script type="text/javascript" src="../js/template-scripts.js"></script>
</body>
</html>
Here is what is generated when i attempt to make a new page from it:
<!DOCTYPE html>
<html itemscope itemtype="http://schema.org/AutoRepair" lang="en"><!-- InstanceBegin template="/Templates/index.dwt" codeOutsideHTMLIsLocked="false" -->
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="css/components.css">
<link rel="stylesheet" href="css/icons.css">
<link rel="stylesheet" href="css/responsee.css">
<link rel="stylesheet" href="owl-carousel/owl.carousel.css">
<link rel="stylesheet" href="owl-carousel/owl.theme.css">
<link rel="stylesheet" href="css/lightcase.css">
<!-- CUSTOM STYLE -->
<link rel="stylesheet" href="css/template-style.css">
<link href="https://fonts.googleapis.com/css?family=Poppins:100,200,300,400,700,900&subset=latin-ext" rel="stylesheet">
<script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="js/jquery-ui.min.js"></script>
<!-- InstanceBeginEditable name="Meta_Info" -->
<title>Welcome to Rockridge Automotive Repair</title>
<meta name="description" content="Rockbridge Automotive does quality automotive repair and service in Bethpage Tennessee">
<meta name="keywords" content="Gallatin, auto repair, portland, bethpage, brakes, oil change, auto restoration, castillion springs">
<!-- InstanceEndEditable -->
<!-- InstanceParam name="Optional_Subject_Photo" type="boolean" value="true" -->
<!-- InstanceParam name="Optional_Picture_2" type="boolean" value="true" -->
</head>
<body class="size-1280">
<!-- HEADER -->
<header role="banner" class="position-absolute">
<!-- Top Navigation -->
<nav class="background-transparent background-primary-dott full-width sticky">
<div class="top-nav">
<!-- mobile version logo -->
<div class="logo hide-l hide-xl hide-xxl">
<a href="index.html" class="logo">
<!-- Logo White Version -->
<img class="logo-white" src="img/logo.svg" alt="">
<!-- Logo Dark Version -->
<img class="logo-dark" src="img/wrench-and-screwdriver.png" alt="">
</a>
</div>
<p class="nav-text"></p>
<!-- left menu items -->
<div class="top-nav left-menu">
<ul class="right top-ul chevron">
<li><a href="index.html">Home</a></li>
<li><a href="about-us.html">About Us</a></li>
<li><a href="services.html">Our Services</a></li>
</ul>
</div>
<!-- logo -->
<ul class="logo-menu">
<a href="index.html" class="logo">
<!-- Logo White Version -->
<img class="logo-white" src="img/wrench-and-screwdriver.png" alt="">
<!-- Logo Dark Version -->
<img class="logo-dark" src="img/wrench-and-screwdriver.png" alt="">
</a>
</ul>
<!-- right menu items -->
<div class="top-nav right-menu">
<ul class="top-ul chevron">
<li>
<a>Products</a>
<ul>
<li><a>Product 1</a></li>
<li><a>Product 2</a></li>
</ul>
</li>
<li><a href="gallery.html">Gallery</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</div>
</div>
</nav>
</header>
<!-- MAIN -->
<main role="main">
<!-- Header -->
<header class="section-top-padding background-image text-center" style="background-image:url(img/img-05.jpg)">
<h1 class="text-extra-thin text-white text-s-size-30 text-m-size-40 text-size-50 text-line-height-1 margin-bottom-40 margin-top-130">
Rockbridge Automotive
</h1>
<!-- InstanceBeginEditable name="Page_Title" -->
<h2 class="text-extra-thin text-white text-s-size-30 text-m-size-30 text-size-30 text-line-height-1 margin-bottom-40">
Auto Repair Facility In Gallatin TN
</h2>
<!-- InstanceEndEditable -->
<!-- InstanceBeginEditable name="Page_Description" -->
<h3>Page_Description</h3>
<!-- InstanceEndEditable -->
<!-- InstanceBeginEditable name="Page_Text" -->
<p class="text-white">Some text</p>
<p class="text-white"> more text and <a class="text-primary-hover" href="services.html"> services link</a></p>
<!-- InstanceEndEditable -->
<i class="slow icon-sli-arrow-down text-white margin-top-20 text-size-16"></i>
<!-- Image -->
Optional_Subject_Photo
<img class="margin-top-20 center" src="img/cars/2015-challenger.jpg" alt="">
<!-- dark full width arrow object -->
<img class="arrow-object" src="img/arrow-object-dark.svg" alt="">
</header>
<!-- Section 1 -->
<section class="section-small-padding background-dark text-center">
<div class="line">
<div class="m-10 l-6 xl-4 center">
<div class="margin">
<a class="s-12 m-6 margin-s-bottom" href="/">
<img class="full-img right" src="img/ase-certified.png" alt="">
</a>
<a class="s-12 m-6" href="/">
<img class="full-img" src="img/MACS_bevel_logo-small.gif" alt="">
</a>
</div>
</div>
</div>
</section>
<!-- Section 4 -->
<section class="background-primary full-width">
<div class="m-12 l-6 xl-5 xxl-4">
Optional_Picture_2
<img class="full-img" src="img/engines/67-nascar-dodge-hemi-with-dual-carb.jpg"/>
</div>
<div class="m-12 l-6 xl-7 xxl-8">
<div class="l-12 xl-11 xxl-8 padding-2x">
_____________________________________________________________________________________________________
As You can see the html is incomplete. I am clueless as to what could be wrong. Because automotive repair has many facets I have about 77 pages ready for the template. I have been stuck here for several days and i fear that moving forward with the website will have me not being able to make site-wide changes easily like i have in the past. My new shop is due to open up in less than a month and I was really hoping to get some placement in Google before the shop opens. Any help would be greatly appreciated as i have several technicians that are depending on me getting this shop off of the ground so that they can feed their families.
