/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ 
	HORIZONTAL DROP DOWN MENU
	use with csshover.htc	
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~  */

/* Remove List Formattings
~~~~~~~~~~~~~~~~~~~~  */
 ul.menu, li.menu {
	list-style: none outside;
	margin: 0;
	padding: 0;
}

/* Header menu */	 
#header_menu li {line-height: normal;font-weight: bold; border-left: 1px solid #E2E2E2;border-right:solid 1px #F9F9F9;}
#header_menu li li,
#header_menu li.menu-first {border-left: 1px solid #F9F9F9;}
#header_menu li li,
#header_menu li.menu-last {border-right: 0px;}
/*#header_menu li.menu-last + li.menu-first {border-left: none 0;} */

#user-menu{
	/*position: absolute;*/
	bottom: 0;	
	list-style: none;
}
#user-menu li a{
    text-decoration: none;
    color: #919191;
    padding: 7px 12px 8px;
    /*position: relative;
    top: 7px;*/

}
#user-menu li a:hover{
	color: #F56010;
}

#nav {
	/*width: 780px;*/
	/*position: absolute;*/
	bottom: 0;
	overflow: visible;
	z-index: 1003;/* IE7 */
	
}
#nav ul {
	list-style-type: none; 
	margin: 0; 
	padding: 0; 
	font-size: 14px;
	z-index: 1002;/* IE7 */
	/*
	(Disappearing List-Background)
	http://www.positioniseverything.net/explorer/ie-listbug.html
	*/
	position: relative; /* Fix the Stupid IE6 Bug */
}
#nav ul li {float: left; color: #00a3d3; text-align: center; font-weight:normal;font-weight: bold;}
#nav ul li span,
#nav ul li a {display: block; background: transparent; padding: 10px 10px 10px 10px;color: #2FAEE2;text-shadow: -1px 0 #fff, 0 1px #fff, 1px 0 #fff, 0 -1px #fff; text-decoration: none;}
#nav ul li span {
	cursor: default;
}
#nav ul li.menu-last span,
#nav ul li.menu-last a {}

/*Using this keeps the top level background on, when hovering on the dropdowns*/
#nav ul li:hover span,
#nav ul li:hover a {background: url("../images/template/nav-hover.jpg") repeat-x 0 bottom; color:#6C6D6F;}

/* Root Level Link Formatting */
#nav ul li span:hover,
#nav ul li a:hover, #nav li a:focus {background: url("../images/template/nav-hover.jpg") repeat-x 0 bottom; color:#6C6D6F;}
#nav li a:active, #nav ul li a.active {color: #00a3d3;}

/* 2nd Child menu */
#nav .menu li ul {position: absolute; z-index:1000; width: 14.5em; margin: 0;display: none; text-transform: none; font-size: 13px;padding-left: 0;height: auto;top: 36px;left:-2px;}
#nav .menu li ul li {text-align: left; font-weight: bold; margin: 0; padding: 0; line-height: 1.2em;}
#nav .menu li ul span,
#nav .menu li ul a {width: 11.5em; padding: .8em .1.6em .8em 1.6em; background: #EEEEEE url("../images/template/nav-hover.jpg") repeat-x 0 bottom; color: #00a3d3;}


/* 2nd Child link hover */
#nav .menu li ul span:hover,
#nav .menu li ul a:hover {background: #fd6d16; color:#fff;text-shadow: -1px 0 #AE6239, 0 1px #AE6239, 1px 0 #AE6239, 0 -1px #AE6239;}

/* Current page Customisations*/
#nav .menu li.menu-level-1 > span,
#nav .menu li.menu-level-1 > a {background: #EEEEEE url("../images/template/nav-hover.jpg");}


#nav li:not(.menu-level-1):not(.menu-current) > span,
#nav li:not(.menu-level-1):not(.menu-current) > a {background: transparent;}


#nav .menu li.menu-current > span,
#nav .menu li.menu-current > a		{background: #EEEEEE; color: #F56010;} 

/* Show and hide */
#nav .menu li a:focus + ul {display: block;}/* separate rule so doesn't break older browsers */
#nav .menu li:hover ul, #nav .menu li.subMenu ul {display: block;}
#nav .menu li ul ul { display: none;}
#nav .menu li:hover ul ul, #nav .menu li.subMenu ul ul {display: none;}
#nav .menu li:hover ul, #nav .menu li li:hover ul, #nav .menu li.subMenu ul, #nav .menu li li.subMenu ul {display: block;}


/* 3rd Child Menu Appreances */
#nav .menu li ul ul			{margin-top: 0;top: 0;}
#nav .menu li ul li ul li span,
#nav .menu li ul li ul li a 	{background: #e6e6e6; color: #00a3d3;}

/* Positioning the Pop-out Drops */
#nav li {position: relative; z-index:1001;/* IE7 */}

#nav ul ul {
	left: 0;
	top: 26px;
}

#nav ul ul ul {
	position: absolute;
	top: 0;
	left: 100%;
}



#nav ul li ul li {
	text-transform: none;
}


/* Footer Menu */
#footer_menu {
	margin-bottom: 3em;
	color: #6c6c6e;
}

#footer_menu ul {
	list-style:none outside;
	margin:0;
	padding:0;
	font-size: 14px;
	display: block;
	float: left;
	/*width: 605px;*/
}
#footer_menu ul.extra-menu {
	float: right;
	width: 303px;
}
#footer_menu ul ul {
	width: 100%;
}

#footer_menu li a,
#footer_menu li span {
	color: #6c6c6e;
	text-decoration:none;
	display: block; 
	background: transparent; 
	padding: 1px 10px;
}

#footer_menu li {
	line-height: normal;
	font-weight: bold;
	float:left;
	text-align:left;
	width: 151px;
}

#footer_menu li li {
	font-weight: normal;
	float:none;
	line-height: normal;
	text-align:left;
}
	
#footer_menu  li a:active,
#footer_menu  li a:hover,
#footer_menu_other li a:active,
#footer_menu_other li a:hover {
	text-decoration: underline;
}

#header-banner-mobile {
	display: none;
}

#header-banner-mobile img {
	height: auto;
	width: 100%;
}

#header-banner-mobile > .banner-group-display {
    margin: 0 !important;
    padding: 20px;
    padding-top: 10px;
}

@media screen and (max-width: 1150px) {
	#header-banner-mobile {
		display: block;
	}

	#header-content > .row:last-child  {
        display: flex;
        width: 100%;
        justify-content: center;
        align-items: center;
        /* flex-direction: column; */
        flex-wrap: wrap;
        justify-content: flex-start;
        align-items: flex-start;
	}

	#header-content > .row:last-child > #nav {
		width: auto;
	}

	#header-content > .row:last-child > .header-col {
		width: auto;
	}
}

@media screen and (max-width: 934px) {
	#header-content > .row:last-child  {

        flex-direction: column;
        flex-wrap: nowrap;
        justify-content: flex-start;
        align-items: flex-start;
	}
}

@media screen and (max-width: 768px) {
	#header-content > .row:last-child  {
		align-items: center;
	}
}

@media screen and (max-width: 480px) {
	#header-content .row:last-child .header-col {
		display: flex;
		column-gap: 10px;
		justify-content: flex-start;
	}

	#header-content #user-menu {
		margin-bottom: 0;
		width: auto;
	}

	#header-content .cart-block {
		padding: 7.5px 10px 7.5px;
	}
}

@media screen and (max-width: 380px) {
	#header-content .cart-block {
		width: auto !important;
		text-align: center !important;
	}

	#user-menu li a {
		text-align: center;
	}
}