﻿@import url(/z_common/resources/style.css);
@import url(/z_common/resources/style_calendar_mid.css);
@import url(/z_common/resources/style_calendar_mini.css);


/*general*/

.left {float: left;}
.right {float: right;}
.small {font-size: 11px;}
.hide {display: none;}
body{
	margin:0;
	padding:0;
	border:0;
}

form {
	margin:0;
	padding-left:0;
	padding-right:0;
	padding-top:10px;
	padding-bottom:0;
	border:0;
}

h1, h2, h3, h4, h5, h6{
	margin:0;
	padding-left:0;
	padding-right:0;
	padding-top:15px;
	padding-bottom:9px;
	border:0;
}

.blue {
	color:#3366cc;
}

.red {
	color:#EA4947
}

h1, h2, h3, h4, h5, h6 {
	color:#EA4947;
}

/*layout*/
body {
	background:#ea4947 url(/images/nav/bg_main.jpg);
	font-family:Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height:16px;
	color:#333;
}

#frame {
	width:760px;
	margin:0px auto;
	float:right;
}
	
#header {
	width:760px;
}

#logo {
	float:left;
	display:inline;
	width:325px;
}

#headersubcol {
	float:right;
	display:inline;
	width:435px;
	height:100px;
	background-image:url(/images/nav/bg_search.jpg);
}

#search {
	float:left;
	display:inline;
	width:215px;
	height:65px;
	margin-top:25px;
	margin-left:35px;
	text-align:left;
	color:#425C1D;
	line-height:1.6em;
}

.searchbutton {
	margin-left:1px;
	background-color:#4B6B21;
	color: white;
	cursor:default;
	border:inset 1px #69962E;
	font-size:.9em;
}

#contactbutton {
	float:right;
	display:inline;
	margin:50px 35px 0px 0px;
}

#topgraphic {
	width:760px;
	height:175px;
	margin-top:3px;
	background-image:url(/images/nav/bg_topgraphic.jpg);
	text-align:left;
}

#containerpic {
	float:left;
	width:495px;
	height:155px;
	margin-left:10px;
	margin-top:10px;
}

.topgraphicpic {
	margin-top:12px;
	margin-left:12px;
}

#container {
	width:760px;
	margin-top:3px;
}

#leftcolumn {
	float:left;
	width:200px;
	padding-right:5px;	/*new hack*/
}
/*
#leftcolumn_2 {
	float:left;
	width:200px;
	background:#fff url(/images/nav/header_categories.jpg) top no-repeat;
}

#leftcolumn_3 {
	margin-bottom:5px;
	float:left;
	width:200px;
	background:#fff url(/images/nav/header_newsletter.jpg) top no-repeat;
}

#newsletterSubscribe {
	width:165px;
	margin:40px 5px 10px 5px;
	text-align:left;
	font-family: verdana,arial,helvetica,sans-serif;
	font-size:12px;
	text-align:center;
}
*/


#browsecategories {
	background-image:none; 
	background-color:#ffffff;
	width:190px;
	padding:0 5px;
	text-align:left;
}

#browsecategories a, #browsecategories a:visited {
	display:block;
	border-bottom:solid #ccc 1px;
	font-weight:bold;				/*CPL add*/
	color:#666666;
	text-align:left;
	text-decoration:none;
	line-height:20px;
}

#browsecategories a:hover {
	color:#000;
}

/*
#leftcolumnfooter {
	width:200px;
	height:16px;
	background-image:url(/images/nav/footer_categories.jpg);
}
*/
#rightcolumn {
	float:right;
/*	width:557px;*/
	width:760px;
	margin-left:8px;
	background:#fff url(/images/nav/bg_topcontent.jpg) top no-repeat;
}

#content {
/*	width:557px;*/
	width:760px;
	margin:15px 10px 10px 10px;
	text-align:left;
}

#homeleft {
	float:left;
	width:180px;
	margin-right:5px;
	text-align:left;
	font-size: 11px;		/*CPL add*/
	line-height:1em;		/*CPL add*/
}


#homeright {
	float:right;
/*	width:372px;*/
	width:545px;
	margin-right:5px;
	text-align:left;
}

#rightcolumnfooter {
	width:577px;
	height:16px;
	background-image:url(/images/nav/footer_content.jpg);
}

#footer {
	width:577px;
	height:40px;
	margin:3px 0px 10px 183px;
	background-image:url(/images/nav/bg_footer.jpg)
}

#leftfooter {
	float:left;
	text-align:left;
	line-height:1.4em;
	margin:5px 0px 0px 15px;
	font-size:.86em;
	color:#666666;
}

#rightfooter {
	float:right;
	text-align:right;
	margin:12px 15px 0px 0px;
	font-size:.86em;
	color:#666666;
}

#rightfooter a, a:visited {
	text-decoration:none;
	color:#666666;
	font-weight:bold;
}

#rightfooter a:hover {
	text-decoration:underline;
	color:#666666;
}

a, a:visited {
	color:#666666;
	text-decoration:underline;
}

a:hover {
	text-decoration:none;
}

/*clearing*/
#frame:after, #header:after, #container:after, #content:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

/*CPL special*/
#rightcolumn_760 {
	float:right;
	width:760px;
	background:#fff url(/images/nav/bg_topcontent_760.jpg) top no-repeat;
}

#content_760 {
	width:740px;
	margin:15px 10px 10px 10px;
	text-align:left;
}

#rightcolumnfooter_760 {
	width:760px;
	height:16px;
	background-image:url(/images/nav/footer_content_760.jpg);
}

#footer_760 {
	width:760px;
	height:40px;
	margin:3px 0px 10px 0px;
	background-image:url(/images/nav/bg_footer_760.jpg)
}

#flyout {
	width:760px;
	height:30px;
	margin:3px 0px 0px 0px;
	background-image:url(/images/nav/bg_categories_long.jpg)
}

.highlightit       img{filter:alpha(opacity=100);-moz-opacity: 1;}
.highlightit:hover img{filter:alpha(opacity= 50);-moz-opacity: 0.5;}
.hdrPanel {
	margin-left:5px;
	background-color:#4B6B21;
	color: white;
	font-size:.9em;
}
a.hdrPanel:link		{ text-decoration:underline; color:#ffffff; font-weight:bold; }
a.hdrPanel:visited	{ text-decoration:none; color:#ffffff; font-weight:bold; }
a.hdrPanel:hover	{ text-decoration:underline; color:#ffffff; font-weight:bold;}

/*--- ecElite overrides ---*/
.pName		{ color:#333;font-size:12px;margin-top:0}
.pDetails	{ color:#333;font-size:12px;line-height:14px;font-style:normal;}
.condense{
	display:block;							/*default ecElite class added to pDetails to enable show more/less; required mainly for Safari/Chrome*/
}
.condense_control{
	background:#e0e0e0;
	padding:0px 2px;
	color: blue;
	font-size:11px;
	font-weight: bold;
	white-space:nowrap;
	border: 1px solid #999; 				/*default color generally works nicely with the following shadow CSS for modern browsers and degardes OK for IE*/
	-moz-box-shadow: 1px 1px 5px #999;		/*FF3.5; shadow horizontal offset, vertical offset, blur, color (other advanced options available) */
	-webkit-box-shadow: 1px 1px 5px #999;	/*Safari/Chrome*/
	box-shadow: 1px 1px 5px #999;			/*FF4, IE9, Opera10.5*/
	-webkit-border-radius: 5px;				/*Safari/Chrome*/
	-moz-border-radius: 5px;				/*FF3.6*/
	border-radius: 5px;						/*FF4, IE9, Opera10.5*/
}
.condense_control:hover{
	text-decoration: underline;
}
.condense_control_more{
	background:#e0e0e0;
}
.condense_control_less{
	background:#aaa;
}

.list_categories_and_products_container{
  width: 700px;
  margin:0 auto;			/*center the container in the available space*/
  padding:10px;				/*padding inside the container; bumps total width/height*/
  text-align:left;
}

/* z_common OVERRIDES */
#z_calendar_full_container{	width: 100%;padding:0;margin:0}

/* MINI Calendar Overrides */
#z_loadingAjaxCalMini {position:absolute;left:23%;top:400px; padding:25px 15px; background:#999;color:#fff;display:none;}	/* loading animation - MINI VERSION */
#z_ajaxCalendarNavMini {background-color: #4B6B21;}	/* PREVIOUS/NEXT month panel - MINI VERSION */

#scrollingContainer_1{
	position: relative;
	margin:auto;
	width: 500px;
	height: 100px;
	background-color: #f9e8df;
	overflow: hidden;
	padding: 10px;
	text-align:left; 
	border: 1px solid #666; 				/*container border*/
	-moz-box-shadow: 4px 4px 5px #999;		/*FF3.5; shadow horizontal offset, vertical offset, blur, color (other advanced options available) */
	-webkit-box-shadow: 4px 4px 5px #999;	/*Safari/Chrome*/
	box-shadow: 4px 4px 5px #999;			/*FF4, IE9, Opera10.5*/
	-webkit-border-radius: 10px;			/*Safari/Chrome*/
	-moz-border-radius: 10px;				/*FF3.6*/
	border-radius: 10px;					/*FF4, IE9, Opera10.5*/
}


/* ######### Begin Mega Menu ######### */
.black ul, .black li {
list-style: none;
padding: 0;
margin: 0;
}


/* Reset code to remove theme inherent styling */
#mega-menu ul, #mega-menu li {
list-style: none;
padding: 0;
margin: 0;
}
#mega-menu ul {
display: none; /* Hides non-mega links */
}

#mega-menu .sub ul {
display: block; /* overrides above hide */
}
 
/* Main menu styles */
#mega-menu {
background: #222 url(/z_common/js/mega-menu/css/skins/images/bg_black.png) repeat-x 0 -80px;
width: 758px;
height: 40px;
border-right: 1px solid #1B1B1B;
border-left: 1px solid #1B1B1B;
position: relative; /* Important - required for positioning of mega menu */
font: normal 12px Arial, sans-serif;
line-height: 16px;
z-index:1000;		/* required for IE7 to keep menu on top of Skitter, etc*/
}
#mega-menu li {
float: left;
font-weight: bold;
}
#mega-menu li a {
float: left;
display: block;
padding: 12px 17px 12px 17px;
background: url(/z_common/js/mega-menu/css/skins/images/bg_black.png) repeat-x 100% 0;
color: #fff;
text-shadow: 1px 1px 1px #000;
text-decoration: none;
}
#mega-menu li.mega-hover a, #mega-menu li a:hover {
background-position: 100% -40px;
color: #000;
text-shadow: none;
}
 
/* Arrow tag for parent links */
#mega-menu li a.dc-mega {
padding-right: 26px; /* Additional padding for arrow */
position: relative; /* Required for arrow positioning */
}
#mega-menu li a .dc-mega-icon {
display: block;
position: absolute;
top: 18px;
right: 15px;
width: 8px;
height: 6px;
background: url(/z_common/js/mega-menu/css/skins/images/arrow.png) no-repeat 0 0;
}
#mega-menu li.mega-hover a .dc-mega-icon {
background-position: 0 100%;
}
 
/* Mega Menu Styling */
/* Mega Drop Down Container */
#mega-menu li .sub-container {
position: absolute; /* Required */
background: url(/z_common/js/mega-menu/css/skins/images/bg_sub_left_ds.png) no-repeat 0 100%;
padding-left: 10px;
margin-left: -3px;
}
#mega-menu li .sub {
background: url(/z_common/js/mega-menu/css/skins/images/bg_sub_ds.png) no-repeat 100% 100%;
padding: 20px 20px 20px 10px;
}
#mega-menu li .sub-container.mega .sub {
padding: 20px 10px 0 0;
}
#mega-menu li .sub .row { /* Clear the sub-menu floats */
width: 100%;
overflow: hidden;
clear: both;
}
#mega-menu li .sub li {
float: none;
font-size: 1em;
font-weight: bold;
}
/* Sub-menu Headers */
#mega-menu li .sub li.mega-hdr { /* Sub-menu headers - i.e. 2nd level navigation */
float: left; /* Float the sub-menus and give them a fixed width to from the mega menu rows */
width: 340px; /*original 260*/
margin: 0 10px 20px 10px;
border: 1px solid #ccc;
}
#mega-menu li .sub a { /* Clear the styles from the top-level links and set the font styles */
background: none;
border: none;
text-shadow: none;
color: #111;
padding: 7px 10px;
display: block;
float: none;
text-decoration: none;
font-size: 0.9em;
}
#mega-menu li .sub li.mega-hdr a.mega-hdr-a {
padding: 7px 10px;
margin-bottom: 5px;
border-bottom: 1px solid #ccc;
text-transform: uppercase;
font-weight: bold;
color: #000;
background: #EAEAEA url(/z_common/js/mega-menu/css/skins/images/bg_hdr.png) repeat-x center center;
}
#mega-menu li .sub li.mega-hdr a.mega-hdr-a:hover {
color: #000;
text-shadow: none;
}
 
/* Add the custom coded individual sub-menu backgrounds for root-attached ec_categories*/
#mega-menu li .sub li#sm_5 {
background: url(/files/image/categories/5.jpg) no-repeat 145px 40px;
}
#mega-menu li .sub li#sm_4 {
background: url(/files/image/categories/4.jpg) no-repeat 145px 40px;
}
#mega-menu li .sub li#sm_2 {
background: url(/files/image/categories/2.jpg) no-repeat 145px 40px;
}
#mega-menu li .sub li#sm_24 {
background: url(/files/image/categories/24.jpg) no-repeat 145px 40px;
}


 
/* Style the 3rd level links */
#mega-menu li .sub li ul li {
margin-right: 90px;
}
#mega-menu .sub li.mega-hdr li a {
color: #444;
font-weight: normal;
padding: 3px 0 3px 25px;
background: url(/z_common/js/mega-menu/css/skins/images/bullet.png) no-repeat 10px 8px;
}
#mega-menu .sub li.mega-hdr li a:hover {
color: #990000;
background-image: url(/z_common/js/mega-menu/css/skins/images/bullet_on_red.png);
}
 
/* Styling for items with only 2 levels */
#mega-menu li .sub-container.non-mega .sub {
padding: 20px 20px 20px 10px;
}
#mega-menu li .sub-container.non-mega li {
width: 190px; /* Set the drop down width */
}
#mega-menu li .sub-container.non-mega li a {
padding: 7px 5px 7px 22px;
background: url(/z_common/js/mega-menu/css/skins/images/bullet.png) no-repeat 5px 12px;
}
#mega-menu li .sub-container.non-mega li a:hover {
color: #990000;
background-image: url(/z_common/js/mega-menu/css/skins/images/bullet_on_red.png);
}
/* ######### End Mega Menu ######### */

	#newsletter_subscribe {
		background-color: #E1E1C3;
	    border: 2px solid #666;
	    color: #444444;
	    font-family: verdana,arial,helvetica,sans-serif;
	    font-weight: bold;
	    padding: 5px 5px;
	    text-decoration: none;
		-moz-border-radius-bottomright: 5px;
		-khtml-border-radius-bottomright: 5px;
		-webkit-border-bottom-right-radius: 5px;
		-moz-border-radius-bottomleft: 5px;
		-khtml-border-radius-bottomleft: 5px;
		-webkit-border-bottom-left-radius: 5px;
		-moz-border-radius-topleft: 5px;
		-khtml-border-radius-topleft: 5px;
		-webkit-border-top-left-radius: 5px;
		-moz-border-radius-topright: 5px;
		-khtml-border-radius-topright: 5px;
		-webkit-border-top-right-radius: 5px;		
	}

	#newsletter_subscribe:hover {
		background-color: #CCCC99;
	
	}	

