.topAd
	{
		margin: 0 auto;
		max-width: 992px;
		max-width: 80em;
		width: 100%;

		height: 30px;
	}
	
	.head
	{
		width: 100%;	
		font-family: HelvLight, Century Gothic;		
		border-bottom: 1px solid #00864b; 		
	}
	
	.headInner 
	{
		padding: 5px 0 5px 20px;
		position: relative;
		
		font-weight: bold;
		background-color: #62c195;
	}
	
	.subNav
	{
		text-align: center;
		margin: 0.5em 0px;
		position: relative;
	}

	.logo
	{
		float: left;
		font-size: 28px;
		margin: 0;
		padding: 0;
	}

	.logoGrocery, 	.logoSavings
	{
		color: white;
	}
	
	.menuBar
	{
		border-bottom: 0 none;
		box-shadow: 0 0 5px rgba(0, 0, 0, 0.25);
		position: relative;

		background-color: #62c195;
		
		color: #FFFFFF;
		text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);	
		
		box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.3);
		/* larger bottom shaow */
		box-shadow: 0 4px 4px 1px rgba(0, 0, 0, 0.3);
	}

	.menuBarInner
	{
		margin: 0 auto;
		width: 100%;

		background: #529c0a;
		background: #62c195;
/*
		background-image: -webkit-gradient(linear, center top, center bottom , from(#7EC638), to(#62c195));	
		background-image: -moz-linear-gradient(center top , #7EC638, #62c195);

		background-color: #529c0a;
		background-image: -moz-linear-gradient(center top , #7EC638, #529c0a);
*/
	}
	
	.menu
	{
		float: left;
		font-size: 20px;
	}

	.subMenu
	{
	}
	
	.subMenu ul
	{
		padding-left: 0;
		margin: 0;
		list-style: none;
	}
	
	.subMenu ul li 
	{
		display:inline;
		margin: 0px;
		text-align: center;
		// border-bottom: 2px solid #f47a6b;
		border-right: 1px solid #7EC638;

		padding:0px 10px;		
		margin: 5px 0;
	}	
	
	.subMenu ul li a
	{
		color: black;
		text-decoration: none;
		font-weight: normal;
	}
	
	.subMenu ul li a:hover, .subMenuActive
	{
		font-weight: bold;
		border-bottom: 4px solid #00864b;
	}
	
	div.menu ul
	{
		padding-left: 0;
		margin: 0;
		list-style: none;
	}

	div.flyers ul li 
	{
		float: left;
		margin: 0px;
	}
	
	.menu ul li 
	{
		float: left;
		margin: 0px;
		text-align: center;
		border-right: 1px solid #7EC638;

		padding:0px 20px;		
		margin: 5px 0;
	}
	
	.menu ul li a
	{
		color: white;
		text-decoration: none;
		font-weight: normal;
	}
	
	div.menu ul li a:hover
	{
		font-weight: bold;
		color: white;
	}
	
	div.menuRight
	{
		float: right;
		padding-right: 3em;
		font-size: 80%;
	}

	div.menuRight ul, ul 
	{
	}
	
	div.menuRight ul li 
	{
		float: left;
		margin: 0px;
		text-align: center;
		border-right: 1px solid #7EC638;

		padding:0px 10px;
		margin: 5px 0;
	}

	div.menuRight ul li a
	{
		color: white;
		text-decoration: none;
	}

	.search-icon
	{
		height:24px;
	}
	
	
	
	.menuColorGreen
	{
		color: #7EC638;
	}
	
	.menuColorBlue
	{
		color: #3C9DD0;
	}
	
	.menuColorRed
	{
		color: #BF5030;
	}
	
	.menuColorYellow
	{
		color: #ffba00;
	}
	
	.menuColorOrange
	{
		color: #e5a44f;
	}

	.menuColorPurple
	{
		color: #aa38c6;
	}

	.colorLightGray
	{
		color: #cbc9ca;
	}
	
	.colorDarkGray
	{
		color: #747474;
	}
	
	div.clear
	{
		clear: both;
	}
	
	.fontBold
	{
		font-weight:bold;
	}
	
	.content
	{
		margin: 0 auto;
		max-width: 992px;
		padding: 15px 0;
		width: 100%;
	}

#navigationBottom
{
  background: url(../../images/bottomSectionBg.gif) 0 3px repeat-x;
  background: #7EC638 repeat-x;
  background: #efefef repeat-x;
  margin-top: 10;
  padding: 0;
}

#navigationBottom a:hover
{
	color: black;
}

#navigationBottomInner
{
	height: 140px;
	margin: 0 auto;
	padding: 0px 30px;
	text-align: center;
}

#navigationBottomInner a
{
	clear: left;
}

.navigationBottomInnerSection
{
	width: 33.3%; 
	height: 100%;	
}

.copyright
{
	vertical-align: middle; 
	height: 40px; 
	background-color: #7ec638;
	opacity: 0.6
}

.blogComments
{
	max-height: 600px;
	overflow:auto;

	background-color: #EFEFEF;
}

.warningSection
{
	background-color: #EEC998;
    border: 1px solid #E5A44F;	
}

.warningSectionGreen
{
	background-color: #7EC638;
    border: 1px solid #529c0a;	
}

.warningSection div, .warningSectionGreen div
{
	background: url("/images/warning.png") no-repeat;
	background-size: 45px 39px;
	background-position:8px 8px;
	padding: 10px 10px 10px 60px;
}

/* search form 
-------------------------------------- */
.searchBox
{
	float: left;
	padding: 5px 0px 0px 80px;
}

.searchform {
	display: inline-block;
	zoom: 1; /* ie7 hack for display:inline-block */
	*display: inline;
	border: solid 1px #d2d2d2;
	padding: 3px 5px;
	
	-webkit-border-radius: 2em;
	-moz-border-radius: 2em;
	border-radius: 2em;

	-webkit-box-shadow: 0 1px 0px rgba(0,0,0,.1);
	-moz-box-shadow: 0 1px 0px rgba(0,0,0,.1);
	box-shadow: 0 1px 0px rgba(0,0,0,.1);

	background: #f1f1f1;
	background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ededed));
	background: -moz-linear-gradient(top,  #fff,  #ededed);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ededed'); /* ie7 */
	-ms-filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ededed'); /* ie8 */
}
.searchform input {
	font: normal 12px/100% Arial, Helvetica, sans-serif;
}
.searchform .searchfield {
	background: #fff;
	padding: 6px 6px 6px 8px;
	width: 202px;
	border: solid 1px #bcbbbb;
	outline: none;

	-webkit-border-radius: 2em;
	-moz-border-radius: 2em;
	border-radius: 2em;

	-moz-box-shadow: inset 0 1px 2px rgba(0,0,0,.2);
	-webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.2);
	box-shadow: inset 0 1px 2px rgba(0,0,0,.2);
}
.searchform .searchbutton {
	color: #fff;
	border: solid 1px #494949;
	font-size: 11px;
	height: 27px;
	width: 27px;
	text-shadow: 0 1px 1px rgba(0,0,0,.6);

	-webkit-border-radius: 2em;
	-moz-border-radius: 2em;
	border-radius: 2em;

	background: #5f5f5f;
	background: -webkit-gradient(linear, left top, left bottom, from(#9e9e9e), to(#454545));
	background: -moz-linear-gradient(top,  #9e9e9e,  #454545);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#9e9e9e', endColorstr='#454545'); /* ie7 */
	-ms-filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#9e9e9e', endColorstr='#454545'); /* ie8 */
}

/* up arrow back to top - http://webdesignerwall.com/tutorials/animated-scroll-to-top/comment-page-3 */
#back-top {
	position: fixed;
	bottom: 30px;
	right: 0px;
}

#back-top a {
	width: 108px;
	display: block;
	text-align: center;
	text-transform: uppercase;
	text-decoration: none;
	color: #bbb;

	/* transition */
	-webkit-transition: 1s;
	-moz-transition: 1s;
	transition: 1s;
}
#back-top a:hover {
	color: #000;
}

/* arrow icon (span tag) */
#back-top span {
	width: 40px;
	height: 40px;
	display: block;
	margin-bottom: 7px;
	background: #62c195 url(/images/upArrow.png) no-repeat center center;

	/* rounded corners */
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;

	/* transition */
	-webkit-transition: 1s;
	-moz-transition: 1s;
	transition: 1s;
}
#back-top a:hover span {
	background-color: #018989;
}

/* arrows to flip pages on flyer */
.pageFlipArrows
{
	position:absolute;
	width: 40px;
	height: 40px;
	z-index: 999;
	display: none;
}

.pageFlipArrows img
{
	opacity:0.75;
	filter:alpha(opacity=75);
}

.pageFlipArrows img:hover
{
	opacity:1;
	filter:alpha(opacity=100);
}

.mobileLogo
{
	position: absolute; 
	left: 30%;
	font-size: 230%;
}

.mobileButtonBg
{
	margin: 0.4em; 
	border-radius: 10px !important; 
	background-color: #518919;
}

.mobileButtonBg div
{
	padding: 5px 20px;
}

.onlineGroceryStoreFlyerInfo
{
	border: 1px solid #00864b; 
}

.flyer
{
/******** controls flyer image width *********************************************/
  max-width:85%;
  max-height:100%;
/* 
https://codeburst.io/keeping-aspect-ratio-with-html-and-no-padding-tricks-40705656808b
*/
}

#bb-flyers
{
	/*
	// confine image height to 75% of vertical height to resize image to fit above fold
	height:75vh;
	*/
}

.effectiveFlyerDate
{
	background-color: #018989;
	color: white;
	font-size: 130%;
	padding:0.3em 0px;
}

.effectiveFlyerDate a
{
	color: white;
	text-decoration: none;
}

#seeMoreFlyers
{
	cursor: pointer;
	display: inline-block;
}

.flyersFromSameStore
{
	display:none;
}

.effectiveFlyerDateMainFlyer
{
	display: inline-block; 
	padding-right: 2em;
	text-align:center;
}

.effectiveFlyerDateOtherFlyers
{
	border-left: 1px solid;
	padding-left: 2em;
	display: inline-block; 
	text-align:left;
}

/* need everything beleow for migration to .aspx */
#currentPage
{
	position:absolute; 
	top:0px; 
	right:0px; 
	background-color: #7f7f7f;
	
	padding: 10px;
	font-size: 22px;
	z-index: 999;
}

.nextPage
{	
	height:90%;
	position: absolute; 
	top: 10%; 
	right:0px; 
	z-index:999; 
	background: rgba(0,0,0,0.15);
	opacity: .6;
	vertical-align: middle;
}

.previousPage
{	
	height:90%;
	position: absolute; 
	top: 10%; 
	left:0px; 
	z-index:999; 
	background: rgba(0,0,0,0.15);
	opacity: .6;
	vertical-align: middle;
}

.nextPage a, .previousPage a
{
	height: 100%;
}

.nextPage:hover, .previousPage:hover
{
	opacity: 0.9;
}

/*
 categories box
*/
#categories 
{
    border-collapse: collapse;
    width: 100%;
	font-color:black;
}

#categories td, #categories th {
    border-left: 1px solid #ddd;
	border-right: 1px solid #ddd;
    padding: 8px 10px;
	cursor: pointer;
}

#categories th {
	cursor: default;
}

#categories td.last
{
	border-bottom: 1px solid #ddd;
}

#categories tr:hover, #categories .active
{background-color: #ddd;}

#categories th {
    padding-top: 12px;
    padding-bottom: 12px;
    text-align: left;

	background-color: #00864b;
	background-color: #006e6f;
	background-color: #3498db;
	background-color: #018989;
	color: white;
}

#categories a
{
	text-decoration: none;
	color: #929aa2;
}


/*
.nav 
{
	display: inline-block;
	width: 30px;
	height: 30px;
	text-align: center;
	border-radius: 2px;
	background: #72b890;
	color: #fff;
	font-size: 0;
	margin: 2px;
}

.navButtonPrevious:before, .navButtonFirst:before {
-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-ms-transform: rotate(180deg);
transform: rotate(180deg);
}

.navButton:before 
{
    display: block;
    font-family: 'arrows';
    font-size: 20px;
    font-style: normal;
    font-variant: normal;
    font-weight: normal;
    line-height: 30px;
    text-transform: none;
}

.navWrapper
{
    background: none repeat scroll 0 0 #72B890;
    border-radius: 2px 2px 2px 2px;
    color: #FFFFFF;
    display: inline-block;
    font-size: 0;
    height: 30px;
    margin: 2px;
    text-align: center;
    width: 30px;
}
*/