--- /dev/null
+body {
+ margin: 0;
+ padding: 0;
+ font-family: arial, sans-serif;
+ font-size: 13px;
+ text-align: center;
+ color: #000;
+ background: url(assets/bg_body.jpg) repeat-y #fff center top;
+}
+
+h1, h2, h3, h4, h5 {
+ color: #000;
+ margin: 0 0 6px 0;
+}
+
+h1 { font-size: 18px; }
+h2 { font-size: 16px; }
+h3 { font-size: 13px; }
+h4, h5 { font-size: 12px; }
+p { margin: 0 0 6px 0; }
+
+a:link {
+ color: #bb702e;
+ text-decoration: none;
+ font-weight: bold;
+}
+
+a:visited { color: #bb702e; }
+a:hover { color: #338759; }
+a:active { color: #bb702e; }
+
+img {
+ border: 0;
+ margin: 0;
+ padding: 0;
+ display: block;
+}
+
+#headerwrap {
+ height: 230px;
+ background: url(assets/bg_header.jpg) #fff no-repeat center top;
+}
+
+#header, #mainnav {
+ width: 990px;
+ margin: auto;
+}
+
+#header {
+ height: 166px;
+ text-align: left;
+}
+
+#header div {
+ float: left;
+ display: inline;
+ height: 180px;
+ text-indent: -9000px;
+}
+
+#puremich {
+ width: 173px;
+ background: url(assets/header-pieces.jpg) no-repeat -266px;
+}
+
+#logo a, #reservations a {
+ height: 180px;
+ display: block;
+ background: url(assets/header-pieces.jpg) no-repeat;
+}
+
+#logo a {
+ width: 267px;
+ margin-left: 115px;
+}
+
+#reservations a {
+ width: 212px;
+ background-position: -660px 0;
+ margin-left: 223px;
+}
+
+#reservations a:hover { background-position: -442px 0; }
+
+#mainnav {
+ padding: 0px;
+ background-color: transparent;
+}
+
+#centeredmenu {
+ float: left;
+ width: 100%;
+ overflow: hidden;
+ position: relative;
+}
+
+#centeredmenu ul {
+ clear: left;
+ float: left;
+ list-style: none;
+ margin: 0;
+ padding: 0;
+ position: relative;
+ left: 50%;
+ text-align: center;
+}
+
+#centeredmenu ul li {
+ display: block;
+ float: left;
+ list-style: none;
+ margin: 0;
+ padding: 0;
+ position: relative;
+ right: 50%;
+}
+
+#centeredmenu ul li a {
+ display: block;
+ margin-top: 10px;
+ padding: 3px 10px;
+ color: #ecc38a;
+ text-decoration: none;
+ line-height: 1.3em;
+ font-weight: bold;
+}
+
+#centeredmenu ul li a:hover { color: #d48e45; }
+
+#centeredmenu ul li a.active,
+#centeredmenu ul li a.active:hover {
+ color: #d48e45;
+ font-weight: bold;
+}
+
+#contentwrap {
+ width: 990px;
+ margin: 0 auto;
+ text-align: justify;
+ background: url(assets/bg_content.gif) #fff repeat-y;
+ height: 1%;
+ overflow: hidden;
+ clear: both;
+}
+
+#rightcol, #leftcol, #content, #content-home {
+ float: left;
+ display: inline;
+}
+
+#leftcol { width: 220px; }
+#content { width: 770px; }
+#content, #content-home { padding-bottom: 30px; }
+#content-home { margin-right: 20px; width: 750px; }
+#rightcol {
+ background: url(assets/shadow-h.jpg) repeat-y;
+ margin-top: 30px;
+ text-indent: -1000px;
+}
+
+/*feature boxes*/
+#specials, #enews, #video, #facebook, #blog { margin-bottom: 20px;
+ margin-left: 3px;}
+#specials a, #enews a, #video a, #facebook a, #blog a{
+ width: 217px;
+ display: block;
+ line-height: 15px;
+ height: 53px;
+ background: url(assets/bg_matrix.gif) no-repeat transparent;
+}
+
+#specials a { background-position: -771px -345px; }
+#specials a:hover { background-position: -551px -345px; }
+#enews a { background-position: -771px -398px; }
+#enews a:hover { background-position: -551px -398px; }
+#video a { background-position: -771px -453px; }
+#video a:hover { background-position: -551px -453px; }
+#facebook a { background-position: -771px -508px; }
+#facebook a:hover { background-position: -551px -508px; }
+#blog a { background-position: -771px -561px; }
+#blog a:hover { background-position: -551px -561px; }
+
+div#leftcol #features {background: url(assets/shadow.jpg) repeat-y; text-indent: -1000px;}
+div#leftcol #specials, div#leftcol #enews, div#leftcol #video, div#leftcol #facebook, div#leftcol #blog {
+ margin-bottom: 5px;
+ margin-left: 0;}
+div#leftcol #specials a, div#leftcol #enews a, div#leftcol #video a, div#leftcol #facebook a, div#leftcol #blog a {width: 180px; height: 52px;}
+
+div#leftcol #specials a { background-position: -4px -340px; }
+div#leftcol #specials a:hover { background-position: -188px -340px; }
+div#leftcol #enews a { background-position: -4px -392px; }
+div#leftcol #enews a:hover { background-position: -188px -392px; }
+div#leftcol #video a { background-position: -4px -449px; }
+div#leftcol #video a:hover { background-position: -188px -449px; }
+div#leftcol #facebook a { background-position: -4px -505px; }
+div#leftcol #facebook a:hover { background-position: -188px -505px; }
+div#leftcol #blog a { background-position: -4px -558px; }
+div#leftcol #blog a:hover { background-position: -188px -558px; }
+/*end feature boxes */
+
+/* sublevel */
+#subnavwrapper a {font-weight: bold; color: #043261;}
+#pagetitle {
+ width: 180px;
+ text-align: center;
+ background: url(assets/bg_matrix.gif) no-repeat -745px -10px;
+}
+#pagetitle a {
+ display: block;
+ padding: 15px 0 5px 0;
+ font-size: 14px;
+ text-decoration: none;
+}
+#pagetitlebot {
+ height: 18px;
+ background: url(assets/bg_matrix.gif) no-repeat -745px -103px;
+}
+#sublevel {
+ padding: 0 0 5px 0;
+ margin: 0 0 0 10px;
+ width: 160px;
+}
+
+#sublevel li {
+ list-style: none;
+ margin: 0;
+ padding: 5px 0 3px 10px;
+ border-bottom: 1px solid #d57e01;
+}
+
+#sublevel a {
+ text-decoration: none;
+}
+
+#sublevel li a:hover { color: #f8b818; }
+
+/* sub sub nav */
+#sublevel ul {
+ padding: 0px;
+ margin: 0;
+ border-bottom: 0;
+}
+
+#sublevel ul li {
+ border-bottom: 0;
+ padding: 4px 0 2px 10px;
+ background: url(assets/bg_matrix.gif) no-repeat -745px -123px;
+}
+
+#sublevel ul li a {color: #a97738; }
+
+/* end sublevel */
+
+
+/* roating images */
+#rotating {
+ background: url(assets/bg_matrix.gif) no-repeat 0 0;
+ width: 650px;
+ margin: 0;
+ padding: 28px 0 0 90px;
+ height: 290px;
+ text-align: left;
+}
+
+#slideshow {
+ float: left;
+ text-align: left;
+ width: 550px;
+ height: 253px;
+ margin: 0;
+ padding: 0;
+ display: block;
+ list-style-type: none;
+}
+
+/* what's new */
+#whatsnew {
+ background: url(assets/bg_matrix.gif) no-repeat -25px -630px;
+ padding: 80px 0 0 0px;
+ color: #000;
+ font-size: 12px;
+ text-align: justify;
+ line-height: 15px;
+ width: 750px;
+}
+
+#whatsnew a { text-decoration: none; }
+
+.readmore {
+ display: block;
+ text-transform: uppercase;
+ font-size: 11px;
+}
+
+#whatsnew h3 {
+ font-weight: bold;
+ color: #13467a;
+ padding: 2px 0;
+}
+
+#whatsnew .row {
+ width: 750px;
+ clear: both;
+ margin-bottom: 20px;
+}
+
+#whatsnew img {
+ margin: 0 10px 0 0;
+ padding-bottom: 2px;
+ float: left;
+}
+
+#whatsnew .one, #whatsnew .two {
+ width: 320px;
+ position: relative;
+ margin-bottom: 20px;
+ padding-top: 12px;
+}
+
+#whatsnew .one {
+ float: left;
+ margin-left: 10px;
+}
+
+#whatsnew .two {
+ float: right;
+ margin-left: 30px;
+}
+
+/* end harbor whatsnew */
+/* TOOLBOX */
+#toolbox { }
+
+#breadcrumb {
+ font-size: 10px;
+ font-weight: bold;
+ text-transform: uppercase;
+ color: #bb702e;
+ margin-bottom: 20px;
+}
+
+#breadcrumb a { text-decoration: underline; }
+#breadcrumb a:hover { color: #02203e; }
+#breadcrumb .current { color: #02203e; }
+#category { margin-bottom: 20px; }
+
+.listing {
+ clear: both;
+ margin: 15px 0;
+}
+
+.imageright img, .imageleft img { border: 1px solid #bb702e; }
+
+.imageright {
+ float: right;
+ position: relative;
+ margin: 0 0 8px 15px;
+}
+
+.imageleft {
+ float: left;
+ position: relative;
+ margin: 0 15px 8px 0;
+}
+
+.imagecaption {
+ font-size: 11px;
+ padding-bottom: 10px;
+ margin: 3px 0 15px 0;
+ color: #338556;
+ background: url(assets/bg_matrix.gif) no-repeat -950px -645px;
+}
+
+.imagecaption p {
+ margin: 5px 0;
+ padding-left: 50px;
+}
+
+/* END TOOL BOX */
+#bottomwrap { background-color: #fff; }
+
+#footer {
+ clear: both;
+ width: 990px;
+ margin: 0 auto;
+ color: #000;
+ font-weight: bold;
+ padding-top: 15px;
+ background: url(assets/bg_footer.jpg) no-repeat #fff;
+}
+
+#footer a { margin-left: 15px; }
+#footer a:hover { color: #338759; }
+
+#copyright {
+ font-size: 10px;
+ padding: 50px 0;
+ color: #666;
+}
+
+#copyright a {
+ color: #666;
+ text-decoration: underline;
+ font-weight: bold;
+}
+
+#copyright a:hover { color: #000; }
\ No newline at end of file
--- /dev/null
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
+"http://www.w3.org/TR/html4/strict.dtd">
+<html>
+<head>
+<title>[Site Title]</title>
+<meta http-equiv="content-type" content="text/html;charset=utf-8">
+<meta http-equiv="imagetoolbar" content="no">
+<meta http-equiv="imagetoolbar" content="false">
+<link rel="stylesheet" type="text/css" href="styles.css">
+<LINK REL="SHORTCUT ICON" HREF="favicon.ico">
+<script type="text/javascript" src="http://app.gaslightmedia.com/libjs/jquery-1.3.2.min.js"></script>
+<script type="text/javascript" src="http://app.gaslightmedia.com/libjs/jquery.innerfade.js"></script>
+<script type="text/javascript"> $(document).ready(
+ function(){
+ $('ul#slideshow').innerfade({
+ speed: 6000,
+ timeout: 8000,
+ type: 'sequence',
+ containerheight: '250px'
+ });
+ }
+);
+</script>
+</head>
+<body>
+ <div id="headerwrap">
+ <div id="header">
+ <div id="logo">
+ <a href="#.html">Trout Creek Condominium Resort</a>
+ </div><!-- /#logo -->
+ <div id="puremich">
+ Pure Michigan
+ </div><!-- /#puremich -->
+ <div id="reservations">
+ <a href="reservations">Make A Reservation</a>
+ </div><!-- /#reservations -->
+ </div><!-- /#header -->
+ <div id="mainnav">
+ <div id="centeredmenu">
+ <ul>
+ <li><a href="#" class="active">Home</a></li>
+ <li><a href="#">Accommodations</a></li>
+ <li><a href="#">Things To Do & See</a></li>
+ <li><a href="#">Area Information</a></li>
+ <li><a href="#">Specials & Packages</a></li>
+ <li><a href="#">Resort Information</a></li>
+ <li><a href="#">Guest Information</a></li>
+ <li><a href="#">Contact Us</a></li>
+ </ul>
+ </div><!-- /#centeredmenu -->
+ </div><!-- /#mainnav -->
+ </div><!-- /#headerwrap -->
+ <div id="contentwrap">
+<!-- content-home on inside only pages -->
+ <div id="content-home">
+ <div id="rotating">
+ <ul id="slideshow">
+ <!-- these images will have to be cropped on upload -->
+ <li><img src="assets/rotating/01.jpg" alt="rotating photo" width="545" height="253"></li>
+ <li><img src="assets/rotating/02.jpg" alt="rotating photo" width="545" height="253"></li>
+ <li><img src="assets/rotating/03.jpg" alt="rotating photo" width="545" height="253"></li>
+ <li><img src="assets/rotating/04.jpg" alt="rotating photo" width="545" height="253"></li>
+ <li><img src="assets/rotating/05.jpg" alt="rotating photo" width="545" height="253"></li>
+ <li><img src="assets/rotating/06.jpg" alt="rotating photo" width="545" height="253"></li>
+ </ul>
+ </div><!-- /#rotating -->
+ <div id="category">
+<!-- prototyped with just category content, assume standard toolbox output -->
+ <h1>Make Trout Creek Your Harbor Springs "Home-Away-From-Home"</h1>
+ <p>
+ Visit us any time of the year for that memorable family vacation, ski trip, golf outing or family reunion. Enjoy miles of state Snowmobile Trails & next door you will find the Best Skiing in the Midwest at Nubs Nob & Boyne Highlands. Trout Creek offers beautiful, clean & convenient vacation condominiums close to premier golf and sandy beaches.
+ </p>
+ <p>
+ Enjoy resort amenities while you relax in our casual atmosphere. Just minutes to the charming Lake Michigan resort towns of Harbor Springs and Petoskey. Only 25 minutes to the Mackinac Bridge!
+ </p>
+ <p>
+ Get away this winter to Northern Michigan! Have fun skiing, snowmobiling and snowboardingwith your family and friends. Make plans for your vacation today. You will be so glad that you did!
+ </p>
+ <p>
+ A 2009 Summer guest had this to say in a recent email "I just wanted you to know what a wonderful trip we had this year at Trout Creek. Our condo had everything we needed! We really appreciated all of the updates, freshly tended footpaths, the new soccer nets and the stocked fishing ponds. Trout Creek has everything a busy family would need! All we had to do was unpack and start having fun! We have been coming to your resort for several years and it is always the highlight to our summer!"
+ </p>
+ </div><!-- /#category -->
+ <div id="whatsnew">
+ <div class="row">
+ <div class="one">
+ <h3>Headline flagged from Toolbox</h3>
+ <img src="assets/temp_newsphoto.jpg" alt="#" width="150" height="97">
+ Whether you spend the day boating on the Inland Waterway or Little Traverse Bay, it will be a day to remember.
+ <a href="#" class="readmore">Read More</a>
+ </div><!-- /.one -->
+ <div class="two">
+ <h3>Headline flagged from Toolbox</h3>
+ <img src="assets/temp_newsphoto.jpg" alt="#" width="150" height="97">
+ Whether you spend the day boating on the Inland Waterway or Little Traverse Bay, it will be a day to remember.
+ <a href="#" class="readmore">Read More</a>
+ </div><!-- /.two -->
+ </div><!-- /.row -->
+ <div class="row">
+ <div class="one">
+ <h3>Headline flagged from Toolbox</h3>
+ <img src="assets/temp_newsphoto.jpg" alt="#" width="150" height="97">
+ Whether you spend the day boating on the Inland Waterway or Little Traverse Bay, it will be a day to remember.
+ <a href="#" class="readmore">Read More</a>
+ </div><!-- /.one -->
+ <div class="two">
+ <h3>Headline flagged from Toolbox</h3>
+ <img src="assets/temp_newsphoto.jpg" alt="#" width="150" height="97">
+ Whether you spend the day boating on the Inland Waterway or Little Traverse Bay, it will be a day to remember.
+ <a href="#" class="readmore">Read More</a>
+ </div><!-- /.two -->
+ </div><!-- /#row -->
+ </div><!-- #/whatsnew -->
+ </div><!-- /#content-home -->
+<!-- rightcol on inside only pages -->
+ <div id="rightcol">
+ <img src="assets/shadowtop-h.jpg" alt="feature items" width="220" height="20">
+ <div id="specials">
+ <a href="#.html" title="Specials and Packages">Specials and Packages</a>
+ </div><!-- /#specials -->
+ <div id="enews">
+ <a href="#.html" title="Sign Up for Enews">Sign up for Enews</a>
+ </div><!-- /#specials -->
+ <div id="video">
+ <a href="#.html" title="Watch Video">Experience Trout Creek</a>
+ </div><!-- /#specials -->
+ <div id="facebook">
+ <a href="#.html" title="Become Our Fan">Facebook</a>
+ </div><!-- /#specials -->
+ <div id="blog">
+ <a href="#.html" title="Trout Creek Blog">Trout Creek Blog</a>
+ </div><!-- /#specials -->
+ <img src="assets/shadowbot-h.jpg" alt="feature items" width="220" height="25">
+ </div><!-- /#rightcol -->
+ <br clear="all"> <!-- this break just for breakout between home and inside pages -->
+ <!-- leftcol on inside only pages -->
+ <div id="leftcol">
+ <!-- sublevel block -->
+ <div id="subnavwrapper">
+ <div id="pagetitle">
+ <a href="#.html">Page Title</a>
+ <div id="pagetitlebot"></div><!-- /#pagetitlebot -->
+ </div><!-- /#pagetitle -->
+ <div id="sublevelwrap">
+ <ul id="sublevel">
+ <li><a href="#">Item one</a>
+ <ul>
+ <li><a href="#">Subitem one</a></li>
+ <li><a href="#">Subitem two</a></li>
+ <li><a href="#">Subitem three</a></li>
+ <li><a href="#">Subitem four</a></li>
+ </ul>
+ </li>
+ <li><a href="#">Item two</a></li>
+ <li><a href="#">Item three</a></li>
+ <li><a href="#">Item four</a></li>
+ </ul>
+ </div><!-- /#sublevel -->
+ </div><!-- /#sublevelwrap -->
+<!-- END sublevel block -->
+ <div id="features">
+ <img src="assets/shadowtop.jpg" alt="feature items" width="180" height="20">
+ <div id="specials">
+ <a href="#.html" title="Specials and Packages">Specials and Packages</a>
+ </div><!-- /#specials -->
+ <div id="enews">
+ <a href="#.html" title="Sign Up for Enews">Sign up for Enews</a>
+ </div><!-- /#specials -->
+ <div id="video">
+ <a href="#.html" title="Watch Video">Experience Trout Creek</a>
+ </div><!-- /#specials -->
+ <div id="facebook">
+ <a href="#.html" title="Become Our Fan">Facebook</a>
+ </div><!-- /#specials -->
+ <div id="blog">
+ <a href="#.html" title="Trout Creek Blog">Trout Creek Blog</a>
+ </div><!-- /#specials -->
+ <img src="assets/shadowbot.jpg" alt="feature items" width="180" height="25">
+ </div><!-- /#features -->
+ </div><!-- /#leftcol -->
+ <!-- content on inside only pages -->
+ <div id="content">
+ <div id="toolbox">
+ <div id="breadcrumb">
+ <a href="#.html">Home</a> > <a href="#.html">Main Nav Item</a> > <span class="current">Sublevel Item</span>
+ </div>
+ <div id="category">
+ <h1>Updatable headline area, category headline</h1>
+ <div class="imageright">
+ <img src="assets/temp_photo.jpg" alt="temporary photo" width="350" height="240">
+ <div class="imagecaption">
+ <p>
+ Photo caption area.
+ </p>
+ </div><!-- /imagecaption -->
+ </div><!-- /imageright -->
+ <p>
+ Visit us any time of the year for that memorable family vacation, ski trip, golf outing or family reunion. Enjoy miles of state Snowmobile Trails & next door you will find the Best Skiing in the Midwest at Nubs Nob & Boyne Highlands. Trout Creek offers beautiful, clean & convenient vacation condominiums close to premier golf and sandy beaches.
+ </p>
+ <p>
+ Visit us any time of the year for that memorable family vacation, ski trip, golf outing or family reunion. Enjoy miles of state Snowmobile Trails & next door you will find the Best Skiing in the Midwest at Nubs Nob & Boyne Highlands. Trout Creek offers beautiful, clean & convenient vacation condominiums close to premier golf and sandy beaches.
+ </p>
+ </div><!-- /#category -->
+ <div class="listing">
+ <h2>Updatable listing headline area</h2>
+ <div class="imageleft">
+ <img src="assets/temp_photo.jpg" alt="temporary photo" width="350" height="240">
+ <div class="imagecaption">
+ <p>Photo caption area.</p>
+ </div><!-- /imagecaption -->
+ </div><!-- /imageleft -->
+ <p>
+ Visit us any time of the year for that memorable family vacation, ski trip, golf outing or family reunion. Enjoy miles of state Snowmobile Trails & next door you will find the Best Skiing in the Midwest at Nubs Nob & Boyne Highlands. Trout Creek offers beautiful, clean & convenient vacation condominiums close to premier golf and sandy beaches.
+ </p>
+ <p>
+ Visit us any time of the year for that memorable family vacation, ski trip, golf outing or family reunion. Enjoy miles of state Snowmobile Trails & next door you will find the Best Skiing in the Midwest at Nubs Nob & Boyne Highlands. Trout Creek offers beautiful, clean & convenient vacation condominiums close to premier golf and sandy beaches.
+ </p>
+ </div><!-- /.listing -->
+ </div><!-- /#toolbox -->
+ </div><!-- /#content -->
+ </div><!-- /#contentwrap -->
+ <div id="bottomwrap">
+ <div id="footer">
+ <p>Trout Creek Condominium Resort 4749 Pleasantview | Harbor Springs, MI 49740</p>
+ <p>231-526-2148 • 1-800-748-0245 <a href="mailto:info@troutcreek.com" target="_blank">info@troutcreek.com</a> <a href="#.html">Owners Section</a></p>
+ <div id="copyright">
+ Copyright © 2010 Trout Creek All Rights Reserved | Produced by <a href="http://www.gaslightmedia.com" target="_blank">Gaslight Media</a>
+ </div><!-- copyright -->
+ </div><!-- /#footer -->
+ </div><!-- /#bottomwrap -->
+</body>
+</html>
\ No newline at end of file