ul.navbar{
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
		background: #800;
		background: -webkit-linear-gradient(#e00,#400); /* For Safari 5.1 to 6.0 */
		background: -o-linear-gradient(#e00,#400); /* For Opera 11.1 to 12.0 */
		background: -moz-linear-gradient(#e00,#400); /* For Firefox 3.6 to 15 */
		background: linear-gradient(#e00,#400); /* Standard syntax (must be last) */
		font-size: .95em;
		font-weight: bold;
}
 ul.navbar li {
		float: left;
}
 ul.navbar li a {
		display: inline-block;
    color: white;
    text-align: center;
    padding: 10px 16px;
    text-decoration: none;
    transition: 0.1s;
}

ul.navbar li a:hover {background-color: #200;}

ul.navbar li.icon {display: none;}

ul.navbar li.active {
		background-color: white; 
		color: #200;
		border: 2px solid #800;
		border-bottom: 0;
		border-radius: 10px;
		text-align: center;
		padding: 10px 16px;
		text-decoration: none;
}
@media screen and (max-width:500px) {
  ul.navbar li:not(:first-child) {display: none;}
  ul.navbar li.icon {
    float: right;
    display: inline-block;
  }
}

@media screen and (max-width:500px) {
  ul.navbar.responsive {position: relative;}
  ul.navbar.responsive li.icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  ul.navbar.responsive li {
    float: none;
    display: inline
    }
  ul.navbar.responsive li a {
    display: block;
    text-align: left;
  	}
}