/************************************************************************************
NAV
*************************************************************************************/
#nav-wrap { z-index:999999;
}
 
/* menu icon */
#menu-icon {
        display: none; /* hide menu icon initially */
}
 .sf-menu{ overflow:hidden !important;}
.sf-menu,
.sf-menu li {
        margin: 0; text-align:right;
        
}
.sf-menu li{display:inline-block; padding:0 15px; background:url(../images/divider.png) center right no-repeat;}
.sf-menu li:last-child{ background:none; padding-right:0;}
/* nav link */
.sf-menu a {color:#1d1d1d; display: block; font-size: 15px; font-weight: 400; padding: 12px 20px; border-radius:2px; text-transform: uppercase;}
.sf-menu a:hover{color:#fff; background:#255288;}
.sf-menu a.active{color:#fff; background:#255288;}
 
/* nav dropdown */
.sf-menu ul {
       background:#255288;
        position: absolute;
        display: none; /* hide dropdown */ width:280px;
        border-radius:0 2px 4px 4px;
}
.sf-menu li ul li{float: none; margin:0; background:none; padding:0; display:block; text-align:left;}
.sf-menu li ul li a{border-bottom: 1px solid #2e6db8; color: #e6f5ff; display: block; font-size: 14px; letter-spacing: 0; line-height: 16px; padding: 12px 5px 12px 10px;}
.sf-menu li ul li a:hover{background:#076ce5;}
.sf-menu li:hover > ul {
        display: block; /* show dropdown on hover */
}
ul.sf-menu li li:hover ul,
ul.sf-menu li li.sfHover ul {
        left:                   200px; /* match ul width */
        top:                    0;
}
 
/*** ESSENTIAL STYLES ***/
.sf-menu, .sf-menu * {
        margin:                 0;
        padding:                0;
        list-style:             none;
}

.sf-menu li:hover > a{color:#fff; background:#255288;}
 
/************************************************************************************
MOBILE
*************************************************************************************/
@media screen and (max-width:1400px) {
.sf-menu li{ padding:0 10px;}
.sf-menu a{ padding:12px 15px;}
}

@media screen and (max-width:1400px) {
.sf-menu a{ padding:10px 12px; font-size:14px;}
}

@media screen and (max-width:1100px) {
.sf-menu a{font-size: 13px; padding:8px;}
}

@media screen and (max-width:1000px) {
.sf-menu li{padding:0; background:none;}
}

@media screen and (max-width:900px) {
.sf-menu a{font-size:12px; padding:6px;}
}

@media screen and (max-width:767px) {
	#navigation{ clear:both; float:none;  position:absolute; border-radius:0 0; padding:0 0;  z-index:111;  }
	
 
        /* nav-wrap */
        #nav-wrap {
                position: absolute; z-index:9000000;height:0; top:48px; right:0px; width:100%; 
        }
 
        /* menu icon */
        #menu-icon {
			background:url(../images/menu_icon.png) 0% 0% no-repeat; display:block; width:35px; height:25px; text-indent:-9999999em; padding:0; overflow:hidden; margin-right:15px; float:right; cursor:pointer; margin-top:15px;
        }
        #menu-icon:hover {
              
        }
        #menu-icon.active {
                background:url(../images/menu_close.png) center center no-repeat;
        }
 
        /* main nav */
		.sf-menu ul{display:block!important; visibility:visible!important; z-index:115; background:#000;}
        .sf-menu {background:#3a72ff; clear: both; display: none; margin-right: 0; padding:0; position: absolute; right: 19px; top: 40px; width: 290px; z-index: 116;}
        .sf-menu li {
                clear: both;
                float: none;
                margin:0; border-top:1px solid #2660CF !important;
				width:100%;
				text-align:left; padding-right:0px !important;
				padding-left:0px !important;
        }
        .sf-menu a,
        .sf-menu ul a {
                font: inherit;
                background: none;
                display:block; color:#fff; padding:5px 10px; text-align:left;
        }
        .sf-menu a:hover,
        .sf-menu ul a:hover {
                background:#2660CF !important; border-bottom:none !important;
        }
 .sf-menu a.active{ background:#2660CF !important; border-bottom:none !important;
}
        /* dropdown */
        .sf-menu ul {
                width: auto;
                position: static;
                display: block !important;
                border: none;
                background: inherit;
				padding:0px;
        }
        .sf-menu ul li {
                 padding:0px !important; width:100%;
				margin:0px !important;
        }
		.sf-menu li ul li a{ padding-left:30px; font-size:13px; padding-top:5px; padding-bottom:5px;}
		/*.sf-menu li ul{ display:none !important;}
		.sf-menu li:hover ul{ display:block !important;}*/
}
