/*

Authour: Graphic D-Signs
Author URI: http://www.GraphicD-Signs.com
Client: lox Stock and Deli
Date: May 2010
Website: http://www.loxstockdeli.com
Description: This is the main stylesheet for Lox, Stock and Deli.

*/

@import url(reset.css);

html, body { font-family: Arial, Helvetica, sans-serif; font-size: 12px; color: #333333; background: url(../images/mainbg.jpg) no-repeat top #494845; }
html, #inner { font-family: Arial, Helvetica, sans-serif; font-size: 12px; color: #333333; background: url(../images/bginner2.jpg) no-repeat top #494845; }
#container { position: relative; width: 952px; margin: 0 auto; padding: 0 0 10px 0; }
#clear { clear: both; height: 1px; }

/*****************************/
/* 		Basic Styles		*/
/***************************/

p { line-height: 19px; }
a { color: #841f1f; outline: none; }
a img { border: none; outline: none; }
a:hover { color: #4b004b; outline: none; border: none; }
.contentLists li { background: url(../images/bullet.jpg) no-repeat scroll 0 10px transparent; margin: 0 0 0 3em; padding: 8px 0 5px 14px; }

/*****************************/
/* 		Header Styles		*/
/***************************/

#header { position: relative; width: 952px; height: 118px; margin: 12px 0 0 0; top: 6px; }
#logo { position: relative; width: 253px; height: 104px; background: url(../images/logo.jpg) no-repeat; top: 6px; text-indent: -9999px; }
#logo a { width: 253px; height: 111px; display: block; }

/*****************************/
/* 		Navigation	  		*/
/***************************/

#nav { position: relative; background: #333; top: -55px; left: 253px; }
.navigation { position: absolute; margin: 0; padding: 0; list-style: none; z-index: 10000; top: 0; font-size: 12px; }
.navigation li { float: left; text-align: center; font-size: 12px; }
.navigation li a { display: block; text-indent: -9999px; vertical-align: middle; height: 55px; text-decoration: none; text-align: center; outline: none; font-size: 12px; }

/* About Us Button */
.navigation li a.nav1 { width: 131px; background: url(../images/nav.jpg) no-repeat 0 0; }
.navigation li a.nav1:hover, .navigation li.active a.nav1 { background-position: 0 -55px; }

/* Menus Button */
.navigation li a.nav2 { width: 95px; background: url(../images/nav.jpg) no-repeat -131px 0; }
.navigation li a.nav2:hover, .navigation li.active a.nav2 { background-position: -131px -55px; }

/* Gallery Button */
.navigation li a.nav3 { width: 103px; background: url(../images/nav.jpg) no-repeat -226px 0; }
.navigation li a.nav3:hover, .navigation li.active a.nav3 { background-position: -226px -55px; }

/* Promotions Button */
.navigation li a.nav4 { width: 145px; background: url(../images/nav.jpg) no-repeat -329px 0; }
.navigation li a.nav4:hover, .navigation li.active a.nav4 { background-position: -329px -55px; }

/* Contact Button */
.navigation li a.nav5 { width: 105px; background: url(../images/nav.jpg) no-repeat -474px 0; }
.navigation li a.nav5:hover, .navigation li.active a.nav5 { background-position: -474px -55px; }

/* Sitemap Button */
.navigation li a.nav6 { width: 121px; background: url(../images/nav.jpg) no-repeat -579px 0; }
.navigation li a.nav6:hover, .navigation li.active a.nav6 { background-position: -579px -55px; }

div#nav span:hover { display: block; color: #ffffff; text-decoration: none; margin: 0; background: #5F156E; text-align: center; font-size: 12px; }
#nav ul li ul a:hover { cursor: pointer; z-index: 100; height: 100%; width: 100%; /* makes the list items fill the list container (ul) */ display: block; text-decoration: none; margin: 0; text-align: center; }
#nav li ul { display: none; width: 14%; position: absolute; top: 100%; height: 100%; padding: 0; margin: 0; }
#nav li:hover > ul { display: block;}
#nav li ul li, #nav li ul li a { float: none; height: 100%; }
#nav li ul li { _display: inline; /* for IE6 */  }
#nav li ul li a { display: block; }

/* Styles for drop downs */
#nav ul li ul li span { font: 12px "Trebuchet MS", Arial, Helvetica, sans-serif; font-weight: normal; letter-spacing: .03em; color: #ffffff; display: block; margin: 0; padding: 8px; text-decoration: none; text-indent: 0px; list-style-type: none; list-style-position: outside; }
#nav ul li ul { position: absolute; z-index: 1000; top: auto; display: none; text-decoration: none; list-style-type: none; padding: 2px; margin: 0px; background: #202020; -webkit-border-radius-bottomleft: 3px; -webkit-border-radius-bottomright: 3px; -moz-border-radius-bottomleft: 3px; -moz-border-radius-bottomright: 3px; height: auto; }


/*****************************/
/* 		Main Styles	  		*/
/***************************/

#flash { position: relative; width: 952px; height: 372px; top: 15px; }

/*****************************/
/* 	Bottom Section Styles	*/
/***************************/

#bottomSection { position: relative; width: 952px; min-height: 372px; height: 100%; }

#sidebar { position: relative; width: 223px; height: 348px; top: 12px; }
#sidebar #photo { position: relative; width: 218px; height: 316px; background: url(../images/photoStore.png) no-repeat; left: 3px; z-index: 300; top: -91px; }
#sidebar p { width: 209px; height: 100px; background: url(../images/insideStoreCopy.jpg) no-repeat; margin: -80px 0 0 0; text-indent: -9999px; }

#rightSection { position: relative; width: 721px; height: 100%; margin: -330px 0 0 224px; }
#rightSection h2 { position: relative; width: 370px; height: 20px; top: -20px; background: url(../images/homepageHeader.jpg) no-repeat; text-indent: -9999px; }
#content { width: 662px; min-height: 254px; height: 100%; padding: 30px; background: #ffffff; }

/*****************************/
/* 		Inner Styles  		*/
/***************************/

#insideBanner {  width: 946px; height: 194px; margin-top: 18px; }
#bottomSectionInner { position: relative; width: 952px; min-height: 372px; height: 100%; top: 18px; padding-bottom: 78px; }

#sidebarInner { position: relative; width: 223px; height: 348px; }
#sidebarInner a { outline: none; border: none; }
#sidebarInner img { outline: none; border: none; }
#sidebarInner p { width: 215px; height: 100px; background: url(../images/copyInside.jpg) no-repeat; margin: 0 0 0 0; text-indent: -9999px; }


#sidebarInner #photoInner { position: relative; width: 215px; height: 277px; background: url(../images/insidePicture.png) no-repeat; left: -6px; top: -18px; z-index: 300; border: none; outline: none; text-indent: -9999px; }
#sidebarInner #photoInner a { width: 215px; height: 277px; display: block; outline: none; border: none; }
#sidebarInner #photoInner a:hover { outline: none; border: none; }
#sidebarInner #photoInner img { outline: none; border: none; }


#rightSectionInner { position: relative; width: 721px; height: 100%; margin: -338px 0 0 224px; }
#rightSectionInner h2 { position: relative; width: 370px; height: 20px; background: url(../images/homepageHeader.jpg) no-repeat; text-indent: -9999px; top: 10px; }
#contentInner { width: 662px; min-height: 254px; height: 100%; padding: 30px; background: #ffffff; margin: 30px 0 0 0; }
.header { font-family: Helvetica,Arial, sans-serif; font-size: 15px; color: #841f1f; padding: 0px; margin:0px; font-weight:bold; }

.col1 { float: left; position: relative; width: 325px;}
.col2 { float: left; position: relative; width: 335px;}


/*****************************/
/* 	    Footer Styles	    */
/***************************/

#footerStretch { height: 211px; background: url(../images/footer.jpg) #5C5B57 no-repeat; }
#footer { position: relative; width: 953px; height: 78px; margin: 0 auto; background: url(../images/footer2.png) no-repeat; }

#footerCol1 { position: absolute; width: 254px; height: 34px; left: 3px; top: 27px; background: url(../images/footerCol1.jpg) no-repeat; text-indent: -9999px; clear: both; }
#footerCol2 { position: absolute; width: 337px; height: 25px; left: 303px; top: 30px; background: url(../images/footerCol2.jpg) no-repeat; text-indent: -9999px; }
#footerCol3 { position: absolute; width: 100px; height: 78px; left: 848px; background: url(../images/footerCol3.png) no-repeat; text-indent: -9999px; }
#footerCol3 a { width: 100px; height: 78px; display: block; }