/* NEW NAVIGATION HEADER CSS */
@charset "utf-8";

	/* RESET */
	#top_nav > li:not(#navLightbox) {
		position:relative !important;
		/* width:110px !important; */
		}
	#top_nav > li:not(#navLightbox),
	#top_nav .new_nav,
	#left_cap,
	#right_cap {
		z-index:1501 !important;
		}
	#account_dropdown:hover,
	#mini_basket {
		z-index:1502 !important;
		}
	.new_nav ul,
	.new_nav li {
		float:none !important;
		width:auto !important;
		background:none !important;
		-ms-box-shadow:none !important;
		-o-box-shadow:none !important;
		-moz-box-shadow:none !important;
		-webkit-box-shadow:none !important;
		box-shadow:none !important;
		}
	#top_nav li.m_and_e {
		 width: 139px !important;
		 }
		#top_nav li.m_and_e span.double {
			width:105px !important;
			}
	#top_nav li.business {
		 width: 100px !important;
		 }
	#top_nav li.education {
		 width: 108px !important;
		 }
	#top_nav li.publicsector {
		 width: 120px !important;
		 }
	#top_nav li.SolutionsServices {
		 width: 120px !important;
		 }
	#top_nav li.aboutus {
		width: 106px !important;
		 }
	#top_nav > li > a span {
		position:relative;
		top:-2px;
		}
	#top_nav > li > a span.double {
		top:-3px;
		}
	.new_nav * {
		color:inherit !important;
		-moz-box-sizing:border-box;
		-webkit-box-sizing:border-box;
		box-sizing:border-box;
		}

	/* TOP NAV */
	body.lightboxOn #top_nav,
	body.lightboxOn #left_cap,
	body.lightboxOn #right_cap {
		z-index:5001;
		}
	.top_items span {
		z-index:5;
		}

	/* NEW NAV */
	.new_nav {
		position:absolute !important;
		top:60px;
		left:0;
		opacity:0;
		display:none;

		color:#54544e !important;
		background:#fff;
		-webkit-backface-visibility: hidden;
		}
	
	.new_nav.primed {
		display:block !important;
		opacity:1 !important;
		z-index:-1000 !important;
		}
	
	#top_nav .triangle {
		position:absolute;
		bottom:-7px;
		left:50%;
		margin-left:-22px;
		height:0;
		width:0;
		border-style:solid;
		border-color:#ce6504 transparent transparent transparent;
		border-width:7px 7px 0;
		opacity:0;
		display:none;
		z-index:2000;
		}
	li.top_items:hover .triangle {
		border-top-color:#4f4e47 !important;
		}
	body.hasTouch .new_nav,							/* body.hasTouch signifies touchscreen based device. Class "hasTouch" is applied to the body element in the new_nav.js file if "ontouchstart" detected. */
	body.hasTouch #navLightbox {
		-ms-transition:opacity 0.3s ease;
		-o-transition:opacity 0.3s ease;
		-moz-transition:opacity 0.3s ease;
		-webkit-transition:opacity 0.3s ease;
		transition:opacity 0.3s ease;
		}
	body.hasTouch .top_items:hover > .new_nav,
	body.hasTouch .top_items:hover ~ #navLightbox {
		opacity:1 !important;
		display:block !important;
		}
		.new_nav_col,
		.new_nav_banner_side {
			padding:15px 20px 20px !important;
			display:table-cell;

			background:none;
			}
		.new_nav_col.store_col {
			background-color:#eeeeed !important;
			}
		.new_nav_col.store_col + .new_nav_col:not(.store_col) {
			padding-left:25px !important;
			}
		.new_nav li.new_nav_banner_side,
		.new_nav li.new_nav_banner_bottom {
			/* background:#ed711b !important; */
			-moz-background-clip:content-box	 !important;
			-webkit-background-clip:content	!important;
			background-clip:content-box !important;
			vertical-align:top !important;
			}
		.new_nav li.new_nav_banner_bottom {
			padding: 4px 4px 0 !important;
			}
			.new_nav li.new_nav_banner_side a,
			.new_nav li.new_nav_banner_side img,
			.new_nav li.new_nav_banner_bottom a,
			.new_nav li.new_nav_banner_bottom img {
				position:relative;
				height:210px;
				width:205px;
				display:block;
				background-repeat:no-repeat;
				}
				.new_nav li.new_nav_banner_side a > span,
				.new_nav li.new_nav_banner_bottom a > span {
					position:absolute;
					display:block;
					}
				.new_nav li.new_nav_banner_side a span,
				.new_nav li.new_nav_banner_bottom a span {
					width:auto !important;
					height:auto !important;
					margin:0 !important;
					}
				.new_nav li.new_nav_banner_side .glossy_butt,
				.new_nav li.new_nav_banner_bottom .glossy_butt {
					position: absolute;
					bottom: 8px;
					right: 8px;
					color:#fff !important;
					padding: 3px 10px 4px !important;
					font-size: 13px !important;
					}
				.new_nav li.new_nav_banner_side .glossy_butt_white,
				.new_nav li.new_nav_banner_bottom .glossy_butt_white {
					color:#54544e !important;
					}
					.new_nav li.new_nav_banner_side .glossy_butt img,
					.new_nav li.new_nav_banner_bottom  .glossy_butt img {
						height:auto;
						width:auto;
						display:inline-block;
						}
			.new_nav li.new_nav_banner_side a:first-child {
				margin-bottom:15px !important;
				}
			a.new_nav_header[href=""],
			.new_nav_menu > li a[href=""] {
				text-decoration:line-through !important;
				}
			a.new_nav_header:not([href=""]):hover,
			.new_nav_menu > li a:not([href=""]):hover {
				text-decoration:underline;
				}
			.new_nav_header,
			.new_nav_menu > li {
				width:145px !important;
				}
			.new_nav_banner_side > * {
				width:205px !important;
				}
			.new_nav_header {
				margin-bottom:10px !important;
				display:block;

				color:#ed711b !important;
				font-size:16px !important;
				font-weight:bold !important;
				line-height:120% !important;
				}
			a.new_nav_header {
				text-decoration:underline;
				}
			.new_nav_header:not(:first-of-type) {
				margin-top:20px !important;
				}
			.new_nav_menu > li,
			.new_nav_menu > li > * {
				font-size:14px !important;
				line-height:117% !important;
				font-weight:normal;
				}
			.new_nav_menu > li:not(:last-child) {
				margin-bottom:5px !important;
				}
			.new_nav_menu > li.space_above {
				margin-top:20px !important;
				}
			.new_nav_menu > li.demo_deals a {
				color:#c5382c !important;
				}

	/* LIGHTBOX */
	#navLightbox {
		position:fixed !important;
		top:0 !important;
		left:0 !important;
		float:none !important;
		height:100% !important;
		width:100% !important;
		background-color:hsla(0,0%,0%,0.4) !important;
		background-image:none !important;
		opacity:0;
		display:none;
		z-index:1500;
		}
		
/* ------------------------------------------------------------------------------ */
/* ------------------------------  TEST BOOLEANS -------------------------------- */
/* ------------------------------------------------------------------------------ */

	/* DEBUG MENU */
	#debugMenu {
		position:fixed;
		top:15px;
		right:15px;
		padding:15px;
		background-color:#747375;
		color:#fff;
		font-size:14px;
		z-index:50000;
		}
		#debugMenu ul {
			width:100%;
			display:table;
			}
			#debugMenu ul > li {
				background:none !important;
				display:table-row;
				float:none !important;
				}
				#debugMenu ul > li > * {
					display:table-cell;
					}
					#debugMenu ul > li > *:last-child {
						padding-left:10px;
						text-align:right;
						}
	body.debugMode #debugMenu {
		display:block !important;
		}
	body.hasTouch #debugMenu {
		display:none !important;
		}
	
	/* SIDE BANNER */
	/* Now enabled – code below is legacy */
	/* body.sideTest .new_nav_header,
	body.sideTest .new_nav_menu > li {
		width:145px !important;
		}
	body:not(.sideTest) .new_nav_banner_side {
		display:none;
		}
	body.sideTest .new_nav_banner_side > * {
		width:205px !important;
		} */
	/* 	DEFINED BY JAVASCRIPT INSTEAD
		body.fixedSideHeight .new_nav_banner_side > * {
		height:410px !important;
		} 
	*/
		
	/* BOTTOM BANNER */
	body .top_items:not(.btmTest) .new_nav_banner_bottom {
		display:none;
		}
		
	/* ALWAYS VISIBLE */
	body.alwaysVisible li.top_items:nth-of-type(2) > .triangle,
	body.alwaysVisible li.top_items:nth-of-type(2) > .new_nav,
	body.alwaysVisible #navLightbox {
		display:block !important;
		opacity:1 !important;
		}