/*import*/
div#navigation-container{background-color: rgba(255,255,255,.9);}

a.nav-link{color: #FFFF; padding: 15px 20px; text-decoration: none; font-size:1rem;}

nav a:hover{text-decoration: none; color:white;}

/*end of import*/
a, a:hover { color: #0062cc;}

/*nav { background-color: rgba(0,0,0,.6); position: relative; padding: 45px 0px 0px 180px; }*/

/* Add menu rules here */
nav ul {list-style:none; margin:0; padding:0;}
/*nav ul a{width: 100%}*/
nav ul::after{content: ''; display:block; clear:both;}
/*root*/
nav ul li:hover > a{ transition: all .5s ease-in-out; background-color: #FAFAFA}
nav ul ul li:hover > a{ border-left: 5px solid #28282d; transition: all .5s ease-in-out; background-color: #FAFAFA}
/*level 1 -- hover to display level 2*/ 
nav ul li:hover > ul {display: block; }
/*level 2 -- hover to display level 3*/ 
nav ul ul li:hover > ul {display: block; width: 100%;}

nav ul li a {display: inline-block; color: white; padding: 15px 20px; text-decoration: none;  width: 100%;}
nav ul ul ul li a{width: 100%;  display: block; white-space:nowrap;}

/*top level*/
nav > ul {padding-left:35px;}
nav > ul > li {float:left;}
nav > ul > li > a {padding:10px 20px 15px 20px; width:100%; }

nav ul ul {display: none; position: absolute; top:100%; background-color: #323030;}
nav ul ul li {position: relative;}
nav ul ul li a {color:black;}
nav ul ul ul {left:100%; top:0;}

/*Color selections*/
nav.bg-dark a:hover{text-decoration: none; color:#323030;}
nav.bg-dark a.navbar-brand{color: white;}
nav.bg-dark ul li a {display: inline-block; color: white; padding: 15px 20px; text-decoration: none;  width: 100%;}
nav.bg-dark ul ul {background-color: #323030;}
nav.bg-dark button.navbar-toggler span{color: white;}
nav.bg-dark ul li:hover > a{transition: all .5s ease-in-out; background-color: #323030; padding-left: 10px;}
nav.bg-dark ul li:hover > a:hover{transition: all .5s ease-in-out; background-color: #FAFAFA; padding-left: 10px;}
nav.bg-dark ul ul li:hover > a{ border-left: 5px solid #D63426; transition: all .5s ease-in-out; background-color: #323030; padding-left: 10px;}
nav.bg-dark ul ul li:hover > a:hover{ border-left: 5px solid #D63426; transition: all .5s ease-in-out; background-color: #FAFAFA; padding-left: 10px}

nav.bg-light{background-color: white !important;}
nav.bg-light a.navbar-brand{color: #323030;}
nav.bg-light a:hover{text-decoration: none; color:#323030;}
nav.bg-light ul li a {display: inline-block; color: #323030; padding: 15px 20px; text-decoration: none;  width: 100%;}
nav.bg-light ul ul {background-color: rgba(255,255,255,.9)}
nav.bg-light button.navbar-toggler span{color: #323030;}

nav.navbar:hover{
	box-shadow:0 .5rem 1rem rgba(0,0,0,.15) !important;
	transition: all .2s ease-in-out;
}


 /* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
	nav ul ul, nav ul ul ul {display: none; position: relative; overflow: hidden}
	nav ul ul ul {left:0; top:0;}
}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
	nav ul ul {display: none; position: absolute; top:100%; background-color: #323030;}
}


/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
	nav ul ul {display: none; position: absolute; top:100%; background-color: #323030;}
	nav ul ul ul li a{width: 100%;  display: block; white-space:nowrap;}
}

a:hover{text-decoration: underline;}