.nav_container{float:left;width:100%;margin-top:3px;margin-bottom:3px;
  background-color:none;}
  
.nav-bar { display: none; }

nav {
  background: none;/*#c0392b*/
  z-index: 100;
  width: 750px;margin:auto;}

nav ul { list-style: none;}

nav ul li {float: left;position: relative;}

nav:after {content: "";display: block;clear: both;}

/*#780434 red, #86D1E3 blue #f7f5e6 cream*/

nav ul li a {
  color: #fdf7cf/*#780434*/;
  display: block;
  padding: 10px 20px;
  text-decoration: none;
  font-size: 18px;
  font-family: 'Barlow';
  }
 nav ul li a:hover {color: #86D1E3;} 

nav ul li:hover { background: none;z-index:100;}

nav ul li:hover i { color: #86D1E3;}

nav ul li i { margin-right: 10px;}

nav ul li:hover .children { display: block;color: #1d344f;}

nav ul li .children {
  display: none;
  background: #1d344f;
  position: absolute;
  width: 100%;
  z-index: 1;
}

nav ul li .children span { display: none; }

nav ul li .children li {
  display: block;
  width: 100%;
  border-bottom: 1px solid #fdf7cf;
  }

nav ul li .children li a { margin-left:0px; }

nav ul li .fa-angle-down {
  position: relative;
  top: 3px;left:1px;
}




















/*responsive nav style*/

@media all and (max-width: 800px) {

.nav_container{text-align:center;}

.nav-bar {
  display: block;
  width: 100%;
  position: absolute;
  top: 0;
  background: none;/*background: #3498db;*/
}

.nav-bar span {
  float: left;
  font-size: 20px;
  padding: 20px;
  color: #fff;
}

.nav-bar .fa-bars {
  display: block;
  padding: 10%;
  color: #fdf7cf;
  overflow: hidden;
  font-size: 30px;
  font-weight: bold;
  text-decoration: none;
  float: right;
}

nav {/*slide in mobile nav*/
  width: 100%;
  height: auto;
  position: absolute;
  right: 100%;
  top :11rem;
  overflow: hidden;
  height: 100%;
  margin:auto;background-color:#1d344f;
}


nav ul li {
  display: block;
  border-bottom: 1px solid #fdf7cf;
  width: 100%;
}

ul li a { display: block;padding: 50px; }

nav ul li .children {
  width: 100%;
  position: relative;
  overflow: hidden;
  display: none;
}

nav ul li:hover .children { display: none; }

nav ul li ul li:first-child { border-top: 1px solid #ffffff99; }

nav ul li .children span {
  display: inline-block;
  margin-right: 10px;
}

nav ul li .children a {
  margin-left: -10px;
  padding: 5px 0;
}

nav ul li .fa-angle-down {
  position: relative;
  top: 3px;
}
}