/* ======================================================
   noel.css contains general layout and typographic
   styles that will be used on noelbarnhurst.com
   
   1. Reset styles
   2. General layout
   3. Header styles
   4. Top nav / dropdown nav styles
   5. General typography
   6. Image drop shadow
   7. Home page styles
   8. Footer styles
   9. Side nav styles
   10. Photo gallery styles
   11. Stock page styles
   
   
   COLORS
   background brown: #342D28
   text brown: #736E6B
   lighter text" #D9CFC0
   
   ====================================================== */

	
/* ======================================================
   RESET STYLES                                    
   ====================================================== */

	
/* Based on Eric Meyer's reset css 
   http://meyerweb.com/eric/tools/css/reset/ 
   v1.0 | 20080212 */
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,font,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 {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
}

body {line-height:1;}

ol,ul {list-style:none;}

blockquote,q {quotes:none;}

blockquote:before,blockquote:after,q:before,q:after {
	content:'';
	content:none;
}


	
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse:collapse;
	border-spacing:0;
}


	
/* ===================================== end reset styles */

	
/* ======================================================
   GENERAL LAYOUT                                     
   ====================================================== */
body {
	background-color:#342D28;
	text-align:center;
}

#wrapper {
	width:980px;
	margin:0 auto;
	position:relative;
}

#header {
	text-align:left;
	padding:0 10px;
	height:123px;
}

#gallery {clear:both;}

#footer {clear:both;}


	
/* =================================== end general layout */

	
/* ======================================================
   HEADER STYLES                                
   ====================================================== */
#header h1 {
	float:left;
	width:234px;
	height:65px;
	background:transparent url(http://noelbarnhurst.com/images/site/noel-logo.png) no-repeat left top;
	margin-top:40px;
}

#header h1 a {
	display:block;
	width:234px;
	height:65px;
	overflow:hidden;
	text-decoration:none;
	text-indent:-999em;
}


	
/* ==================================== end header styles */

	
/* ======================================================
   TOP NAV / DROPDOWN NAV STYLES                                
   ====================================================== */
#topnav {
	float:right;
	padding-top:102px;
}

#topnav li {
	float:left;
	margin-right:20px;
}

#topnav li a {
	display:block;
	height:19px;
	text-decoration:none;
	overflow:hidden;
	text-indent:-999em;
}

#home #sn-h a,#home #sn-p a,#home #sn-s a,#home #sn-c a {
	background:transparent no-repeat left top;
}

#home #sn-h a {background-image:url(http://noelbarnhurst.com/images/site/tn-home.png);
	width:60px;
}

#home #sn-p a {background-image:url(http://noelbarnhurst.com/images/site/tn-photos.png);
	width:77px;
}

#home #sn-s a {background-image:url(http://noelbarnhurst.com/images/site/tn-stock.png);
	width:66px;
}

#home #sn-c a {background-image:url(http://noelbarnhurst.com/images/site/tn-contact.png);
	width:87px;
}

#home #sn-p a:hover,
#home #sn-s a:hover,
#home #sn-c a:hover {
	background-position:left bottom;
}

#home #sn-p a, #home #sn-p a:hover {
	background-position:left top;
	cursor:default;
}

#home #sn-h a,#home #sn-h a:hover {
	background-position: left center;
	cursor:default;
}


	
/* HOME PAGE CATEGORY DROPDOWN */
.popup {
	display:none;
	position:absolute;
	height:106px;
	width:552px;
	background:transparent url(http://noelbarnhurst.com/images/site/catnav-arrow.png) no-repeat left top;
	top:126px;
	right:10px;
	z-index:100;
}

#home #categories {
	height:85px;
	width:537px;
	padding-top:15px;
	padding-left:15px;
	background:transparent url(http://noelbarnhurst.com/images/site/catnav-bck.png) left top;
	margin-top:7px;
}

#home #categories ul {
	float:left;
	width:116px;
	margin-left:17px;
}

#home #categories ul li a {
	display:block;
	width:116px;
	height:15px;
	background:transparent no-repeat left top;
	text-decoration:none;
	text-indent:-999em;
}

#home #categories ul .sn-appetizers a {background-image:url(http://noelbarnhurst.com/images/site/cnav-app.png);
}

#home #categories ul .sn-beverages a {background-image:url(http://noelbarnhurst.com/images/site/cnav-bev.png);
}

#home #categories ul .sn-bread a {background-image:url(http://noelbarnhurst.com/images/site/cnav-brd.png);
}

#home #categories ul .sn-breakfast a {background-image:url(http://noelbarnhurst.com/images/site/cnav-brk.png);
}

#home #categories ul .sn-coffee a {background-image:url(http://noelbarnhurst.com/images/site/cnav-cof.png);
}

#home #categories ul .sn-desserts a {background-image:url(http://noelbarnhurst.com/images/site/cnav-des.png);
}

#home #categories ul .sn-ice-cream a {background-image:url(http://noelbarnhurst.com/images/site/cnav-ice.png);
}

#home #categories ul .sn-meat a {background-image:url(http://noelbarnhurst.com/images/site/cnav-met.png);
}

#home #categories ul .sn-pizza-pasta a {background-image:url(http://noelbarnhurst.com/images/site/cnav-piz.png);
}

#home #categories ul .sn-poultry a {background-image:url(http://noelbarnhurst.com/images/site/cnav-plt.png);
}

#home #categories ul .sn-products a {background-image:url(http://noelbarnhurst.com/images/site/cnav-prd.png);
}

#home #categories ul .sn-rice-noodles a {background-image:url(http://noelbarnhurst.com/images/site/cnav-ric.png);
}

#home #categories ul .sn-salads a {background-image:url(http://noelbarnhurst.com/images/site/cnav-sal.png);
}

#home #categories ul .sn-seafood a {background-image:url(http://noelbarnhurst.com/images/site/cnav-sfd.png);
}

#home #categories ul .sn-soup a {background-image:url(http://noelbarnhurst.com/images/site/cnav-sup.png);
}

#home #categories ul .sn-still-life a {background-image:url(http://noelbarnhurst.com/images/site/cnav-stl.png);
}

#home #categories ul .sn-vegetables a {background-image:url(http://noelbarnhurst.com/images/site/cnav-veg.png);
}

#home #categories ul .sn-wine-beer a {background-image:url(http://noelbarnhurst.com/images/site/cnav-win.png);
}

#home #categories ul .sn-pub a {background-image:url(http://noelbarnhurst.com/images/site/cnav-pub.png);
}
#home #categories ul .sn-pack a {background-image:url(http://noelbarnhurst.com/images/site/cnav-pack.png);
}

#home #categories ul li a:hover {
	background-position: left bottom;
}


	
/* =================================== end top nav styles */

	
/* ======================================================
   GENERAL TYPOGRAPHY                                     
   ====================================================== */
body {
	font-size:62.8%;
	color:#66615D;
	font-family:Helvetica, Arial, sans-serif;
}


	
/* =============================== end general typography */

	
/* ======================================================
   IMAGE DROP SHADOW                                
   ====================================================== */

.shadow-one {
    position: absolute;
    padding-top: 20px;
    padding-left: 20px;
    }

.corner-a {
    position: absolute;
    right: 0;
    top: 0;
    width: 20px;
    height: 20px;
    background: url(http://noelbarnhurst.com/images/site/dropshadow.png) right top no-repeat;
    }
.corner-b {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 20px;
    height: 20px;
    background: url(http://noelbarnhurst.com/images/site/dropshadow.png) left bottom no-repeat;
    }
.shadow-two {
    background: url(http://noelbarnhurst.com/images/site/dropshadow.png) right bottom no-repeat;
    }
.shadow-three {
    position: relative;
    left: -20px;
    top: -20px;
    background: url(http://noelbarnhurst.com/images/site/dropshadow.png) left top no-repeat;
    }
.shadow-four {
    position: relative;
    left: 10px;
    top: 10px;
    }


	
/* ================================ end image drop shadow */

	
/* ======================================================
   HOME PAGE STYLES                                
   ====================================================== */
#home #photodiv,#home #photoimg {
	background-repeat:no-repeat;
	width:960px;
	height:572px;
}

#home #footer {text-align:left;}
#home .shadowbox {
	background:transparent url(http://noelbarnhurst.com/images/site/shadow-bottom.png) repeat-x center bottom;
	float:left;
}

#home .shadow-header {
	height:10px;
	position:relative; 
	width:100%;
	background:url(http://noelbarnhurst.com/images/site/shadow-top.png) repeat-x center top;
	float:left;
}

#home .shadow-footer {
	height:10px;
	position:relative;
	float:left;
	width:100%;
}

#home .shadow-wrapper2 {background:url(http://noelbarnhurst.com/images/site/shadow-left.png) repeat-y left center;
	float:left;
}

#home .shadow-wrapper3 {background:url(http://noelbarnhurst.com/images/site/shadow-right.png) repeat-y right center;
	float:left;
}

#home .shadow-inner {
	padding:0 10px;
	margin:0;
	float:left;
}

#home .shadow-inner img {
	margin:0;
	padding:0;
	float:left;
}

#home .shadow-header span,.shadow-footer span {
	position:absolute;
	width:10px;
	height:10px;
}

#home .shadow-tl {
	left:0;
	top:0;
	background:url(http://noelbarnhurst.com/images/site/shadow-tl.png) no-repeat;
}

#home .shadow-tr {
	right:0;
	top:0;
	background:url(http://noelbarnhurst.com/images/site/shadow-tr.png) no-repeat;
}

#home .shadow-bl {
	left:0;
	top:0;
	background:url(http://noelbarnhurst.com/images/site/shadow-bl.png) no-repeat;
}
#home .shadow-br {
	right:0;
	top:0;
	background:url(http://noelbarnhurst.com/images/site/shadow-br.png) no-repeat;
}


	
/* ================================= end home page styles */

	
/* ======================================================
   FOOTER STYLES                                
   ====================================================== */
#footer h2 {
	padding-top:10px;
	padding-left:10px;
	color:#66615D;
	font-weight:normal;
	font-size:1.3em;
}

#footer p {
	width:810px;
	color:#66615D;
	padding-top:10px;
	padding-left:170px;
	font-size:1.2em;
}


	
/* ==================================== end footer styles */

	
/* ======================================================
   SIDE NAV STYLES                                
   ====================================================== */
#sidenav {
	width:170px;
	margin-top:40px;
	float:left;
	text-align:left;
}
#sidenav ul, #sidenav li {
	float: left;
}


#sidenav li a {
	display:block;
	width:135px;
	height:24px;
	background:transparent no-repeat left top;
	text-decoration:none;
	overflow:hidden;
	text-indent:-999em;
}

#sidenav #sn-h a {background-image:url(http://noelbarnhurst.com/images/site/sn-home.png);
}

#sidenav li #sna-p {background-image:url(http://noelbarnhurst.com/images/site/sn-photos2.png);
}

#sidenav #sn-s a {background-image:url(http://noelbarnhurst.com/images/site/sn-stock.png);
}

#sidenav #sn-c a {background-image:url(http://noelbarnhurst.com/images/site/sn-contact.png);
}

#portfolio #sidenav li #sna-p,
#published #sidenav li #sna-p {
	height:29px;
	background-image:url(http://noelbarnhurst.com/images/site/sn-photos-on.png);
}

#stock #sidenav #sn-s a {
	height:29px;
	background-image:url(http://noelbarnhurst.com/images/site/sn-stock-on.png);
}

#contact #sidenav #sn-c a {
	height:29px;
	background-image:url(http://noelbarnhurst.com/images/site/sn-contact-on.png);
}

#sidenav li a:hover {
	background-position:left bottom;
}
.side {
	padding-bottom: 10px;
}
#sidenav ul li {
	padding-left: 16px;
}
#sidenav ul li a {
	text-indent: none;
	width: 119px;
	height: 19px;
	background: transparent no-repeat left top;
}
#sidenav ul li a {
	background-image: url(http://noelbarnhurst.com/images/site/sn-cof.png);
}

#sidenav ul li.sn-appetizers a {
	background-image: url(http://noelbarnhurst.com/images/site/sn-app.png);
}
#sidenav ul li.sn-beverages a {
	background-image: url(http://noelbarnhurst.com/images/site/sn-bev.png);
}
#sidenav ul li.sn-bread a {
	background-image: url(http://noelbarnhurst.com/images/site/sn-brd.png);
}
#sidenav ul li.sn-breakfast a {
	background-image: url(http://noelbarnhurst.com/images/site/sn-brk.png);
}
#sidenav ul li.sn-coffee a {
	background-image: url(http://noelbarnhurst.com/images/site/sn-cof.png);
}
#sidenav ul li.sn-desserts a {
	background-image: url(http://noelbarnhurst.com/images/site/sn-des.png);
}
#sidenav ul li.sn-ice-cream a {
	background-image: url(http://noelbarnhurst.com/images/site/sn-ice.png);
}
#sidenav ul li.sn-meat a {
	background-image: url(http://noelbarnhurst.com/images/site/sn-met.png);
}
#sidenav ul li.sn-pizza-pasta a {
	background-image: url(http://noelbarnhurst.com/images/site/sn-piz.png);
}
#sidenav ul li.sn-poultry a {
	background-image: url(http://noelbarnhurst.com/images/site/sn-plt.png);
}
#sidenav ul li.sn-products a {
	background-image: url(http://noelbarnhurst.com/images/site/sn-prd.png);
}
#sidenav ul li.sn-rice-noodles a {
	background-image: url(http://noelbarnhurst.com/images/site/sn-ric.png);
}
#sidenav ul li.sn-salads a {
	background-image: url(http://noelbarnhurst.com/images/site/sn-sal.png);
}
#sidenav ul li.sn-seafood a {
	background-image: url(http://noelbarnhurst.com/images/site/sn-sfd.png);
}
#sidenav ul li.sn-soup a {
	background-image: url(http://noelbarnhurst.com/images/site/sn-sup.png);
}
#sidenav ul li.sn-still-life a {
	background-image: url(http://noelbarnhurst.com/images/site/sn-stl.png);
}
#sidenav ul li.sn-vegetables a {
	background-image: url(http://noelbarnhurst.com/images/site/sn-veg.png);
}
#sidenav ul li.sn-wine-beer a {
	background-image: url(http://noelbarnhurst.com/images/site/sn-win.png);
}
#sidenav ul li.sn-pub a {
	background-image: url(http://noelbarnhurst.com/images/site/sn-pub.png);
}
#sidenav ul li.sn-pack a {
	background-image: url(http://noelbarnhurst.com/images/site/sn-pack.png);
}

.appetizers #sidenav ul .sn-appetizers a,
.beverages #sidenav ul .sn-beverages a,
.bread #sidenav ul .sn-bread a,
.breakfast #sidenav ul .sn-breakfast a,
.coffee #sidenav ul .sn-coffee a,
.desserts #sidenav ul .sn-desserts a,
.ice-cream #sidenav ul .sn-ice-cream a,
.meat #sidenav ul .sn-meat a,
.pizza-pasta #sidenav ul .sn-pizza-pasta a,
.poultry #sidenav ul .sn-poultry a,
.products #sidenav ul .sn-products a,
.rice-noodles #sidenav ul .sn-rice-noodles a,
.salads #sidenav ul .sn-salads a,
.seafood #sidenav ul .sn-seafood a,
.soup #sidenav ul .sn-soup a,
.still-life #sidenav ul .sn-still-life a,
.vegetables #sidenav ul .sn-vegetables a,
.wine-beer #sidenav ul .sn-wine-beer a,
.pub #sidenav ul .sn-pub a,
.pack #sidenav ul .sn-pack a {
	background-position: center;
}
#sidenav li #sna-p, #portfolio #sidenav li #sna-p:hover, #published #sidenav li #sna-p:hover {
	background-position: left top;
	cursor:default;
}
#sidenav #categorynav {
	float: left;
	padding-bottom: 10px; 
}
#contact #sidenav li .trigger:hover,
#stock #sidenav li .trigger:hover {
	background-position: left -24px;
}
#contact #sidenav li .highlight,
#stock #sidenav li .highlight {
	background-position: left -48px;
}
#contact #sidenav li .highlight:hover,
#stock #sidenav li .highlight:hover {
	background-position: left -72px;
}




	
/* ================================== end side nav styles */

	
/* ======================================================
   PHOTO GALLERY STYLES                                
   ====================================================== */
#portfolio #photodiv, #published #photodiv, #packaging #photodiv {background-repeat:no-repeat;}
#portfolio #photoarea,
#packaging #photoarea {
	float:right;
	width:810px;
	height:570px;
	position:relative;
}
#portfolio .photowrap,
#packaging .photowrap {
	position:absolute;
	background-color: #342D28;
width: 810px;
height: 570px;
	/* left and top values set in javascript to vertically and horizontally center images of varying sizes */
}
.newshadowwrap {
position: absolute;

}
.centerpoint td {
width: 810px;
height: 570px;
text-align: center;
vertical-align: middle;
}
#published #photoarea {
	float:right;
	width:810px;
	height:570px;
	position:relative;
}
#published .pubwrap {
	width:810px;
	height:570px;
	position:absolute;
	background-color: #342D28;
}
#published .photowrap {
	position: absolute;
}
#published #pubinfo {
	position: absolute;
	width: 250px;
	right: 0;
	bottom: 50px;
	text-align: left;
	font-size: 1.2em;
	line-height: 1.5em;
	color: #D9CFC0;
}
#pubinfo strongg  {
	font-size: 1.1em;
}
#pubinfo em {
	display: block;
	font-size: 1.1em;
	padding-bottom: .5em;
	font-style: normal;
}

#thumbs {
	float: left;
	width: 970px;
	height: 68px;
	margin-left: 10px;
	background: transparent url(http://noelbarnhurst.com/images/site/thumb-bck.png) no-repeat left top;
	display: inline;
	position: relative;
}
#thumbs h2 {
	float: left;
	text-align: left;
	margin-top: 25px;
	margin-left: 25px;
	display: inline;
	width: 120px;
	height: 20px;
	background: transparent no-repeat left top;
	text-indent: -999em;
}
.appetizers #thumbs h2 {
	background-image: url(http://noelbarnhurst.com/images/site/th-app.png);
}
.beverages #thumbs h2 {
	background-image: url(http://noelbarnhurst.com/images/site/th-bev.png);
}
.bread #thumbs h2 {
	background-image: url(http://noelbarnhurst.com/images/site/th-brd.png);
}
.breakfast #thumbs h2 {
	background-image: url(http://noelbarnhurst.com/images/site/th-brk.png);
}
.coffee #thumbs h2 {
	background-image: url(http://noelbarnhurst.com/images/site/th-cof.png);
}
.desserts #thumbs h2 {
	background-image: url(http://noelbarnhurst.com/images/site/th-des.png);
}
.ice-cream #thumbs h2 {
	background-image: url(http://noelbarnhurst.com/images/site/th-ice.png);
}
.meat #thumbs h2 {
	background-image: url(http://noelbarnhurst.com/images/site/th-met.png);
}
.pizza-pasta #thumbs h2 {
	background-image: url(http://noelbarnhurst.com/images/site/th-piz.png);
}
.poultry #thumbs h2 {
	background-image: url(http://noelbarnhurst.com/images/site/th-plt.png);
}
.products #thumbs h2 {
	background-image: url(http://noelbarnhurst.com/images/site/th-prd.png);
}
.rice-noodles #thumbs h2 {
	background-image: url(http://noelbarnhurst.com/images/site/th-ric.png);
}
.salads #thumbs h2 {
	background-image: url(http://noelbarnhurst.com/images/site/th-sal.png);
}
.sfdseafood#thumbs h2 {
	background-image: url(http://noelbarnhurst.com/images/site/th-sfd.png);
}
.soup #thumbs h2 {
	background-image: url(http://noelbarnhurst.com/images/site/th-sup.png);
}
.still-life #thumbs h2 {
	background-image: url(http://noelbarnhurst.com/images/site/th-stl.png);
}
.vegetables #thumbs h2 {
	background-image: url(http://noelbarnhurst.com/images/site/th-veg.png);
}
.wine-beer #thumbs h2 {
	background-image: url(http://noelbarnhurst.com/images/site/th-win.png);
}
.pub #thumbs h2 {
	background-image: url(http://noelbarnhurst.com/images/site/th-pub.png);
}
.pack #thumbs h2 {
	background-image: url(http://noelbarnhurst.com/images/site/th-pack.png);
}
#thcar {
	float: right;
}
#mycarousel li {
	float: left;
	width: 70px;
	height: 50px;
	position: relative;
}
#mycarousel li a {
	display: block;
	position: absolute;
	width: 70px;
	height: 50px;
	background: transparent url(http://noelbarnhurst.com/images/site/thumb-overlay.png) no-repeat left top;
	top: 0;
	left: 0;
}
/* #mycarousel li a:hover {
	background-position: left bottom;
} */
#mycarousel li.hover a {
	background-position: left bottom;
}
#mycarousel li.on a, #th li.on a:hover {
	background-position: left center;
}
#mycarousel li .block {
	display: none;
}
.init {
	/* display: none; */
	z-index: 10;
}
.inithide {
	display: none;
	z-index: 10;
}
.hide {
	display: none;
	z-index: 100;
}
	
/* ============================= end photo gallery styles */

	
/* ======================================================
   STOCK PAGE STYLES                                
   ====================================================== */
#stock #content {
	float: right;
	width:762px;
	padding-right: 48px;
	padding-bottom: 20px;
}
#stock #text {
	margin-top:41px;
	float: left;
	text-align: left;
	padding-left: 57px;
	margin-bottom: 10px;
	font-size: 1.3em;
	line-height: 1.6em;
	width: 520px;
	color: #D9CFC0;
}
#stock #text p {
	margin-bottom: 1.3em;
}
#stock #text p strong {
	font-weight: bold;
}
#stock #text p em {
	font-style: italic;
}
#stock #text a{
	color: #D9CFC0;
}
#stock #text a:hover{
	color: #999693;
}
#stock #photoarea {
	float:right;
	width:715px;
	height: 410px;
	position:relative;
}

/* ================================ end stock page styles */

	
/* ======================================================
   CONTACT PAGE STYLES                                
   ====================================================== */
#contact #content {
	float: right;
	width:762px;
	padding-right: 48px;
	padding-bottom: 20px;
}
#contact #text {
	margin-top:41px;
	float: left;
	text-align: left;
	padding-left: 57px;
	margin-bottom: 10px;
	font-size: 1.3em;
	line-height: 1.6em;
	width: 280px;
	color: #D9CFC0;
}
#contact #text p {
	margin-bottom: 1.3em;
}
#contact #text p strong {
	font-weight: bold;
}
#contact #text p em {
	font-style: italic;
}
#contact #text a{
	color: #D9CFC0;
}
#contact #text a:hover{
	color: #999693;
}
#contact #photoarea {
	float:right;
	margin-top: 35px;
	width:370px;
	height: 540px;
	position:relative;
}
#contact #footer p {
	float: right;
	width:370px;
	color:#66615D;
	padding-top:10px;
	padding-right: 35px;
	font-size:1.2em;
}
/* ============================== end contact page styles */