.resnav-container{clear:both; position:relative;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box; background:#e1e1e1;margin:0px auto; padding:0px;border-bottom:1px solid #111372; max-width:100%; width:100%; }


.resnav-container *,.resnav-container *:before,.resnav-container *:after{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}

/* menu main bar */

.resnav-container-sm{padding:28px 0 0 0; margin:10px auto 0px auto; }

.resnav-container-sm.resnav-container {min-height:20px;background-color: #3437a1; }
 
.resnav-container-sm .resnav-name,.resnav-container-sm .resnav-button{display:block;}

.resnav-container-lg .resnav-name,.resnav-container-lg .resnav-button{display:none;}
 
/* menu word use to line up with subs in drop down menu  */

.resnav-name{position:absolute;top:7px;left:14px;font:normal 13px arial, sans-serif; color: #fff; text-decoration:none;}

/* navicon bar */

.resnav-button{position:absolute;right:12px;top:0px;box-sizing:border-box;margin:4px 0px 2px 0px;padding:4px;width:30px;border-radius:3px; }

.resnav-button:hover{cursor:pointer;}@include box-shadow(inset 0 0 8px rgba(0, 0, 0, 0.3));
  

.resnav-bar{display:block;width:22px;height:2px;border-radius:2px;background-color:#ffffff;}

.resnav-button .resnav-bar+.resnav-bar{margin-top:4px;}


/* main navicon hover background */

.resnav-button:hover {background-color:orange; }


  

/* main navicon   background */


.resnav-light ul ul li,.resnav-dark ul ul li {background:#e1e1e1;}
 
.resnav-bar{background-color:#000000;}

.resnav-dark{color:#525fe0;}
.resnav-dark a{color:#525fe0;}

.resnav-dark .resnav-bar{background-color:#fff;}

  
  
  

.dropdownnav:before,.dropdownnav:after {display:table;content:" ";}

.dropdownnav:after{clear:both;}

.dropdownnav ul {text-align:left; position:relative;margin:0px;padding:0px;list-style:none; }

.dropdownnav li{text-align:left; position:relative; padding:0px;margin:0px; background:#111372;}
 
   
 
 
 
/* sub drop down font size only */


.dropdownnav  { text-align:left; padding:0px;margin:0px;  color:#fff; 
font: normal 12px  arial, sans-serif; text-decoration:none; }
 
 
.dropdownnav a{ text-align:left;  text-decoration:none; }
 

.dropdownnav a:hover {text-decoration:none; background-color:orange;color:#fff;   }


.dropdownnav #current{ text-align:left; color:#3437a1; text-decoration:none;}


.dropdownnav #currentmain {  text-decoration:underline; background-color:orange;color:#fff;}

  
.dropdownnav ul  { background-color:red; }
  
  
  
  
/* sub font  border line */
  

  

  

/* Main Categories width */
  
 
.resnav-lg{max-width:890px;padding: 0px; text-align:center; margin:0px auto; width:100%;background:transparent;}

 


/* Main cat arrow */
 
 


.resnav-lg .navicon:after{ border:5px solid transparent;border-top-color:#525fe0;content:"";position:absolute;right:1px;top:12px;}
 

.resnav-lg .resnav-back{display:none;}

.resnav-lg ul ul{display:none;z-index:99;position:absolute;border-radius:4px;}

.resnav-lg ul ul .navicon:after{border:5px solid transparent;border-left-color:#fff;top:10px;}


/* main font visible on top before any subs */
 
.resnav-lg li {color:#3437a1; text-decoration: none; padding:0px; border-right:1px solid red;border-right:0px}
  
 
.resnav-lg li a:hover {color:#fff; text-decoration: none; background:#3437a1; }
 
/* sub font main font hover bkg */ 

.resnav-lg li.active {background:#3437a1; color:#000; text-decoration: none;}

.resnav-lg>ul>li:hover>a {background:#e1e1e1; color:#3437a1; text-decoration: none;}

.resnav-lg>ul>li{float:left;position:relative;white-space:nowrap; padding:0px;}
  


/* top cat works between  */

.resnav-lg>ul>li a{display:block;padding:6px 11px 6px 11px;}


 .resnav-lg>ul>li>a{font: normal 12px arial, helvetica, san-serif; color: #525fe0;  }

.resnav-lg>ul>li:first-child>a{border-left:none;}

.resnav-lg>ul>li:last-child{border:0px; border: none;}
 
 
.resnav-lg>ul>li:hover>ul{opacity:3;visibility:visible;-webkit-transition:all 0.15s ease-in-out;-moz-transition:all 0.15s ease-in-out;transition:all 0.15s ease-in-out;}


  /* top cat padding between main cat and drop down box */

.resnav-lg>ul>li>ul{display:block;left:0;top:100%;padding-top:0px;opacity:0;visibility:hidden;} 



/* 2nd level secondary sub drops  */



.resnav-lg>ul>li>ul li:hover>ul{opacity:1;visibility:visible;-webkit-transition:all 0.05s ease-in-out;-moz-transition:all 0.05s ease-in-out;transition:all 0.05s ease-in-out;}
 
 

.resnav-lg>ul>li>ul ul{display:block;top:0;left:100%;padding-left:25px;opacity:0;visibility:hidden;}

.resnav-lg>ul>li>ul ul:after{position:absolute;left:1px;top:10px;content:"";border:8px solid transparent;border-right:8px solid orange;} 
/* 2nd level subs */

 

.resnav-sm{display:none;}

/* 2nd level I beam line */

.resnav-sm .navicon{position:absolute;top:5px;right:2px;height:20px;width:50px;border-left:1px solid orange;}

.resnav-sm .navicon:hover{cursor:pointer;}

/* 2nd level arrow after I beam line */

.resnav-sm .navicon:after{position:absolute;top:3px;right:10px;content:"";border:8px solid transparent;border-left:8px solid #525fe0;}

/* hover color 2nd level subs */

.resnav-sm .resnav-back{position:relative;background:#0000a8;}
 
   

 /* left arrow after category select, hover after sub click before main category */

.resnav-sm .resnav-back:before{position:absolute;top:8px;left:18px;content:"";border:8px solid transparent;border-right:8px solid #fff;}


 /*  2nd sub cat background color after category select, hover after sub click before main category */


.resnav-sm .resnav-back a{display:block;padding-left:45px;color:#ffffff;}

 
.resnav-sm a{display:block;padding:7px 22px;}


 /* sub category indent spacing to right of menu after sub click before main category and main sub drop down hover color */
 
.resnav-sm a{display:block;padding:7px 13px;}

.resnav-sm a:hover{background-color:red;color:#ffffff;}



 /* left ARROW main sub hover color that stays  **********/

   
.resnav-sm .resnav-back a:hover{background-color:red;color:#ffffff;} 




 /* sub hover background color after main category */


.resnav-sm a:hover{background-color:orange;color:#ffffff;} 

.resnav-sm #current{background-color:orange;color:#ffffff;} 

 .resnav-sm #subcurrent {background:red; color:#fff; text-decoration: none;}


/* Drop down arrow I beam color  */

.resnav-sm li:hover>.navicon{border-left-color:#fff;}

.resnav-sm li:hover>.navicon:after{border-left-color:#fff;}



/* Drop down arrow I beam color  */


.resnav-sm .sub-ul{display:none;}

@-webkit-keyframes slide{0%{-webkit-transform:translateX(100%);opacity:0;} 100%{-webkit-transform:translateX(0px);opacity:1;}}@-moz-keyframes slide{0%{-moz-transform:translateX(100%);opacity:0;} 100%{-moz-transform:translateX(0px);opacity:1;}}@keyframes slide{0%{transform:translateX(100%);opacity:0;} 100%{transform:translateX(0px);opacity:1;}}.resnav-sm.resnav-subview li,.resnav-sm.resnav-subview li.resnav-subviewopen>a,.resnav-sm.resnav-subview li.resnav-subviewopen>.navicon,.resnav-sm.resnav-subview li.resnav-subview>a,.resnav-sm.resnav-subview li.resnav-subview>.navicon {display:none;}

.resnav-sm.resnav-subview li.resnav-subview,.resnav-sm.resnav-subview li.resnav-subview .sub-ul,.resnav-sm.resnav-subview li.resnav-subviewopen,.resnav-sm.resnav-subview li.resnav-subviewopen>.sub-ul,.resnav-sm.resnav-subview li.resnav-subviewopen>.sub-ul>li>a,.resnav-sm.resnav-subview li.resnav-subviewopen>.sub-ul>li{display:block;-webkit-animation:slide 0.25s ease-in-out;-moz-animation:slide 0.25s ease-in-out;animation:slide 0.25s ease-in-out;}

 
 
 
	 
 
@media screen and (max-width: 422px) {
  
.resnav-sm a{display:block;padding:3px 13px;}
 .resnav-lg>ul>li>ul ul{display:block;top:0;left:100%;padding-left:25px;opacity:0;visibility:hidden;}

.resnav-lg>ul>li>ul ul:after{position:absolute;left:2px;top:10px;content:"";border:6px solid transparent;border-right:6px solid orange;} 
/* 2nd level subs */

 .resnav-sm .resnav-back:before{position:absolute;top:2px;left:18px;content:"";border:6px solid transparent;border-right:6px solid #fff;}


.resnav-sm{display:none;}

/* 2nd level I beam line */

.resnav-sm .navicon{position:absolute;top:3px;right:2px;height:15px;width:50px;border-left:1px solid orange;}

.resnav-sm .navicon:hover{cursor:pointer;}

/* 2nd level arrow after I beam line */

.resnav-sm .navicon:after{position:absolute;top:2px;right:8px;content:"";border:6px solid transparent;border-left:6px solid #525fe0;}



.resnav-sm li:hover>.navicon{border-left-color:#fff;}

.resnav-sm li:hover>.navicon:after{border-left-color:#fff;}
}
	
	 
	
 
 
 