/* Menu Styling (colors,images,fonts)
---------------------------------- */


#horizontalNav { 
	background: none; 
	/*font-family: "Microsoft Sans Serif", Arial, Geneva;*/
	
}


ul.menu a.ekflexmenu_link_selected, 
ul.menu a.ekflexmenu_link_selected:hover 
{
	color: #c00;
	text-decoration:underline;
}


/* style the links for the top level */
.menu a, .menu a:visited 
{
    font-size:16px;
    font-weight: normal;
    text-decoration:none;
    color: #333;
    }

.menu ul {
}

.menu ul ul {
	border-left: none;
}

.menu ul ul li{
	-moz-box-shadow: -1px 2px 1px rgba(0,0,0,.3);
	-webkit-box-shadow: -1px 2px 1px rgba(0,0,0,.3);
}
/* style the sub level links */
.menu ul ul a, .menu ul ul a:visited 
{
	background-color: #c00;
	background-image: none;
	color: #fff;
	font-weight: normal;
	text-transform: none;
	font-size: 13px;
    }
    

* html .menu a:hover 
{
    color: #c00;
	text-decoration:underline;
}
 
.menu :hover > a 
{
	
    color:#c00;
	text-decoration:underline;
}
.menu ul :hover > a {
    color: #c00;
}

* html .menu ul ul a:hover { color: #6e0404; background:#f9af63; }
    
.menu ul ul li:hover { position:relative;}
    
.menu ul ul :hover > a { color: #6e0404; background:#f9af63; }

.menu ul ul ul a, .menu ul ul ul a:visited { background: #f9af63; color: #6e0404;}

* html .menu ul ul ul a:hover { background:#fbc792;}
    
.menu ul ul ul :hover > a { background:#fbc792;}

.menu ul ul ul ul a:hover { background:#f9af63;}

.menu ul ul ul ul a, .menu ul ul ul ul a:visited { background:#fbc792;}
	


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

#horizontalNav { width: 100%; clear: both; }

.menu { position: relative; z-index: 1000;}

/* remove all the bullets, borders and padding from the default list styling */
ul.menu li {
	float: left;
}

ul.menu
{
    /*padding:0 2px 0 0;*/
    list-style-type:none; 
    height:50px; 
}

#horizontalNav ul.inner{width:907px;}

/* style the sub-level lists */
ul.menu ul 
{
    width:216px;
}

/* float the top list items to make it horizontal and a relative positon so that you can control the dropdown menu positon */
ul.menu li 
{
	list-style-type: none;
    float:left;
    height: auto;
    line-height:50px;
}

/* style the sub level list items */
ul.menu ul li 
{
    display:block;
    width:216px;
    height:auto; 
    line-height:28px;
}

/* style the links for the top level */

.menu a, .menu a:visited 
{
    display:block;
    float:left;
    height:50px;
	padding: 0 13px 0 13px;
	line-height: 50px;
}
	
	
/* style the sub level links */
ul.menu ul a, ul.menu ul a:visited,
ul.menu ul .no-link
{
    display:block;
    width:200px;
    height:100%;
    line-height:1.25; 
    padding: 10px 8px;
}

ul.menu ul .no-link {
    font-style: italic;
    font-size: 15px;    
}


/** html .menu ul ul a, * html .menu ul ul a:visited  {width:14em; w\idth:12em;}*/


/* style the table so that it takes no part in the layout - required for IE to work */
.menu table 
{
    position:absolute; 
    left:1px; 
    top:0; 
    width:0; 
    height:0; 
    font-size:12px; 
    z-index:-1;
}

* html .menu a:hover { position:relative; z-index:100; }
    
.menu li:hover { position:relative; }
    
* html ul.menu ul a:hover { position:relative; z-index:5110; }
    
ul.menu ul li:hover { position:relative; }
    
* html ul.menu ul ul a:hover { position:relative; z-index:5120; }

ul.menu ul ul ul a:hover { position:relative; z-index:5130; }


/* hide the sub levels and give them a positon absolute so that they take up no room */
ul.menu ul {
    visibility:hidden;
    position:absolute;
    height:0;
    top:27px;
    left:0;
    width:216px;
}

/* position the third level flyout menu */
ul.menu ul ul
{
    left:210px;
    top:0;
    width:185px;

}

/* make the second level visible when hover on first level list OR link */
ul.menu :hover ul
{
    visibility:visible; 
    height:auto; 
    padding-bottom:3em; 
}

/* keep the third level hidden when you hover on first level list OR link */

ul.menu :hover ul ul{visibility:hidden;}
/* keep the fourth level hidden when you hover on second level list OR link */

ul.menu :hover ul :hover ul ul{visibility:hidden;}
/* make the third level visible when you hover over second level list OR link */

ul.menu :hover ul :hover ul{visibility:visible;}
/* make the fourth level visible when you hover over third level list OR link */

ul.menu :hover ul :hover ul :hover ul {visibility:visible;}



/*NON Product Menu*/
ul.menu .menu-wrapper.alt-menu ul.drop-menu.drop-menu-level-1 > li {
    width: 100%;
    display: block;
    float: none;
    padding: 0 8px;
}


.menu-wrapper.alt-menu {
    width: auto;
    min-width: 150px;
}
.alt-menu ul.drop-menu.drop-menu-level-1 li a {
	font-size: 13px;
}

/*Product Menu*/

.menu li:hover {
	position: initial;
}

.menu li .menu-wrapper {
	visibility: hidden;
    overflow: hidden;
}

.menu li:hover .menu-wrapper, .menu li:hover .menu-wrapper ul.drop-menu{
	visibility: visible;
}


	
ul.menu .menu-wrapper ul.drop-menu {
    visibility: hidden;
    position: relative;
    top: 0;
    display: table;
    width: 100%;
    margin-left: 0;
}

ul.drop-menu.drop-menu-level-2, ul.drop-menu.drop-menu-level-3  {
    left: 0;
    margin-left: 0;
    visibility: hidden;
}

.menu-wrapper {
	background: #efefef;
    position: absolute;
    padding: 10px;
    top: 43px;
    border: 7px solid #ffffff;
    box-shadow: #ddd 1px 1px 1px 1px;
    width: 793px;
}


ul.menu .menu-wrapper ul.drop-menu.drop-menu-level-1 > li {
    background: #efefef;
    float: left;
    display: table-cell;
    width: 25%;
    box-sizing: border-box;
    padding: 10px;
}

ul.menu ul li {
	width: 100%;
}

.menu ul ul li {
	box-shadow: none;
}
.menu ul ul a {
    background-color: transparent;
    background-image: none;
    color: #000;
    font-weight: normal;
    text-transform: none;
    font-size: 13px;
}

.menu ul ul :hover > a {
    color: #6e0404;
    background: transparent;
}

.menu ul ul ul a, .menu ul ul ul a:visited, .menu ul ul a:visited {
    background: transparent;
    color: #000;
}

.menu ul ul ul :hover > a {
    background: transparent;
}


ul.menu :hover ul , ul.menu ul :hover ul{
    visibility: visible;
    height: auto;
    padding-bottom: 0;
}

.drop-menu-level-1 a.drop {
    color: #D20000;
    font-size: 16px;
    font-weight: 800;
}

.alt-menu ul.menu ul a, .alt-menu ul.menu ul a:visited {
	width: 100%;
    box-sizing: border-box;
    float: none;
    font-size: 14px;
}

ul.menu ul a, ul.menu ul a:visited {
	width: 100%;
    box-sizing: border-box;
    float: none;
    word-wrap: break-word;  
}

.menu ul :hover > a {
    color: #6e0404;
}

.menu ul :hover > a, .menu ul ul :hover > a {
    color: #D20000;
    background: transparent;
    text-decoration: none;
}

/*ul[class*="drop-menu-level-"] a.featured {
	font-weight: 800;
	color: #000;
}*/

.menu ul ul a.featured, .menu ul ul a.featured:visited {
	/*color: #000;*/
	font-weight: 800;
}



.menu a.drop, .menu a.drop:visited, .menu ul ul a.featured:hover {
	color: #D20000;
}
.menu a.drop:hover,
.menu a.drop:visited:hover,
.menu ul ul a.drop:hover,
.menu ul ul a.drop:visited:hover {
    color: #8B0000;
}


ul.menu a.top-level-link {
    font-weight: bold;
    text-decoration: underline;
    width: 75%;
    display: inherit;
    padding-left: 18px;
}

li[class="col-"] {
	padding:8px;
}

li.col-3 {
	position: relative;
}

li.col-3:after {
	border-right: 1px solid #ddd;
	position: absolute;
	content: '';
    top: -50px;
	bottom: 0;
	right: 0;
    height: 1200%;
}

li.col-4 {
    margin-top: -50px;
}
