body{
	font-family: 'PT Sans',sans-serif;

}

#menu{
	width: 35px;
	height: 30px;
	margin: 30px 0 20px 20px;
	cursor: pointer;
	background: transparent;
}
.bar{
	height: 3px;
	width: 50%;
	background-color: #ffac35;
	display: block;
	border-radius: 5px;
	transition: 0.3s ease;
}
#bar1{
	transform: translateY(-2px);
}
#bar3{
	transform: translateY(2px);
}
.nav li a{
	color: #0a1023;
	text-decoration: none;
	font-size:10px;
}
.nav li a:hover{
	font-weight: bold;
}
.nav li{
	list-style: none;
	padding:0px;
}
.nav{
	padding: 0;
	margin: 50px 0px;
	transition: 0.3s ease;
	display: none;
}
.menu-bg, #menu-bar{
	top: 0;
	left: 0;
	position: absolute;
}
.menu-bg{
	z-index: 1;
	width: 0;
	height: 0;
	margin: 30px 0 20px 20px;
	background: radial-gradient(circle,#e94498,#b81568);
	border-radius: 50%;
	transition: 0.3s ease;
}
#menu-bar{
	z-index: 2;	
}
.change-bg{
	width: 550px;
	height: 540px;
	transform: translate(-60%,-30%);
}
.change .bar{
	background-color: #ffac35;
}
.change #bar1{
	transform: translateY(2px) rotateZ(-60deg);
}
.change #bar3{
	transform: translateY(-4px) rotate(60deg);
}
.change #bar2{
	opacity: 0;
}
.change {
    display: block;
    background: #febd5b;
    
	margin-top: 70px;
}
li{
	padding:5px;
}
.dropbtn {
  background-color: #febd5b;
  color: #0a1023;

  font-size: 10px;
  border: none;
  cursor: pointer;
}

.dropbtn:hover, .dropbtn:focus {
  background-color: #070b19;
  color:#febd5b;
}

.dropdown {
  position: relative;
  display: inline-block;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #febd5b;
  min-width: 160px;
  overflow: auto;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}

.dropdown-content a {
  color: #0a1023;
  
  text-decoration: none;
  display: block;
}

.dropdown-content a:hover {background-color: #0a1023;color:#febd5b;}

.show {display:block;}
.dropdown-menu{
background-color: #0a1023;
	
}
.dropdown-item{
	color:WHITE;
}
@media screen and (max-width: 3000px) {
	
	.menu-bg, #menu-bar {
    left: 0;
    position: absolute;
    display: none;
}
}
@media screen and (max-width: 768px) {
	
	.menu-bg, #menu-bar {
    left: 0;
    position: absolute;
    display: none;
}
}

@media screen and (max-width:425px) {
	
	.menu-bg, #menu-bar {
    left: 0;
    position: absolute;
    display: block;
}
.sidebar{
	
	display:none;
}

.navbar a{
	display:none;
	
}

.footer{
	padding-top:15%
}


}