/*Modifying the CSS here will impact the mega menu using across all the websites
 *Please put the overriding style in the individual skin of the website for the colour and specific layout adjustment
*/
/* Nav Pills */
nav ul.nav-main { margin: 0; }
nav ul.nav-main > li + li { margin-left: -4px; }
nav ul.nav-main .dropdown-submenu { position: relative; }
nav ul.nav-main .dropdown-submenu > .dropdown-menu { 
    top: 0;
	left: 100%;
	margin-top: -6px;
	margin-left: -1px;
	-webkit-border-radius: 0 6px 6px 6px;
	-moz-border-radius: 0 6px 6px 6px;
	border-radius: 0 6px 6px 6px;
}
nav ul.nav-main .dropdown-submenu:hover > .dropdown-menu { display: block; }
nav ul.nav-main .dropdown-submenu > a:after { 
	display: block;
	content: " ";
	float: right;
	width: 0;
	height: 0;
	border-color: transparent;
	border-style: solid;
	border-width: 5px 0 5px 5px;
	border-left-color: #cccccc;
	margin-top: 5px;
	margin-right: -10px;
}
nav ul.nav-main.mobile .dropdown-submenu > a:after { border: 0; }
nav ul.nav-main .dropdown-submenu > a > i { display: none; }
nav ul.nav-main.mobile .dropdown-submenu > a > i { display: inline-block; }
nav ul.nav-main .dropdown-submenu:hover > a:after { border-left-color: #ffffff; }
nav ul.nav-main .dropdown-submenu.pull-left { float: none; }
nav ul.nav-main .dropdown-submenu.pull-left > .dropdown-menu {
	left: -100%;
	margin-left: 10px;
	-webkit-border-radius: 6px 0 6px 6px;
	-moz-border-radius: 6px 0 6px 6px;
	border-radius: 6px 0 6px 6px;
}
nav ul.nav-main li.dropdown.open a.dropdown-toggle {
	-moz-border-radius: 5px 5px 0px 0px;
	-webkit-border-radius: 5px 5px 0px 0px;
	border-radius: 5px 5px 0px 0px;
}
nav ul.nav-main ul.dropdown-menu,
nav ul.nav-main li.dropdown.open a.dropdown-toggle,
nav ul.nav-main li.active a { background-color: #CCC; }
nav ul.nav-main ul.dropdown-menu {
	-moz-border-radius: 0 6px 6px 6px;
	-moz-box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.08);
	-webkit-border-radius: 0 6px 6px 6px;
	-webkit-box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.08);
	border: 0;
	border-radius: 0 6px 6px 6px;
	box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.08);
	margin: 1px 0 0 3px;
	padding: 5px;
	top: auto;
}
nav ul.nav-main ul.dropdown-menu ul.dropdown-menu {
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	margin-left: 0;
	margin-top: -5px;
}
nav ul.nav-main ul.dropdown-menu li:hover > a { filter: none; background: #999; }
nav ul.nav-main ul.dropdown-menu > li > a { 
    color: #FFF;
	font-weight: 400;
	padding-bottom: 4px;
	padding-top: 4px;
	text-transform: none;
	position: relative;
    padding: 8px 10px 8px 5px;
	font-size: 0.9em;
	border-bottom: 1px solid rgba(255,255,255,0.2);
}
nav ul.nav-main ul.dropdown-menu li:last-child > a { border-bottom: 0; }
nav ul.nav-main li a {
	font-size: 12px;
	font-style: normal;
	line-height: 20px;
	margin-left: 3px;
	margin-right: 3px;
	text-transform: uppercase;
	font-weight: 700;
}
nav ul.nav-main li ul a { text-transform: none; font-weight: normal; font-size: 0.9em; }
nav ul.nav-main li a:hover { background-color: #F4F4F4; } 
nav ul.nav-main li.dropdown:hover > a { padding-bottom: 11px; margin-bottom: -1px; } 

nav ul.nav-main li.dropdown:hover a.dropdown-toggle {
	-moz-border-radius: 5px 5px 0px 0px;
	-webkit-border-radius: 5px 5px 0px 0px;
	border-radius: 5px 5px 0px 0px;
}
nav ul.nav-main li.dropdown:hover > ul { display: block; }

nav ul.nav-main li.dropdown > a > i.fa { padding-right: 0;}

/* desktop */
@media (min-width: 992px) {
  nav.mega-menu .nav,
  nav.mega-menu .dropup,
  nav.mega-menu .dropdown,
  nav.mega-menu .collapse { position: static; }
  nav.mega-menu ul.nav-main .mega-menu-content { -ms-text-shadow: none; text-shadow: none; }
  nav.mega-menu ul.nav-main li.mega-menu-item ul.dropdown-menu {
    background: #FFF !important;
    border-top: 6px solid #CCC;
    color: #777;
    -moz-box-shadow: 0 20px 45px rgba(0, 0, 0, 0.08);
    -webkit-box-shadow: 0 20px 45px rgba(0, 0, 0, 0.08);
    -ms-box-shadow: 0 20px 45px rgba(0, 0, 0, 0.08);
    box-shadow: 0 20px 45px rgba(0, 0, 0, 0.08);
  }
  nav.mega-menu ul.nav-main li.mega-menu-fullwidth ul.dropdown-menu {
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    -ms-border-radius: 6px;
    border-radius: 6px;
  }
  header.flat-menu nav.mega-menu ul.nav-main li.mega-menu-fullwidth ul.dropdown-menu {
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    -ms-border-radius: 0;
    border-radius: 0;
  }
  nav.mega-menu ul.nav-main li.mega-menu-item ul.sub-menu .mega-menu-sub-title {
    color: #333333;
    display: block;
    font-size: 1em;
    font-weight: 600;
    padding-bottom: 5px;
    text-transform: uppercase;
  }
  nav.mega-menu ul.nav-main li.mega-menu-item ul.sub-menu {
    list-style: none;
    padding: 0;
    margin: 0;
  }

  nav.mega-menu ul.nav-main li.mega-menu-item ul.sub-menu a {
    color: #777;
    -ms-text-shadow: none;
    text-shadow: none;
    margin: 0 0 0 -8px;
    padding: 3px 8px;
    text-transform: none;
    font-size: 0.9em;
    display: block;
    font-weight: normal;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
     -ms-border-radius: 4px;
     border-radius: 4px;
  }

  nav.mega-menu ul.nav-main li.mega-menu-item:hover ul.sub-menu li:hover a:hover {
    background: #F4F4F4 !important;
    text-decoration: none;
  }

  nav.mega-menu ul.sub-menu ul.sub-menu > li {
    -moz-transition: all 0.3s;
    -o-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    background-position: 5px 16px;
    background-repeat: no-repeat;
    padding: 5px 0 0 20px;
    transition: all 0.3s;
  }

  nav.mega-menu .dropdown-menu { left: auto; } 
  nav.mega-menu .dropdown-menu > li { display: block; }
  nav.mega-menu .nav.pull-right .dropdown-menu { right: 0; }
  nav.mega-menu .mega-menu-content { padding: 20px 30px; }
  nav.mega-menu .mega-menu-content:before,
  nav.mega-menu .mega-menu-content:after {
    display: table;
    content: "";
    line-height: 0;
  } 
  nav.mega-menu .mega-menu-content:after { clear: both; }
  nav.mega-menu.navbar .nav > li > .dropdown-menu:after,
  nav.mega-menu.navbar .nav > li > .dropdown-menu:before {
    display: none;
  }
  nav.mega-menu .dropdown.mega-menu-fullwidth .dropdown-menu {
    width: 100%;
    left: 0;
    right: 0;
  }
}
/*Mobile*/
@media (max-width: 991px) {
    /* Navigation */
    nav ul.nav-main .dropdown-submenu em.fa-caret-down, nav ul.nav-main .dropdown-submenu i.fa-caret-down,
    nav ul.nav-main li a em.fa-caret-down, nav ul.nav-main li a i.fa-caret-down {
        font-size: 25px;
    }

    nav.nav-main ul.nav-main {
        float: none;
        position: static;
        margin: 8px 0;
    }

    nav ul.nav-main {
        margin-right: -10px;
    }

    nav.nav-main {
        padding: 10px 0;
        clear: both;
        display: block;
        float: none;
        width: 100%;
    }

        nav.nav-main ul, nav.nav-main ul li {
            padding: 0;
            margin: 0;
        }

            nav.nav-main ul li {
                clear: both;
                float: none;
                display: block;
                border-bottom: 1px solid #2A2A2A;
            }

    nav ul.nav-main > li + li {
        margin-left: 0;
    }

    nav ul.nav-main li a,
    nav ul.nav-main ul.dropdown-menu li > a {
        padding: 9px 8px;
        border: 0;
        border-top: 0;
        margin: 0;
    }

    nav.nav-main ul li:last-child, nav ul.nav-main ul.dropdown-menu li > a {
        border-bottom: none;
    }

    nav ul.nav-main li.dropdown:hover > a {
        margin-bottom: -2px;
    }

    nav ul.nav-main li a {
        color: #FFF;
        clear: both;
        float: none;
        display: block;
        padding-left: 0;
    }

        nav ul.nav-main li a em.fa-caret-down, nav ul.nav-main li a i.fa-caret-down {
            position: absolute;
            right: 0;
            top: 2px;
            -moz-min-width: 30px;
            -ms-min-width: 30px;
            -o-min-width: 30px;
            -webkit-min-width: 30px;
            min-width: 30px;
            min-height: 38px;
            text-align: center;
            line-height: 35px;
        }

    nav.nav-main ul ul {
        margin-left: 20px !important;
    }

    nav.nav-main ul.dropdown-menu {
        position: static;
        clear: both;
        float: none;
        display: none !important;
    }

    nav.nav-main ul.sub-menu {
        position: static;
        clear: both;
        float: none;
        display: none !important;
    }

    nav ul.nav-main ul.dropdown-menu {
        -moz-box-shadow: none;
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    nav.nav-main li.resp-active > ul.dropdown-menu {
        display: block !important;
    }

    nav ul.nav-main .dropdown-submenu > a:after {
        border-left: 5px solid transparent;
        border-right: 5px solid transparent;
        border-top: 5px solid #FFF;
    }

    nav ul.nav-main .dropdown-submenu:hover > a:after {
        border-left-color: transparent;
    }

    nav ul.nav-main ul.dropdown-menu,
    nav ul.nav-main li.dropdown.open a.dropdown-toggle,
    nav ul.nav-main li a,
    nav ul.nav-main li > a:hover,
    nav ul.nav-main li.active a,
    nav ul.nav-main li.dropdown:hover a,
    nav ul.nav-main ul.dropdown-menu li:hover > a,
    nav ul.nav-main li.dropdown:hover ul.dropdown-menu li > a:hover {
        background: none !important;
        background-color: transparent !important;
    }

    nav ul.nav-main > li {
        display: block;
    }

    nav ul.nav-main ul.sub-menu {
        padding: 0;
        margin: 0 0 10px 0;
    }
}