body {
  margin: 30px;
  text-align: center;

}

ul.topnav {
    list-style-type: none;
    margin-left: 22%;
    padding: 0;

}

ul.topnav li {float: left;}

ul.topnav li a {
    display: block;
    padding: 14px 16px;
    color:#ffffff;
  background-color: #205db1;
  transition: all .5s;
  text-decoration: none;
  font-family: Sans-Serif;
  font-size: 1.4em;
  border : 1px solid #ee9b19;
  border-width: 2px;
  border-radius : 10px;
  margin-top: 0;
  margin-bottom:5px;
  margin-left:10px;
  padding-top: 5px;
  padding-right:10px;
  padding-bottom: 5px;
  padding-left: 10px;
  text-align: center;
  text-shadow : 5px 5px 10px #8A5EFD;
}

ul.topnav li a:hover
	{
		box-shadow: 6px 6px 20px rgba(0,0,0,.6);
        background-color: #f5baae;
        color:#000000;
    }

ul.topnav li a.active {
	background-color: #6490CD;
	text-shadow:none;
	box-shadow:none;
	color:#fff;
	}


@media screen and (max-width: 780px){
	ul.topnav {
	margin-left:1%;
	} 
    ul.topnav li {float: none;			
    }
}