@import "~/dist/@hy-vee/design-tokens/src/tokens.css?version=0.5.0";

/*   Top Scrollable --------------------------------------------------------------------------- */
.banner_container{
	position:relative;
}

#banner_rotator{
	position:relative;
	overflow:hidden;
	width:920px;
	height:350px;
}

#banner_rotator .items{
	width:20000em;
	height:350px;
	position:relative;
	clear:both;
}

#banner_rotator .items div{
	width:920px;
	height:350px;
	float:left;
	position:relative;
}

#banner_rotator .items div img{
	z-index:-1;
}

#banner_rotator .items div p{
	position:absolute;
	bottom:0;
	left:0;
	z-index:101;
	margin:0;
	padding:0;
}

#banner_rotator div p a{
	text-decoration:none;
	color:#333;
	display:block;
	width:487px;
	height:32px;
	padding:22px 128px 0 25px;
	background:url(https://8e3463198116a37cf901-4c8f9ce7667a46d130eda30090f49466.ssl.cf2.rackcdn.com/images/banner-shade.png) repeat-x;
	font-size:15px;
}

/* navigator */
.navi {
	position:absolute;
	top:270px;
	right:20px;
	width:88px;
	height:22px;
	z-index:200;
}

/* items inside navigator */
.navi a {
	width:12px;
	height:12px;
	float:left;
	margin:5px;
	background:url(https://8e3463198116a37cf901-4c8f9ce7667a46d130eda30090f49466.ssl.cf2.rackcdn.com/images/navi.png) 0 0 no-repeat;
	display:block;
	font-size:1px;
	cursor:pointer;
}

/* mouseover state */
.navi a:hover {
	background-position:0 -24px;
}

/* active state (current page state) */
.navi a.active {
	background-position:0 -12px;
}

/*   Bottom Scrollable ---------------------------------------------------------------------------
outmost wrapper element, containing all elements  */
.slide1{position:relative;}
#scrollable {
	position:relative;
	overflow:hidden;
	width:920px;
	height:220px;
	margin:0;
	background:#fff;
}
#scrollable .items {
	width:20000em;
	position:absolute;
	clear:both;
}
#scrollable .items div.group {
	float:left;
	width:860px;
	padding:0 30px;
}
#scrollable div.deal {
	float:left;
	width:180px;
	margin:0;
	border-right:1px solid #ccc;
	padding:0 15px;
	height:220px;
	overflow:hidden;
}
#scrollable div.deal a{
	text-decoration:none;
	color:#666;
}
#scrollable div.deal a:hover{
	text-decoration:underline;
	color:#666;
}
#scrollable div.deal:last-child {
	border-right:none;
}
#scrollable div.dealThumb{
	text-align:center;
	margin:5px 0 10px 0;
	height:130px;
}
#scrollable div.dealThumb img{
	max-width:130px;
	max-height:130px;
}
#scrollable div.dealThumb table{
	text-align:center;
	width:100%;
	height:130px;
}
#scrollable div.deal span {
	font-size:18px;
	font-weight:bold;
	color:#E4190E;
}
#scrollable div.deal span.fuelSaverText{font-size:11px;font-weight:normal;}

a.prev, a.next {
	background:url(https://8e3463198116a37cf901-4c8f9ce7667a46d130eda30090f49466.ssl.cf2.rackcdn.com/images/scroll_arrows.gif) no-repeat 0 0;
	display:block;
	width:12px;
	height:16px;
	margin:0;
	cursor:pointer;
	position:absolute;
	top:95px;
	z-index:110;
}
a.prev {left:10px;}
a.next {background:url(https://8e3463198116a37cf901-4c8f9ce7667a46d130eda30090f49466.ssl.cf2.rackcdn.com/images/scroll_arrows.gif) no-repeat -12px 0;right:10px;}
a.prev:hover {background-position:0 -16px;}
a.next:hover {background-position:-12px -16px;}
a.disabled {visibility:hidden !important;}

/*   Recipe Carousel --------------------------------------------------------------------------- */


/*   App Scrollable --------------------------------------------------------------------------- */




/* navigator */
#app_container .navi {
	position:absolute;
	top:500px;
	right:77px;
	width:110px;
	height:7px;
	z-index:200;
}

/* items inside navigator */
#app_container .navi a {
	width:7px;
	height:7px;
	float:left;
	margin:3px;
	background:url(/webres/Image/CMS/Company/small-navi.jpg) 0 -7px no-repeat;
	display:block;
	font-size:1px;
	cursor:pointer;
}

/* mouseover state */
#app_container .navi a:hover {
	background-position:0 0px;
}

/* active state (current page state) */
#app_container .navi a.active {
	background-position:0 0px;
}

#app_container a.next{
	top:215px;
	right:0px;
}

#app_container a.prev{
	top:215px;
	left:0px;
}