@charset "UTF-8";
body, html {
	margin:0;
	padding:0;
	}	
body {
	text-align: center;
	color: #000000;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 100%;
	background-attachment: fixed;
	background-image: url(Backgrounds/background.gif);
	}	
h1, h2, h3, h4, h5, h6, p, pre,
blockquote, ul, ol, dl, address {
	margin: 0;
	padding: 0;
	}
#container  {
	width: 780px;
	text-align: left;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	background-color: #E1F7FF;
	border: 1px solid #333333;
	} /*Hold all of the information, divs, etc on each page*/
#header  {
	height: 188px;
	position: relative;
	width: 780px;
	background-image: url(holiday/xmas/header_background_xmas.gif);
	background-repeat: no-repeat;
	} /*Holds main header graphic and the main navigation*/
#header h1 {
	margin: 0; /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. If the div has a border around it, this is not necessary as that also avoids the margin collapse */
}
#header h2 {
	margin: 0px;
	padding: 0px;
	background-image: none;
	position: absolute;
	font-size: 1.1em;
	color: #005F9B;
	top: 0px;
	right: 5px;
	text-align: right;
	width: 563px;
} /*This is the description appearing on the top right of each page*/
#header  #storeHeadInfo  {
	font-size: 0.7em;
} /*This is the description appearing on the top right of each page on the storefront*/
#header ul {
	margin: 0px;
	padding: 0px;
	font-weight: bold;
	color: #0079C1;
} 


/*Begin main navigation styling*/

#header ul li {
	margin: 0px;
	padding: 0px;
	line-height: 40px;
	display: inline;
	list-style-image: none;
	list-style-type: none;
	font-size: 1.3em;
}
#header ul a {
	text-decoration: none;
	display: block;
	background-repeat: repeat-x;
	float: left;
	text-align: center;
	width: 108px;
	height: 40px;
	margin-top: 146px;
	color: #0079C1;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-top-color: #333333;
	border-right-color: #333333;
	border-bottom-color: #333333;
	background-image: url(Backgrounds/nav_main_out.gif);
}
#header   ul   a.location {
	width: 126px;
	border-right-style: none;
}  /*increases width of the location button to fit th longer word*/


#header ul a:hover {
	color: #FFDD00;
	background-color: #0079C1;
	background-image: url(Backgrounds/nav_main_over.gif);
	background-repeat: repeat-x;
} /*changes background color of main navigation buttons when mouse cursor hovers*/
#header h1 {
	background-repeat: no-repeat;
	font-size: 1.6em;
	position: absolute;
	left: 5px;
	text-indent: -1000px;
} /*creates a text link for the home button in header; link text is pushed off page to hide it so image can be displayed*/
#header h1 a {
	background-image: url(Backgrounds/nav_home2.gif);
	display: block;
	width: 220px;
	height: 120px;
	background-repeat: no-repeat;
	background-position: left center;
	text-decoration: none;
	position: absolute;
	left: -12px;
} /*Upper left "home" button logo*/
#header h1 a:hover {
	background-position: -220px;
} /*creates rollover image change for the home button logo*/

/*Begin main page styling*/

#sidebar {
	float: right;
	width: 200px;
	padding: 0px;
	margin-right: 15px;
} /*creates a right column for all sidebars to appear on each page*/
#sidebar div {
	margin-bottom: 15px;
	margin-top: 15px;
	margin-bottom: 15px;
	margin-left: 0px;
	background-image: url(Backgrounds/sidebar_box.gif);
} /*sets properties for div tags inside sidebar - this is the main styling for each sidebar div tag.  Created as generic div modifier so that div tags in the sidebar do not need to be defined with specific id's*/
#sidebar   img.button {
	margin-top: 0px;
	margin-left: 0px;
	background-image: none;
	padding-top: 15px;
} 
#sidebar div.tombstone {
	background-image: url(Backgrounds/sidebar_discontinued.gif);
	background-repeat: no-repeat;
	text-decoration: none;
} /*creates tomstone graphic on candy page*/
#container #sidebar .tombstone a {
	text-decoration: none;
	color: #333333;
}
#sidebar div.tombstone h3 {
	font-size: 1.5em;
	text-align: left;
	padding-left: 7px;
	padding-top: 50px;
	color: #333333;
}
#sidebar div.tombstone h5 {
	font-size: 1.1em;
	text-align: center;
	padding-left: 15px;
	padding-bottom: 70px;
	color: #333333;
	padding-right: 40px;
}
#sidebar div h3 {
	padding-top: 10px;
	padding-bottom: 12px;
	text-align: center;
	color: #FFFFFF;
	text-decoration: none;
}  /*main header text for each sidebar*/
#sidebar div h5 {
	padding-top: 2px;
	padding-right: 10px;
	padding-bottom: 0px;
	padding-left: 10px;
	text-decoration: none;
}
#sidebar div p {
	padding-right: 10px;
	padding-left: 10px;
	padding-top: 5px;
	padding-bottom: 5px;
	text-align: left;
	font-size: 0.8em;
	background-image: url(Backgrounds/sidebar__bottom_box.gif);
	background-repeat: no-repeat;
	background-position: bottom;
}
#sidebar div img {
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	float: left;
}
#sidebar  a.sideBarsentenceLink {
	text-decoration: none;
} /*Removes the underline from all links in the side bar blocks*/
#container #sidebar img.coupon {
	padding-top: 5px;
	padding-bottom: 5px;
}
#mainContent {
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-right: 10px;
	padding-bottom: 0;
	padding-left: 20px;
	background-color: #E1F7FF;
	margin-right: 230px;
}
#mainContentStore {
	margin-right: 10px;
	margin-left: 10px;
}
#mainContent h1 {
	font-size: 1.6em;
	padding-left: 10px;
	background-repeat: no-repeat;
	background-position: left bottom;
	padding-bottom: 7px;
	color: #FFFFFF;
}
#mainContent h2 {
	border-bottom-width: 2px;
	border-bottom-style: solid;
	border-bottom-color: #EB048C;
	padding-top: 10px;
	font-size: 1.1em;
	padding-bottom: 1px;
	margin-bottom: 3px;
	padding-right: 5px;
	padding-left: 5px;
	margin-right: 5px;
	margin-left: 5px;
}
#mainContent  h3  {
	font-size: 1em;
	padding-top: 15px;
	padding-left: 5px;
	color: #000000;
}
#mainContent p {
	padding-top: 5px;
	font-size: 0.8em;
	padding-left: 5px;
}
#mainContent img {
	padding-right: 10px;
	padding-bottom: 5px;
	padding-top: 5px;
	float: left;
}
#mainContent  img.xmasLights {
	position: absolute;
	clear: left;
}
#mainContent  img.locationsImgLeft {
	padding-left: 12px;
}
#mainContent a img {
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
}
#mainContent ul {
	padding-top: 6px;
}
#mainContent li {
	margin-left: 25px;
	font-size: .8em;
	font-weight: normal;
	line-height: 1.4em;
}
#mainContent a.sentenceLink {
	text-decoration: none;
} /*Removes the underline from all links in the main content*/
#mainContent div.featured, #mainContent div.featuredIndex, #mainContent div.featuredCandy {
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	padding-top: 5px;
	padding-right: 5px;
	padding-bottom: 5px;
	padding-left: 5px;
	margin-top: 15px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
} /*Adds a blue background and solid border information around featured content regions defined (maincontent, index, candy)*/
#mainContent div.featured {
	background-image: url(Backgrounds/main_content_box_top.gif);
} /*Adds a blue background and solid border around featured content regions*/
#mainContent div.featured div.product {
	width: 450px;
	padding: 5px;
	margin-left: 10px;
	background-color: #E1F7FF;
	border: 1px solid #0079C2;
}
#mainContent div.featuredIndex {
	background-image: url(Backgrounds/main_content_main_box_top.gif);
} /*Adds a blue background, candy store picture, and solid border around featured content region of index main page*/
#mainContent div.featuredCandy {
	background-image: url(Backgrounds/candyPage_main_background.gif);
} /*Adds a blue background, candy collage picture, and solid border around featured content region of candy page*/
#container #mainContent p.mainContentIntroP {
	margin-top: 340px;
} /*On index page, in the main featured content box, takes the p down to just below the candy store picture*/
#container #mainContent p.mainContentCandyP {
	margin-top: 355px;
} /*On index page, in the main featured content box, takes the p down to just below the candy store picture*/
#mainContent div {
	padding-bottom: 10px;
	margin-top: 10px;
}
#mainContent div.last {
	background-image: url(Backgrounds/main_content_bottombox2.gif);
	background-repeat: no-repeat;
	padding-top: 29px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 10px;
	margin-left: 0px;
} /*Adds a blue bottom finished container to all featured items - added by creatin empty div tag with this div*/
#mainContent div p {
	padding-right: 10px;
	padding-left: 10px;
}
#store {
	margin-top: 15px;
	margin-bottom: 0px;
} /*Main container for the store information*/
#storeItems {
	width: 600px;
	margin-top: 15px;
	margin-bottom: 0px;
	text-align: center;
	margin-right: auto;
	margin-left: auto;
}

#store #storeNavigation {
	padding: 0px;
	margin-right: 15px;
	margin-left: 0px;
	background-repeat: no-repeat;
	float: right;
	width: 200px;
} /*Main right navigation within store for the various pages - created very long background image, should be able to contain most long texts, if not long enough, will need to reopen original file and enlongate the background image further*/

#store #storeNavigation2 {
	margin-top: 15px;
	float: right;
	clear: right;
	width: 200px;
	margin-right: 15px;
	text-align: center;
	background-image: url(Backgrounds/sidebar_box.gif);
} /*Second right sidebar navigation - used for the search function and the view cart function - slightly different stats than the normal navigation*/
.formField {
	padding: 0px;
	margin: 0px;
}
#store #storeSubNavigation {
	background-image: url(Backgrounds/storeMaincontent_backgroundbox_toparea.gif);
	background-repeat: repeat-x;
	margin-left: 16px;
	width: 534px;
} /*This background image is used to conatin the heading for each "Aisle" on each page*/
#store #storeSubNavigation h1 {
	font-size: 1.6em;
	color: #FFFFFF;
	padding-bottom: 7px;
	padding-left: 15px;
	padding-top: 5px;
	text-align: left;
}
#store #storeSubNavigation   p {
	text-align: center;
	width: 500px;
	padding-left: 10px;
	font-size: 14px;
	color: #000000;
}
#store #storeSubNavigation p a {
	font-weight: bold;
	line-height: 1.2em;
	text-decoration: none;
	color: #0079C1;
	font-size: 16px;
}
#store #storeSubNavigation p a:hover {
	color: #1B4691;
}
#store  div.storeSubLast {
	background-image: url(Backgrounds/main_content_bottombox2.gif);
	background-repeat: no-repeat;
	padding-top: 29px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 10px;
	margin-left: 20px;
}
#store #storeContent {
	text-align: center;
	margin-right: 230px;
	background-image: url(Backgrounds/store_shelves.gif);
	background-repeat: repeat-y;
	margin-left: 16px;
} /*This is the area where the shelving appears and the items are actually listed on each page*/
#store #storeContent p {
	font-size: 16px;
	line-height: 1em;
}
#store  #storeContent  #product {
	background-image: url(Backgrounds/jar_and_tag.gif);
	background-position: center top;
	background-repeat: no-repeat;
} /*Creates a background image for each item - simulates a jar and price tag for each item, no matter where item appears on the shelf*/
#store  #storePages {
	text-align: left;
	margin-right: 230px;
	margin-left: 25px;
	margin-top: 15px;
}
#storeItems   #storeSubtitle  p {
	font-size: 11px;
	color: #333333;
} /*Short blurb about how guest can press backspace and not lose items in shopping cart*/
#storeItems  #storeFooter, #store #storeFooter {
	clear: both;
	text-align: center;
	padding-bottom: 8px;
	padding-top: 8px;
	margin: 0px;
} /*Bottom navigation on store and product pages*/
#storeItems #storeFooter a, #store #storeFooter a {
	text-decoration: none;
	color: #0079C1;
	font-weight: bolder;
	font-size: .9em;
	font-weight: bold;
	text-decoration: none;	
} 
#storeItems #storeFooter a:hover, #store #storeFooter a:hover {
	color: #FF3399;
}


.accordionMenu{
	width: 195px; /*width of accordion menu*/
}

.accordionMenu .menuheader{ /*CSS class for menu headers in general (expanding or not!)*/
	color: white; /*bottom spacing between header and rest of content*/
	text-transform: uppercase; /*header text is indented 10px*/
	cursor: pointer;
	background-image: url(Backgrounds/nav_accordion.gif);
	background-repeat: repeat-x;
	background-position: left center;
	padding-top: 4px;
	padding-right: 0;
	padding-bottom: 4px;
	padding-left: 10px;
	margin-bottom: 2px;
	font-family: Arial;
	font-size: 14px;
	font-weight: bold;
}

.accordionMenu .openheader{ /*CSS class to apply to expandable header when it's expanded*/
	background-image: url(Backgrounds/nav_accordion_active.gif);
	color: #FFFFFF;
}

.accordionMenu ul{ /*CSS for UL of each sub menu*/
list-style-type: none;
margin: 0;
padding: 0;
margin-bottom: 8px; /*bottom spacing between each UL and rest of content*/
}

.arrowlistmenu ul li{
padding-bottom: 2px; /*bottom spacing between menu items*/
}

.accordionMenu ul li a{
color: #2C509F;
display: block;
padding: 2px 0;
padding-left: 19px; /*link text is indented 19px*/
text-decoration: none;
border-bottom: 1px solid #dadada;
font: bold 14px Arial;
}

.accordionMenu ul li a:hover{ /*hover state CSS*/
color: #A70303;
background-color: #F3F3F3;
}

#footer {
	text-align: center;
	background-color: #FFDD00;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #333333;
	padding-top: 0;
	padding-right: 10px;
	padding-bottom: 0;
	padding-left: 20px;
}
#footer  div.w3cXHTML {
	float: left;
} /*W3C logo*/
#footer div.w3cCSS {
	float: right;
} /*W3C logo*/
#footer p {
	margin: 0;
	padding: 10px 0;
	font-size: 0.8em;
	background-repeat: no-repeat;
	background-position: left center;
}
#footer a {
	text-decoration: none;
	color: #0079C1;
	font-weight: bolder;
	font-size: 1.1em;
}
#footer a:hover {
	color: #FF3399;
}
.clearfloat {
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}