@charset "UTF-8";
/* CSS Document */

/* Eric Meyers Reset*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/*End Meyers*/

body {background:#CCC; font-family:Arial, Helvetica, sans-serif; font-size:10px;}

.clear {clear:both;}
/*#page {background:url(http://horsehairmementos.com/_images/page.gif) no-repeat top center; width:1974px; height:1000px; margin:0 auto; position:relative; top:39px; overflow:hidden;}*/

.bg {background:url(http://horsehairmementos.com/_images/bg.jpg) repeat-x;}
.stable {background:url(http://horsehairmementos.com/_images/stable.png) no-repeat center top; width:100%; height:973px; position:absolute; top:-52px;; right:0; left:0;}

/*header & nav*/

.header {background:url(http://horsehairmementos.com/_images/header.png); width:980px; height:334px; position:relative; margin:0 auto;}

.header .nav {width:940px; height:65px; position:absolute; top:260px; left:20px;}
.header .nav .nav-l{background:url(http://horsehairmementos.com/_images/nav-l.png) no-repeat; position:absolute; float:left; width:35px; height:60px;}
.header .nav .nav-bar{background:url(http://horsehairmementos.com/_images/nav.png) repeat-x; width:842px; height: 60px; left:33px; position:absolute; padding:20px;}
.header .nav .nav-r{background:url(http://horsehairmementos.com/_images/nav-r.png) no-repeat; position:relative; float:left; width:35px; height:60px; left:912px;}

.header .nav .nav-bar ul {text-align:center;}
.header .nav .nav-bar ul li{display:inline; list-style-type:none; padding-right:20px;}
.header .nav .nav-bar ul li a{text-decoration:none; color:#333; font-family:Arial, Helvetica, sans-serif; font-weight:bold; font-size:14px;}
.header .nav .nav-bar ul li a:hover{color:#0CF;}

.header .nav .nav-bar ul li a.active{text-decoration:underline;}

/*wrapper*/
.wrapper {background:#FFF; width:980px; margin:0 auto; position:relative; min-height:1100px; }
.wrapper .featured h2 {color:#444; font-size:18px; float:left; margin:12px; font-weight:100; text-transform:uppercase;} 

/*slider section*/
.wrapper .slider {background:url(http://horsehairmementos.com/_images/main-banner.jpg) transparent; width:940px; height:300px; margin:20px; position:relative; float:left;}

/* story section */
.wrapper .story {width:895px; padding:15px 21px 15px 31px; height:auto; position:relative; float:left;}
.wrapper .story h5 {font-size:18px; line-height:150%; text-transform:uppercase; font-family:Arial, Helvetica, sans-serif; margin-bottom:15px;}
.wrapper .story p {font-size:14px; line-height:150%; margin-bottom:10px;}
.wrapper .story p.referral {font-size:12px; width:65%;}

/*featured products category*/
.wrapper .featured {background:#FFF; width:940px; height:auto; margin:20px 20px 8px 20px; position:relative; float:left;}
.wrapper .featured .ft-col {background:#FFF; width:220px; height:290px; position:relative; float: left; margin:10px 0 10px 12px;}
.wrapper .featured .ft-col .click-zoom {margin:5px 0 5px 0;}
.wrapper .featured .ft-col h4{color:#444; font-size:14px; line-height:150%; font-weight:bold;}
.wrapper .featured .ft-col a.product{color:#444; font-size:12px; line-height:200%;}
.wrapper .featured .ft-col a.product:hover{color:#0CF;}
.wrapper .featured .ft-col a img {border:solid 2px #FFF;}
.wrapper .featured .ft-col a img:hover {border:solid 2px #0CF;}



/*below featured section*/
.wrapper .below-featured {background:#eae9e9; width:100%; height:auto; position:relative; float:left;}
.wrapper .below-featured .content {background: #eae9e9; margin:20px; height:360px; width:940px;}
.wrapper .below-featured .content .bg-col {background:#eae9e9; width:440px; height:338px; position:relative; float: left; margin:10px 0 10px 12px;}
.wrapper .below-featured .content .bg-col h2{text-transform:uppercase; font-size:18px; color:#444; margin-bottom:20px;}
.wrapper .below-featured .content .ft-col h2{text-transform:uppercase; font-size:18px; color:#444; margin-bottom:20px;}
.wrapper .below-featured .content .ft-col {background:#eae9e9; width:220px; height:338px; position:relative; float: left; margin:10px 0 10px 12px; padding-right:10px;}
.wrapper .below-featured .content .ft-col p {color:#444; font-size:10px; line-height:175%}
.wrapper .below-featured .content .ft-col p a{color:#333; font-weight:bold;}
.wrapper .below-featured .content .ft-col p a:hover{color:#0CF;}
.wrapper .below-featured .content .ft-col .bold {font-weight:bold; margin-bottom:10px; margin-top:2px;}
.wrapper .below-featured .content .bg-col img {border:#999 solid 1px;}
.wrapper .below-featured .content .bg-col img:hover {border:#0CF solid 1px;}
.wrapper .below-featured .content .bg-col p {line-height:175%;}
.wrapper .below-featured .content .bg-col p a {color:#333; font-weight:bold;}
.wrapper .below-featured .content .bg-col p a:hover {color:#0CF;}
.wrapper .below-featured .content .bg-col h3 {font-size:14px; color:#444; margin:15px 0 10px 0;}

/*********** TASSELS PAGE **********/

/* Main Banner */

.wrapper .tassel-banner {background:url(http://horsehairmementos.com/_images/tassel-banner.png) transparent; width:940px; height:124px; margin:20px; position:relative; float:left;}

/*Left Column */
.wrapper .col-left {position: relative; width: 300px; margin: 20px; float: left;}
.wrapper .col-left h2 {color:#444; font-size:24px; float:left; margin-bottom:10px; font-weight:100; font-family:"Times New Roman", Times, serif; width:300px; line-height:125%;}
.wrapper .col-left p {color:#444; font-size:14px; line-height:175%; margin-bottom:10px;}

/*right column*/
.wrapper .col-right {position:relative; width:550px; height:auto; float:left; margin:20px; border:5px solid #382817; padding-bottom:6px;}
/************End Tassels Page*************/

/************ Bracelet Page **************/
.wrapper .bracelet-banner {background:url(http://horsehairmementos.com/_images/bracelet-banner.png) transparent; width:940px; height:124px; margin:20px; position:relative; float:left;}

/*******END Bracelet Page*****************/

/************ Memorial Page **************/

.wrapper .memorial-banner {background:url(http://horsehairmementos.com/_images/memorial-banner.png) transparent; width:940px; height:124px; margin:20px; position:relative; float:left;}

/************ END Memorial Page **************/

/************ Reviews **************/

.wrapper .reviews {width:895px; padding:15px 21px 15px 31px; height:auto; position:relative; float:left;}
.wrapper .reviews h5 {font-size:24px; line-height:150%; font-family:"MS Serif", "New York", serif; margin-bottom:15px;}
.wrapper .reviews p {font-size:14px; line-height:150%; margin-bottom:10px;}
.wrapper .reviews p.blockquote {font-size:28px; line-height:150%; margin-top:22px; font-weight:bold; color:#999; font-family:"MS Serif", "New York", serif;}

/************ END Reviews **************/

/*footer*/
.footer {background:#0f0904; width:100%; height:auto;}
.footer .footer-links {width:940px; height:250px; position:relative; margin:0 auto; padding-top:20px;}
.footer .footer-links .ft-col {background:#0F0904; width:180px; height:140px; position:relative; float: left; margin:10px 0 10px 12px; padding-right:10px;} 
.footer .footer-links .ft-col ul li {font-size:12px; line-height:150%;} 
.footer .footer-links .ft-col ul li.title{font-size:18px; margin-bottom:25px;}
.footer .footer-links .ft-col ul li a,.footer .footer-links .ft-col ul li.title a{text-decoration:none; color:#888;}
.footer .footer-links .ft-col ul li a:hover,.footer .footer-links .ft-col ul li.title a:hover{color:#0CF;}
.footer .footer-links .copywright {color:#888; font-size:12px; float:right; text-align:right;}