/* nav css */
/*First =============================================================================================*/
nav {
	float: left;
	clear: left;
	margin-top: 10px; /* adjust as necessary */
}
nav ul.sf-menu {
	padding: 0;
	margin: 0; /* reset list style */
	background: #CCC; /* give your menu a bg colour, if necessary */
	width: 940px; /* same as header width */
}
/*Second ============================================================================================= */
/*** ESSENTIAL STYLES ***/
.sf-menu, .sf-menu * {
	margin: 0;
	padding: 0;
	list-style: none;
}
.sf-menu {
	line-height: 1.0;
}
.sf-menu ul {
	position: absolute;
	top: -999em;
	width: 10em; /* left offset of submenus need to match (see below) */
}
.sf-menu ul li {
	width: 100%;
}
.sf-menu li:hover {
	visibility: inherit; /* fixes IE7 'sticky bug' */
}
.sf-menu li {
	float: left;
	position: relative;
}
.sf-menu a {
	display: block;
	position: relative;
}
.sf-menu li:hover ul, .sf-menu li.sfHover ul {
	left: 0;
	top: 2.5em; /* match sf-menu line height */
	z-index: 99;
}
ul.sf-menu li:hover li ul, ul.sf-menu li.sfHover li ul {
	top: -999em;
}
ul.sf-menu li li:hover ul, ul.sf-menu li li.sfHover ul {
	left: 10em; /* match ul width */
	top: 0;
}
ul.sf-menu li li:hover li ul, ul.sf-menu li li.sfHover li ul {
	top: -999em;
}
ul.sf-menu li li li:hover ul, ul.sf-menu li li li.sfHover ul {
	left: 10em; /* match ul width */
	top: 0;
}
/*Third ============================================================================================= */
/*** DEMO SKIN ***/
.sf-menu {
	float: left;
}
.sf-menu a {
	padding: .75em 1em;
	text-decoration: none;
}
.sf-menu a, .sf-menu a:visited { /* visited pseudo selector so IE6 applies text colour*/
	color: #13a;
}
.sf-menu li {}
.sf-menu li li {}
.sf-menu li li li {}
.sf-menu li:hover, .sf-menu li.sfHover, .sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
	outline: 0;
}


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


#the-navigator{}
#id_header-nav {
    display: table;
    margin: 0 auto;
}
#thenavigator{}
#thenavigator > li:first-child::before {
    display: none;
}
#thenavigator > li::before {
    color: #fefeff;
    content: "|";
    float: left;
    font-family: arial,sans-serif;
    font-size: 12px;
    font-weight: 600;
    left: 0;
    position: absolute;
    top: 39%;
    vertical-align: middle;
}
#thenavigator > li {
    font-family: "FuturaBold",Futura,Arial,sans-serif;
    font-size: 1.125rem;
    padding: 0;
    position: relative;
}
#thenavigator > li > a:link, #thenavigator > li > a:visited, #thenavigator > li > a:active {
    color: #fefeff;
    padding: 1.23rem 3.5rem;
    text-decoration: none;
}
#thenavigator > li > a:hover {
    color: #030303;
}

#thenavigator > li > .sub-menu {
    background: #e7e7e8 none repeat scroll 0 0;
    top: 100%;
    width: 16rem;
}
#thenavigator > li > .sub-menu > li{
    font-family: "FuturaBold",Futura,Arial,sans-serif;
    font-size: 1.125rem;
    padding: 0;
    position: relative;	
}
#thenavigator > li > .sub-menu > li > a:link, #thenavigator > li > .sub-menu > li > a:visited, #thenavigator > li > .sub-menu > li > a:active {
    color: #000000;
    padding: 0.5rem 3.5rem;
    text-decoration: none;
}
#thenavigator > li > .sub-menu > li > a:hover{color: #00a4e4;}

#thenavigator > li > .sub-menu > li .sub-menu {
    background: #e7e7e8 none repeat scroll 0 0;
    left: 100%;
    width: 16rem;
}
#thenavigator > li > .sub-menu > li .sub-menu li{
    font-family: "FuturaBold",Futura,Arial,sans-serif;
    font-size: 1.125rem;
    padding: 0;
    position: relative;		
}
#thenavigator > li > .sub-menu > li .sub-menu li a:link, #thenavigator > li > .sub-menu > li .sub-menu li a:visited, #thenavigator > li > .sub-menu > li .sub-menu li a:active{
    color: #000000;
    padding: 0.5rem 3.5rem;
    text-decoration: none;	
}
#thenavigator > li > .sub-menu > li .sub-menu li a:hover{color: #00a4e4;}


#thenavigator > li.current-menu-item > a:link, #thenavigator > li.current-menu-item > a:hover, #thenavigator > li.current-menu-item > a:visited, #thenavigator > li.current-menu-item > a:active{color: #030303;}

#thenavigator > li.current-menu-ancestor > a:link, #thenavigator > li.current-menu-ancestor > a:visited, #thenavigator > li.current-menu-ancestor > a:active,
#thenavigator > li.current-menu-ancestor > a:hover{color: #030303;}


#thenavigator > li.sfHover > a:link, #thenavigator > li.sfHover > a:visited, #thenavigator > li.sfHover > a:active, #thenavigator > li.sfHover > a:hover{color: #000000}

#thenavigator > li > .sub-menu > li.sfHover > a:link, #thenavigator > li > .sub-menu > li.sfHover > a:visited, #thenavigator > li > .sub-menu > li.sfHover > a:active,
#thenavigator > li > .sub-menu > li.sfHover > a:hover{color: #00a4e4}

#thenavigator > li > .sub-menu > li .sub-menu li.sfHover > a:link, #thenavigator > li > .sub-menu > li .sub-menu li.sfHover > a:viisted, #thenavigator > li > .sub-menu > li .sub-menu li.sfHover > a:active, #thenavigator > li > .sub-menu > li .sub-menu li.sfHover > a:hover{color: #00a4e4}