.nav-container { position: relative; *position:static;  }
.nav-container:hover { *position: relative; z-index:250; }
/* .nav-container { z-index:250; } */
#nav:hover li.over{ z-index:200; }
#nav:hover li .shown-sub{ z-index:150; }
#nav .chield{ display:none; }
/* #nav li.level-top:hover .chield{ display:block; } DM - disabling CSS menu hover handling to use JS-triggered .shown-sub instead (below) */
#nav  .shown-sub {display:block;}
/* All Levels */ /* Style consistent throughout all nav levels */
#nav li { text-align:left;	}
#nav li .level-top{ padding-bottom:12px; }

#nav li.over.parent {  }
#nav a,
#nav a:hover { display:block; line-height:1.3em; text-decoration:none; }
#nav span { display:block; cursor:pointer; white-space:nowrap; }
#nav li ul span { white-space:normal; }
#nav a { float:left; }
.blocklist li,
#nav ul.chield > li { display:block; float:left; padding: 0 10px 0 0; }
#nav .chield {width: 100%;border: 1px solid #d6d4d4;/* border-top: 4px solid #ACACAC; */}
/* 1st Level */
#nav ul li.parent {
 }
#nav ul li.last { padding-bottom:0; }
#nav ul li.active { }
#nav ul a,
#nav ul a:hover { float:none; background:none; }
#nav ul a:hover { text-decoration:underline; }
#nav > li > ul > li > a { }
.blocklist li.parent > a span,
#nav > li > ul > li.parent > a span {font-size: 12px;border-bottom: 1px solid #818181;padding-bottom: 5px;text-transform: uppercase;margin-right: 20px;}
#nav ul li a { font-weight:normal; }

/* 2nd Level */
#nav  ul,
#nav div {top: 32px;left:0;padding:3px 0 15px;background:#fff;font-size: 12px;}
.blocklist li,
#nav > li > ul >li { width: 135px; margin:0 10px 0 0; }

#nav > li.nav-2 > ul >li {width: 20%;margin:0;padding:0px;}

#nav > li.nav-4 > ul >li,
#nav > li.nav-6 > ul >li {width: 20%;margin:0;padding:0px;min-height: 295px;}
#nav > li.nav-4 > ul >li.clear,
#nav > li.nav-6 > ul >li.clear {clear:none!important;}

#nav div ul { position:static; width:auto; border:none; padding:0; }

#nav ul.level0 {position:absolute;padding: 15px 15px 15px;box-sizing: border-box;}

/* ========================== */
#nav > li > ul > li ul {margin-left:3px;}
.blocklist > li > ul > li,
#nav > li > ul > li ul > li {margin: 6px 0 6px 0;}
.blocklist > li > ul > li { margin:2px 0 2px 0; }

/* ========================== */

/* 3rd+ Level */
#nav ul ul,
#nav ul div { top:5px; padding: 5px 0px 5px;}


/* Show menu */
#nav li ul.shown-sub,
#nav li div.shown-sub { left:0; z-index:6; }
#nav li .shown-sub ul.shown-sub,
#nav li .shown-sub li div.shown-sub { left:100px; }
/********** Navigation > */
/* ======================================================================================= */


.clear {clear:both;}

#nav > li.nav-2 > ul > li ul > li {padding: 3px 3px 0px 3px;}



#nav > li.nav-3 > ul > li {width: 31%;text-align: center;box-sizing: border-box;clear: none!important;margin: 0px 1%;padding: 15px 0px 0px;}

#nav > li.nav-3 > ul:before {content:"Check out the latest trends and hottest gift collections this season!"; font-size:14px; display:block; text-align:center;}

#nav > li.nav-3 > ul > li > a {font-weight:bold; font-size:12px; text-transform:uppercase}




#nav > li.nav-3 > ul > li >a:before {
    content: "";
    background-size: 100%;
    height: 130px;
    display:block;
    margin-bottom: 10px;
		border: 1px solid #acacac;
    }

#nav > li.nav-3 > ul > li >a[href*="our-hidden-gems"]:before {background: url("/media/wysiwyg/spotlight/on-trend-high-street-bestsellers.jpg") no-repeat 0 0;}
#nav > li.nav-3 > ul > li >a[href*="led-lights"]:before {background: url("/media/wysiwyg/spotlight/on-trend-design-led-lights.jpg") no-repeat 0 0;}
#nav > li.nav-3 > ul > li >a[href*="female-designers"]:before {background: url("/media/wysiwyg/spotlight/on-trend-celebrating-female-designers.png") no-repeat 0 0;}
#nav > li.nav-3 > ul > li >a[href*="unicorns"]:before {background: url("/media/wysiwyg/spotlight/on-trend-land-of-unicorns.jpg") no-repeat 0 0;}
#nav > li.nav-3 > ul > li >a[href*="prosecco"]:before {background: url("/media/wysiwyg/spotlight/on-trend-prosecco.jpg") no-repeat 0 0;}
#nav > li.nav-3 > ul > li >a[href*="expert-buyers"]:before {background: url("/media/wysiwyg/spotlight/on-trend-from-our-expert-buyers.jpg") no-repeat 0 0;}
#nav > li.nav-3 > ul > li >a[href*="travel-in-style"]:before {background: url("/media/wysiwyg/spotlight/on-trend-travel-in-style-2018.jpg") no-repeat 0 0;}
#nav > li.nav-3 > ul > li >a[href*="bloom-into-spring"]:before {background: url("/media/wysiwyg/spotlight/on-trend-bloom-into-spring-2018.jpg") no-repeat 0 0;}
#nav > li.nav-3 > ul > li >a[href*="tv-and-film-gifts"]:before {background: url("/media/wysiwyg/spotlight/on-trend-menu-film-and-movie.jpg") no-repeat 0 0;}








#nav .nav-5-1-8,
#nav .nav-5-2-23,
#nav .nav-5-3-34 {
    
    margin-right: 50px !important;
    margin-top: 20px !important;
    border-top: dotted 1px #ccc;
}

#nav .nav-5-1-8:before,
#nav .nav-5-2-23:before,
#nav .nav-5-3-34:before {
    content:"Hot Picks by product range:";
    display:block;
    margin:10px 0px;
    text-transform:uppercase;
 


}


#nav > li.nav-5 > ul >li {width: 30% !important;margin-right:2%;padding:1%;}
#nav > li.nav-5 > ul >li.nav-5-3,
#nav > li.nav-5 > ul >li.nav-5-4,
#nav > li.nav-5 > ul >li.nav-5-5

 {margin-right:0; }


#nav > li.nav-5 .nav-5-1,
#nav > li.nav-5 .nav-5-2,
#nav > li.nav-5 .nav-5-3,
#nav > li.nav-5 .nav-5-4,
#nav > li.nav-5 .nav-5-5
 {background:#fafafa;}

 #nav > li.nav-5 .nav-5-1,
#nav > li.nav-5 .nav-5-2 {min-height: 428px;}

#nav > li.nav-5 .nav-5-1 *,
#nav > li.nav-5 .nav-5-2 *,
#nav > li.nav-5 .nav-5-3 *

 {background: #fafafa!important; }


#nav > li.nav-5 > ul > li > a span {margin-bottom:5px;}

#nav > li.nav-5 > ul >li.nav-5-3,
#nav > li.nav-5 > ul >li.nav-5-4
 {margin-bottom:10px;}

#nav > li.nav-5 > ul > li > a[href$="gifts-for-couples"] span,
#nav > li.nav-5 > ul > li > a[href$="pets-and-animals"] span

 {
    font-size: 13px;
    text-transform: uppercase;
    margin-right: 20px;
    }




@media only screen and (max-width: 919px) and (min-width: 768px) {

#nav a.level-top, #nav a:hover.level-top {line-height: 1.7em;}
.blocklist li.parent > a span, #nav > li > ul > li.parent > a span {font-size: 11px;}

#nav > li.nav-5 .nav-5-1,
#nav > li.nav-5 .nav-5-2
 {min-height: 436px;}

#nav > li.nav-3 > ul > li >a:before {height: 97px;background-size: 100%!important;}

}

/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 480px) and (max-width: 940px) {
#nav > li > ul >li { width: 98px; }
}

#nav > li > ul > li ul > li:hover {background-color: #fff!important;}

#nav > li > ul > li ul > li {background-color: #fff!important;}




