another try at the store...
by Christopher Pearson
HTML
<link href='http://fonts.googleapis.com/css?family=Oswald:300' rel='stylesheet' type='text/css'>
<div class="listing-template">
<div class="section-hdr">
<img class="top-logo" src="http://i76.photobucket.com/albums/j39/christopherepearson1/Web%20Graphics/logo3_zpsa8816cd3.png" alt="logo" />
<div class="nav-bar">
<ul>
<li><a target="_blank" href="http://stores.ebay.com/doboyo_Maternity-Fashion_W0QQfsubZ5511741012">maternity</a>
</li>
<li><a target="_blank" href="http://stores.ebay.com/doboyo_Womens-Fashion_W0QQfsubZ5511742012">women's</a>
</li>
<li><a target="_blank" href="http://stores.ebay.com/doboyo_Mens-Fashion_W0QQfsubZ5511743012">men's</a>
</li>
<li><a target="_blank" href="http://stores.ebay.com/doboyo_Youth-Fashion_W0QQfsubZ5511744012">youth</a>
</li>
<li><a target="_blank" href="http://stores.ebay.com/doboyo_Baby_W0QQfsubZ5511745012">baby</a>
</li>
<li><a target="_blank" href="http://stores.ebay.com/doboyo_Household_W0QQfsubZ5511751012">houshold</a>
</li>
<li id="unique-nav"><a target="_blank" href="http://stores.ebay.com/doboyo">STORE HOME</a>
</li>
</ul>
</div>
<!-- end nav bar -->
</div>
<!-- end header -->
<div class="section-content">
<div class="gallery-container">
<div class="thumbset"> <a class="test-link" href="#">TEST</a>
<div class="big-pic-box">
<!-- <img class="default" src="http://placehold.it/400" alt="" />--></div>
<!-- end big picture box -->
</div> </div>
<!-- end gallery container -->
</div>
<!-- end content section -->
</div>
<!-- end listing template -->
<!-- ************END CUT HERE FOR EBAY LISTING************** -->
CSS
.listing-template {
max-width: 750px;
background-color: #7496a7;
border: 1px solid #333;
margin-left: auto;
margin-right: auto;
}
.listing-template .section-hdr {
padding-top: 10px;
padding-bottom: 0px;
}
.listing-template .section-hdr .top-logo {
max-width: 350px;
display: block;
margin-left: auto;
margin-right: auto;
}
.listing-template .nav-bar {
width: 700px;
/*border: 1px solid #D7E3E9;*/
text-align: center;
display: block;
margin-left: auto;
margin-right: auto;
}
.listing-template .nav-bar ul {
padding:0;
}
.listing-template .nav-bar a {
color: #D7E3E9;
font-family: oswald, sans-serif;
font-size: 14px;
font-weight: 300;
padding: 8px;
text-transform: uppercase;
text-decoration: none;
}
.listing-template .nav-bar li {
display:inline-block;
padding-top: 10px;
padding-bottom: 10px;
border: 1px solid #D7E3E9;
}
.listing-template .nav-bar li:hover {
background-color:#2B596F;
border: 1px dotted #D7E3E9
}
#unique-nav {
background-color:#2B596F;
}
#unique-nav:hover {
background-color:#9e3754;
}
.listing-template .section-content {
padding-top:15px;
padding-bottom: 15px;
/*border: 1px solid #D7E3E9;*/
}
.listing-template .section-content .gallery-container {
height: 600px;
width:420px;
border: 1px solid #D7E3E9;
margin-left: 5px;
}
.listing-template .section-content .gallery-container .big-pic-box {
height: 400px;
width:400px;
position:relative;
left:5px;
top:5px;
background:#2B596F url(http://placehold.it/250x400) no-repeat center;
opacity:0.3;
background-size: contain;
border: 1px solid #D7E3E9;
}
/* .listing-template .section-content .gallery-container .default {
position:relative;
left:0px;
top:0px;
border:1px solid #D7E3E9;
opacity: 0.25;
z-index:0;
max-height: 400px;
max-width: 400px;z-index:
} */
.listing-template .section-content .gallery-container...