nav {
font-family: "Lato", "Lucida Grande", Tahoma, Sans-Serif;
font-weight: 800;
font-size: 100%;
margin: 0;
padding: 15px 2% 5px 2%;
align-self: end;
}
nav:after {
content: "";
display: table;
clear: both;
}
nav ul {
float: right;
padding: 0;
margin: 0;
list-style: none;
position: relative;
}
nav ul li {
margin: 0px;
display: block;
float: left;
}
nav a {
display: inline-block;
margin: 5px 3px 1px 3px;
padding: 5px 15px;
color: #000;
font-size: 100%;
text-decoration: none; 
}
nav a:hover { 
color: #fff;
padding: 5px 15px;
text-decoration: none;
background-color: #d84427;
}
nav li:hover { 
color: #fff; 
}
li > a:after { 
content: none; 
}
.toggle, [id^=drop] {
display: none;
}
li > a:only-child:after 
{ content: ''; 
}


@media all and (max-width : 900px) {
nav { 
margin: -6px 0 0 0;
}	
	
}
	
@media all and (max-width : 600px) {

nav { 
margin: 0;
padding-top: 14px;
}
.toggle + a,
.menu { 
display: none; 
}
.toggle {
text-align: left;
display: block;
background-color: #1d84cc;
padding: 5px 5%;
color: #fff;
font-size: 100%;
line-height: 30px;
text-decoration: none;
border: none;
margin-bottom: 10px;
}
.toggle:hover {
color: #fff;
background-color: #d84427; 
}
[id^=drop]:checked + ul { 
display: block; 
}
nav ul li {
display: block;
width: 100%;
}
nav ul .toggle,
nav ul a { 
text-align: left;
padding: 2px 5%; 
margin: 5px 0;
line-height: 30px;
}
nav ul .toggle,
nav ul a:hover { 
text-align: left;
max-width: 90%;
padding: 2px 5%; 
margin: 5px 0;
line-height: 30px;
}
nav a:hover { background-color: #d84427;}
nav li:hover { background: #d84427;}
}