@charset "utf-8";

 .toggle, [id^=drop] {
 display: none;
}

nav {
  font-size: 14px;
  line-height: 20px;
  color: #ffffff;
  word-wrap: break-word !important;
  font-family: "Arial", sans-serif, Cabin, Helvetica;
  text-decoration: none;
  font-weight: bold;
  z-index:1000;
}


nav:after {
  content: "";
  display: table;
  clear: both;
}

nav ul {
  float: right;
  padding: 0px;
  margin: 0;
  list-style: none;
  position: relative;
}

nav ul li {
  display: inline-block;
  float: left;
  background-color: #eeeeee;
  margin: 5px;
  border-radius: 15px;
}

nav a {
  display: block;
  padding: 0 10px;
  color: #686868;
  font-size: 12px;
  line-height: 36px;
  text-decoration: none;
  font-weight: bold;
   margin:0px;
   padding-right: 20px;
   padding-left: 20px;
}

nav ul li ul li:hover { 
  background: #FFDD79; 
  border-radius: 0px;
}

nav a:hover { 
  background-color: #FFDD79;
  border-radius: 15px;
 }

nav ul ul {
  display: none;
  position: absolute;
  top: 41.5px;
  z-index: 999;
}

nav ul li:hover > ul { 
	display: inherit; 
	z-index: 999;
}

nav ul ul li {
  width: 180px;
  float: none;
  display: list-item;
  position: relative;
  margin:0;
  border-radius: 0px;
  z-index: 999;
}

nav ul ul ul li {
  position: relative;
  top: -30px;
  left: 180px;
  width: 180px;
  margin:0;
  border-radius: 0px;
  z-index: 999;
}

li > a:after { content: ' '; }

li > a:only-child:after { content: ' '; }


/* Media Queries
--------------------------------------------- */

@media all and (max-width : 660px) {
	
	nav a {
		line-height: 25px;
}

nav { margin: 0;}

.toggle + a,
 .menu { display: none; 
 }

.toggle {
  display: block;
  background-color: #ECC551;
  padding: 0 10px;
  color: #FFF;
  font-size: 12px;
  text-decoration: none;
  border: none;
  font-weight: bold;
  border-radius: 0px; 	
}

.toggle:hover { 
   background-color: #FFDD79; 
   border-radius: 0px;
}

[id^=drop]:checked + ul { 
	display: block; 	 
}

nav ul li {
  display: block;
  width: 100%;
  display: inline-block;
  float: left;
  background-color: #ECC551;
  margin: 0px;
  border-radius: 0px;

}

nav ul ul .toggle,
 nav ul ul a { padding: 0 40px; 
   border-radius: 0px; 
   }

nav ul ul ul a { padding: 0 50px; 
   border-radius: 0px; 

   }

nav a:hover,
 nav ul ul ul a { background-color: #FFDD79;
   border-radius: 0px; 
 }

nav ul li ul li .toggle,
 nav ul ul a { background-color: #ECC551;
 
    border-radius: 0px; 
}
 
 nav ul li ul li ul li .toggle,
 nav ul ul ul a { 
 background-color: #ECC551;

  }

nav ul ul {
  float: none;
  position: static;
  color: #ffffff;
}

nav ul ul li:hover > ul,
nav ul li:hover > ul { display: none; 

}

nav ul ul li {
  display: block;
  width: 100%;
  
}

nav ul ul ul li { position: static;
  width: 100%;
}

@media all and (max-width : 330px) {

nav ul li {
  display: block;
  width: 100%;
}

nav ul ul li{
	display: block;
	width: 100%;
}

nav ul ul ul li{
	display: block;
	width: 100%;
}


