

#toolbar_nav {
width:800px;
overflow:hidden;
position:relative;
z-index:99999;
border:0px solid #ccc;
background-color:#fff; margin:0;

}
#toolbar_nav h3 {font-size:16px;}

#dept_menu_nav {width:185px; float:left;}
#dept_menu_detail { float:left;}

/* Menu Styles For Mobile Screens */
@media only screen and (max-width : 700px) {

#dept_menu_nav {width:100%; float:left;}
#dept_menu_detail { display:none;}

}

/* default style */
.selectnav { display: none; }
#nav { display: none; }

/* small screen */
@media screen and (max-width: 600px) {
  .js #nav { display: none; }
  .js .selectnav { display: block; }
  #toolbar_nav { display: none; }
}




#vert_navigation, .shop_by_space , .vert_navigation{
min-width: 175px;
font-family: "Roboto", Sans-serif; z-index:999;

}
#vert_navigation, .shop_by_space, .vert_navigation ul {
list-style: none;
margin: 0;
padding: 0;
}
#vert_navigation, .vert_navigation, .shop_by_space li {
border-bottom: 1px solid #ccc;

margin-bottom:2px;
}
#vert_navigation li a:link, .vert_navigation li a:link, #vert_navigation li a:visited , .vert_navigation li a:visited ,
.shop_by_space li a:link, .shop_by_space li a:visited {
font-size: 90%;
display: block;
padding: 0.4em 0 0.4em 0.5em;
border-left: 4px solid #fff;
border-right: 0px solid #ccc;
background-color: #fff;
color: #666;
text-decoration: none;
}
#vert_navigation li a:hover, #vert_navigation li a:active , .vert_navigation li a:hover, .vert_navigation li a:active ,
.shop_by_space li a:hover, .shop_by_space li a:active {
border-left:4px solid #236645;
color: #000;
transition: border-left 0.8s ease;
}

#vert_navigation, .vert_navigation, .shop_by_space {
width: 175px;
font-family: "Roboto", Sans-serif;

}
#vert_navigation, .vert_navigation, .shop_by_space ul {
list-style: none;
margin: 0;
padding: 0;
}
#vert_navigation li, .vert_navigation li, .shop_by_space li {
border-bottom: 1px solid #ccc; line-height:17px; margin-bottom:0px;
}
#vert_navigation li a:link, #vert_navigation li a:visited ,
.vert_navigation li a:link, .vert_navigation li a:visited ,
.shop_by_space li a:link, .shop_by_space li a:visited {
font-size: 13px;
display: block;

border-left: 4px solid #fff;
border-right: 0px solid #ccc;
background-color: #fff;
color: #666;
text-decoration: none;
}
#vert_navigation li a:hover, #vert_navigation li a:active,
.vert_navigation li a:hover, .vert_navigation li a:active,
.shop_by_space li a:hover, .shop_by_space li a:active {
border-left:4px solid #236645;
color: #000;
transition: border-left 0.8s ease;
}

#dept_nav_menu {
color: red; width:200px; float:left; font-size:14px; font-family:'Roboto', sans-serif;

}
.dept_nav_menu_body {
max-width:603px;float:left;
overflow:auto; margin-bottom:5px;
}

/*To Hide them*/
.dept_nav_menu_body_blank
{
    width:0px;
    height:0px;
    overflow:hidden; 
    margin:0px;
    visibility:hidden;
}

.dept_nav_menu_body h2{font-size:18px; border-bottom:1px solid #ccc; margin:10px 0 2px 0; font-weight:bold; font-family:'Roboto', Arial,Helvetica,sans-serif; line-height:30px; }
.dept_nav_menu_body h3{padding-top:0px; font-weight:bold;font-family:'Roboto', sans-serif; font-size:14px; }

.dept_nav_space   li a{background-color:#ccc; padding:2px 2px 2px 2px; margin:2px; display:block;}


.dept_nav_menu_item a:link{
display:block;
padding:3px; 
height:18px;
text-decoration:none; 
color:#333;
padding-left:2px; 
}


.dept_nav_menu_item a:hover{
color:#000; background-color:#ccc;
}
.dept_nav_menu_item a:visited{
color:#333;
}
.dept_nav_menu_item a:active{
color:red;
}

.feature_title_box
{
	padding: 3px 3px 3px 6px; margin: 5px 0 0 0;
	font-family: 'Roboto', sans-serif;
	color: #565656; font-size:12px;
	 font-weight: bold;
	border: 1px solid #ccc;
	text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.5);
}



.feature {
border:0 1px 1px 1px solid #ccc; 
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
margin: 0 0 15px 0; padding:13px; 
font-family:'Roboto', Arial,Helvetica,sans-serif;
font-size:12px; overflow:auto;
 
}


.feature h3{margin:3px 0 8px 5px; font-weight:bold;	font-family: 'Roboto', sans-serif; font-size:14px; }
/*.feature li{}
.feature a:link { color:#2b2b2b; text-decoration:none; }
.feature a:visited { color:#2b2b2b; text-decoration:none; }
.feature a:hover { color:#2b2b2b; text-decoration:underline; }
.feature a:active { color:red; text-decoration:none; }
*/
.feature ul {float:left; overflow:hidden; margin-right:10px;}

.feature_cats {width:280px; height: 265px; overflow:hidden; float:left; margin-right:10px;}

.feature_list {height: 225px; overflow-y:scroll; overflow-x:hidden;}
.feature_list li{list-style-image:url('../images/grey_gt_bullet.png');  font-size:11px; margin-left:20px; }
.feature_list a:link { color:#2b2b2b; text-decoration:none; }
.feature_list a:visited { color:#2b2b2b; text-decoration:none; }
.feature_list a:hover { color:#2b2b2b; text-decoration:underline; }
.feature_list a:active { color:red; text-decoration:none; }


.clear {clear:both;}

.scrollable {

	/* required settings */
	position:relative;
	overflow:hidden;
	width: 520px;
	height:150px;
	
	
	

	/* custom decorations */
	border:0px solid #ccc;
	/* background:url(/content/seasonal/pop_searches/images/bg.jpg) repeat-x; */
}

/*
	root element for scrollable items. Must be absolutely positioned
	and it should have a extremely large width to accomodate scrollable items.
	it's enough that you set the width and height for the root element and
	not for this element.
*/
.scrollable .items {
	/* this cannot be too large */
	width:20000em; 
	position:absolute;
	clear:both;
}

.items div {
	float:left;
	max-width:600px;
}

/* single scrollable item */


.scrollable img {
	
	margin:0px 5px 0px 5px;
	background-color:#fff;
	padding:0px;
	border:0px solid #ccc;
	max-width:80px;
	max-height:80px;

}
.scrollable table {
	
	float:left;
	/* background:url(./images/nav_item_bg.png) no-repeat; */ 
	margin:0; padding:0;
	width:103px;
	border-right:0px dotted #ccc;
	text-align:center;
	vertical-align:middle;
	font-family:'Roboto', Arial,helvetica,sans-serif; font-weight:bold; font-size:11px; color:#333;
	text-decoration:none;

}
.scrollable table a:link { color:#002211; text-decoration:none;  }
.scrollable table a:visited { color:#002211; text-decoration:none;  }
.scrollable table a:hover { color:#002211; text-decoration:underline; }
.scrollable table a:active { color:red; text-decoration:none; }
.scrollable td{font-weight:bold; text-align:center; font-size: 13px; width:20%; line-height:15px;}

/* active item */
.scrollable .active {
	border:2px solid #000;
	position:relative;
	cursor:default;
}

/* this makes it possible to add next button beside scrollable */
.scrollable {
	float:left;	
}

/* prev, next, prevPage and nextPage buttons */
a.browse {
	background:url(./img/scroll_nav.png) no-repeat;
	display:block;
	width:30px;
	height:30px;
	float:left;
	margin:40px 10px;
	cursor:pointer;
	font-size:1px;
}

/* right */
a.right 				{ background-position: 0 -30px; clear:right; margin-right: 0px;}
a.right:hover 		{ background-position:-30px -30px; }
a.right:active 	{ background-position:-60px -30px; } 


/* left */
a.left				{ margin-left: 0px;} 
a.left:hover  		{ background-position:-30px 0; }
a.left:active  	{ background-position:-60px 0; }




/* disabled navigational button */
a.disabled {
	visibility:hidden !important;		
} 	
