#nav_wrapper nav * {
	color: #58595b;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}

#nav_wrapper nav a:not(.empty-node):hover {
	color: #9e9b98;
}

#nav_wrapper nav .menu > li > a {
	font-weight: 600;
}

#nav_wrapper nav .search .svg_wrapper {
	cursor: pointer;
	height: 2rem;
	margin-top: -0.25rem;
	width: 2rem;
}
#nav_wrapper nav .search .svg_wrapper .svg_stroke { stroke: #58595b !important; }
#nav_wrapper nav .search .svg_wrapper .svg_fill { fill: #58595b !important; }
#nav_wrapper nav .search .svg_wrapper:hover .svg_stroke { stroke: #9e9b98 !important; }
#nav_wrapper nav .search .svg_wrapper:hover .svg_fill { fill: #9e9b98 !important; }


/* CSS3 MEDIA QUERIES */


/* NON-PHONE NAVIGATION (content area over 783 pixels) */
@media screen and (min-width: 783px) {

	#header {
		background: transparent url('../img/tccp-header-bg.png') center bottom no-repeat;
		background-size: cover;
		height: 12rem;
		position: relative;
		z-index: 3;
	}
	#header_underlay + .hero { margin-top: -2rem; } /* Makes wavy bottom edge of header overlap hero image */

		#logo {
			background-position: center bottom;
			height: 8rem;
			overflow: visible;
			position: absolute; top: 2rem; left: 50%;
			transform: translateX(-50%);
			width: 30%;
		}
	
			#logo a {
				display: block;
				position: absolute; top: 0; right: 0; bottom: 0; left: 0;
			}
		
			#logo h1 { text-indent: -9999px; }
		
		#nav_handle { display: none; }
	
			#nav_handle .hamburger { }
	
		#nav_wrapper { }
	
			#nav_wrapper nav {
				display: inline-block;
				position: absolute; bottom: 0;
				white-space: nowrap;
			}
		
			nav#primary_navigation {
				right: 66.667%;
				text-align: right;
			}
		
			nav#auxiliary_navigation {
				left: 66.667%;
				text-align: left;
			}

				#nav_wrapper nav > * {
					display: inline-block;
					vertical-align: top;
				}
			
				#nav_wrapper nav .menu { }
			
				#nav_wrapper nav .menu > li {
					display: inline-block;
					margin: 0 1rem -1.25rem 1rem;
					padding-bottom: 1.5rem;
					position: relative;
					z-index: 1;
				}
			
				#nav_wrapper nav .menu > li:hover {
					z-index: 2;
				}
			
					#nav_wrapper nav .menu > li > .sub-menu { display: none; }
			
					#nav_wrapper nav .menu > li:hover > .sub-menu {
						background: #ffffff;
						box-shadow: 0 2px 2px rgba(0,0,0,0.1);
						display: block;
						font-size: 80% !important;
						padding: 1rem 1.5rem 0.5rem 1.5rem;
						position: absolute; top: calc(100% - 2rem); left: -1.5rem;
						text-align: left;
					}
					#nav_wrapper nav:last-of-type .menu > li:last-of-type:hover > .sub-menu {
						right: -1.5rem; left: auto;
					}
				
						#nav_wrapper nav .menu > li > .sub-menu > li {
							margin-bottom: 0.5rem;
						}
						
						#nav_wrapper nav .menu > li > .sub-menu a {
							display: block;
						}
		
			#nav_wrapper nav form.search {
				clear: none;
				display: inline-block;
				margin: 0 1.5rem;
				width: 2rem;
			}
		
				#nav_wrapper nav .search .search_fields_wrapper {
					position: relative;
					width: 200px;
				}
			
				#nav_wrapper nav .search input[type=text] { display: none; }
				#nav_wrapper nav .search input[type=submit] { display: none; }
			
				#nav_wrapper nav.search_open .search input[type=text] {
					border: none;
					box-shadow: 0 2px 2px rgba(0,0,0,0.1);
					display: block;
					height: 44px;
					line-height: 22px;
					padding: 11px 4rem 11px 1rem;
					position: absolute; top: 100%; right: calc(200px - 2rem);
					text-transform: none;
					width: 15rem;
				}
			
				#nav_wrapper nav.search_open .search input[type=submit] {
					background: transparent;
					display: block;
					height: 2.5rem;
					overflow: hidden;
					position: absolute; top: 100%; right: calc(200px - 2rem);
					text-indent: -9999px;
					width: 2.2rem;
					z-index: 2;
				}
				#nav_wrapper nav.search_open .search::after { /* ::after doesn't work on input */
					color: #e66a1f !important;
					content: 'GO';
					display: block;
					font-size: 80%;
					height: 2.5rem;
					line-height: 2.5rem;
					position: absolute; top: 2rem; right: 2rem;
					width: 2.2rem;
					z-index: 1;
				}
				#nav_wrapper nav.search_open .search:hover::after {
					color: #919a4e !important;
				}

	#header_sidebar { }
	
		#header_sidebar .widget { display: none; }
	
		#header_sidebar .widget:nth-of-type(1) {
			display: inline-block;
			position: absolute; top: 1rem; left: 1.5rem;
		}

		#header_sidebar .widget:nth-of-type(2) {
			display: inline-block;
			position: absolute; top: 1rem; right: 1.5rem;
		}
		
			#header_sidebar .widget a.hover_animation {
				background-color: transparent;
				background-repeat: no-repeat;
				display: inline-block;
				font-weight: bold;
				height: 60px;
				line-height: 60px;
				text-transform: uppercase;
			}
			/* For preloading hover background images */
			#header_sidebar .widget a.hover_animation::after {
				display: block;
				height: 0;
				position: fixed; top: -9999px; left: -9999px;
				visibility: hidden;
				width: 0;
			}
			
			#header_sidebar .widget a.hover_animation.newsletter {
				background-image: url('../img/animations/newsletter-static.png');
				background-position: right 4px;
				background-size: 50px;
				color: #00bcdd !important;
				padding: 0 60px 0 0;
			}
			#header_sidebar .widget a.hover_animation.newsletter::after {
				content: url('../img/animations/newsletter-animated.gif');
			}
			#header_sidebar .widget a.hover_animation.newsletter:hover {
				background-image: url('../img/animations/newsletter-animated.gif');
			}

			#header_sidebar .widget a.hover_animation.curbside {
				background-image: url('../img/animations/curbside-static.png');
				background-position: left 3px;
				background-size: 47px;
				color: #00bcdd !important;
				padding: 0 0 0 52px;
			}
			#header_sidebar .widget a.hover_animation.curbside::after {
				content: url('../img/animations/curbside-animated.gif');
			}
			#header_sidebar .widget a.hover_animation.curbside:hover {
				background-image: url('../img/animations/curbside-animated.gif');
			}

			#header_sidebar .widget a.hover_animation.delivery {
				background-image: url('../img/animations/delivery-static.png');
				background-position: left top;
				background-size: 55px;
				color: #e66a1f !important;
				padding: 0 0 0 65px;
			}
			#header_sidebar .widget a.hover_animation.delivery::after {
				content: url('../img/animations/delivery-animated.gif');
			}
			#header_sidebar .widget a.hover_animation.delivery:hover {
				background-image: url('../img/animations/delivery-animated.gif');
			}

			#header_sidebar .widget a.hover_animation.delivery_right {
				background-image: url('../img/animations/delivery-right-static.png');
				background-position: right -4px;
				background-size: 60px;
				color: #e66a1f !important;
				padding: 0 65px 0 0;
			}
			#header_sidebar .widget a.hover_animation.delivery_right::after {
				content: url('../img/animations/delivery-right-animated.gif');
			}
			#header_sidebar .widget a.hover_animation.delivery_right:hover {
				background-image: url('../img/animations/delivery-right-animated.gif');
			}

}


/* LARGE SCREENS (content area over 1600 pixels) */
@media screen and (min-width: 1600px) {

	nav#primary_navigation { right: 65%; }

	nav#auxiliary_navigation { left: 65%; }

	#nav_wrapper nav .menu > li { margin: 0 1.5rem -1.5rem 1.5rem; }

}


/* SMALLER COMPUTERS (content area under 1200 pixels) */
@media screen and (max-width: 1200px) {

}
@media screen and (max-width: 1200px) and (min-width: 783px) {

	#header { height: 10.5rem; }
	
	#logo { height: 7rem; top: 1.25rem; }

	#nav_wrapper nav { font-size: 90%; }

	#nav_wrapper nav .menu > li { margin: 0 1rem -1rem 1rem; }

	#nav_wrapper nav .search .svg_wrapper { margin-top: -0.5rem; }

}


/* TABLETS (content area under 1024 pixels) */
@media screen and (max-width: 1024px) {

	#header { height: 9rem; }
	
	#logo { height: 7rem; top: 0.5rem; }

		#header_sidebar .widget:nth-of-type(1),
		#header_sidebar .widget:nth-of-type(2)
		{ top: 0.5rem; }

}
@media screen and (max-width: 1024px) and (min-width: 783px) {

	#nav_wrapper nav .menu > li { margin: 0 0.667rem -1rem 0.667rem; }

}


/* PHONES (content area under 782 pixels) */
@media screen and (max-width: 782px) {

	#header {
		background: #ffffff;
		height: auto;
		min-height: 60px;
		position: fixed; top: 0; right: 0; bottom: auto; left: 0;
		z-index: 3;
	}
	body.admin-bar #header { top: 45px; }
	body.scrolled #header { box-shadow: 0 0 1px rgba(0,0,0,0.25); }
	
	#logo {
		background-position: left center;
		height: 50px;
		position: absolute; top: 5px; left: 1.5rem;
		width: 60%;
	}

		#logo a {
			display: block;
			position: absolute; top: 0; right: 0; bottom: 0; left: 0;
		}

	body.nav_open { overflow: hidden; }

	.social_media_links:not(.text) li { margin: 0 10px 1.5em 0 !important; }

	#nav_handle {
		cursor: context-menu;
		display: block;
		height: 44px;
		padding: 0;
		position: absolute; top: 8px; right: 5px; bottom: auto; left: auto;
		width: 44px;
	}
	body.nav_open #nav_handle { cursor: pointer; }

		#nav_handle .hamburger { padding: 10px 0 !important; }
		
		.hamburger-inner, .hamburger-inner:after, .hamburger-inner:before {
			height: 4px !important;
			width: 30px !important;
		}

	body.nav_open #page, body.nav_open #footer { display: none; }

	body.nav_open #header {
		height: auto !important;
		overflow-x: hidden;
		overflow-y: scroll;
		position: fixed; top: 0; right: 0; bottom: 0; left: 0;
	}

	body.admin-bar.nav_open #header { top: 45px; }
		
		body.nav_open #header .menu { display: block !important; margin-bottom: 0; }
		body.nav_open .search_open .menu { opacity: 1; width: auto; }

			body.nav_open #header .menu * {
				background-color: transparent !important;
				border: none !important;
				box-shadow: none !important;
				font-size: 16px !important;
				line-height: 32px !important;
				padding: 0 !important;
				position: relative !important;
				top: auto !important; right: auto !important; bottom: auto !important; left: auto !important;
			}
		
			body.nav_open #header .menu li:not(.no_phone) { display: block !important; }

			body.nav_open #header .menu li.menu-item-has-children {
				cursor: context-menu;
				position: relative;
			}
			
			body.nav_open #header .menu li.menu-item-has-children:before {
				background: transparent url('../../../themes/r3417/images/ui/toggle_closed.svg') center center no-repeat;
				background-size: 14px 14px;
				content: '';
				display: block;
				height: 2em;
				position: absolute; top: 0; left: 0;
				transition: transform 0.25s ease;
				transform-origin: 50% 50%;
				width: 22px;
			}
			body.nav_open #header .menu li.menu-item-has-children.open:before {
				transform: rotate(90deg);
			}
			
				body.nav_open #header .menu li.menu-item-has-children > * { cursor: initial; }

				body.nav_open #header .menu a, body.nav_open #header .menu a {
					display: inline-block !important;
					line-height: 24px !important;
					margin: 0 0 0 24px !important;
					padding: 4px 0 !important;
				}

				body.nav_open #header .menu li > ul, body.nav_open #header .menu li:hover > ul { display: none !important; }

				body.nav_open #header .menu li.open > ul {
					display: block !important;
					margin: 0 0 0 16px !important;
				}
					
	#nav_wrapper { display: none; }
	
	body.nav_open #nav_wrapper {
		display: block;
		margin-top: 60px;
		padding-top: 20px;
		position: relative;
	}

		body.nav_open #header nav {
			display: block;
			height: auto;
			padding: 0 15px;
			position: relative; top: auto; right: auto; bottom: auto; left: auto;
			text-align: left;
		}

			#header .search {
				display: block;
				margin: 1.5em 24px 0 24px;
				position: relative;
				width: auto !important;
				z-index: 3;
			}

				#header .search .svg_wrapper {
					position: absolute; top: 2px; right: 0;
					z-index: 2;
				}
	
				#header .search input[type=text] {
					border-radius: 2px;
					font-size: 16px;
					height: 32px;
					line-height: 32px;
					opacity: 1;
					position: relative;
					text-transform: none;
					width: 100%;
					z-index: 1;
				}
				
				#nav_wrapper nav .search input[type=submit] { display: none; }
			
	#header_sidebar { display: none; }
	
	#page { padding-top: 60px; }
	
	#wpadminbar { position: fixed; }

}