* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif
}
body {
/* 	height: 150vh; */
	background-color: #111;
	background-size: cover;
	background-position: center;
}
.Aooli {
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.personal {
	padding-top: 3px;
	height: 30px;
	width:40px;
	fill: #ddd;
}
.personal:hover {
	fill: white;
}
li {
	list-style: none;
}
a {
	text-decoration: none;
	color: #ddd;
	font-size: 1em;	
}
a:hover {
	color: white;
}
header {
	background-color:#111;
	position: fixed;
	width: 100%;
	padding: 0 2rem;
	z-index: 999;
}
.navbar {
	width: 100%;
	height: 60px;
	max-width: 1200px;
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.navbar .skill {
	display: flex;
/* 	gap: 2rem;	 */
}
.skill li{
	padding-left: 2rem;
}
/* 菜单按钮 */
.toggle_btn {
	display: none;
}
.toggle_btn svg {
	height: 35px;
	width:30px;
	fill: white;
	padding-top: 4px;
}
.toggle_btn svg:hover {
	fill: white;
}
/* 下拉菜单 */
.dropdown_menu {
	display: none;
	position: absolute;
	right: 2rem;
	top: 60x;
	height:0;
	width: 300px;
	background-color: #333;
/* 	backdrop-filter: blur(15px); */
	overflow: hidden;
	transition: 0.2s cubic-bezier(0.075, 0.82, 0.165, 1);
}
.dropdown_menu.open {
	height: 170px;
}
.dropdown_menu li {
	padding: 0.7rem;
	display: flex;
	align-items: center;
	justify-content: center;
}
/* 收缩菜单 */
@media (max-width:550px) {
	.navbar .skill {
		display: none;
	}
	.toggle_btn {
		display: block;
	}
	.dropdown_menu {
		display: block;
	}
}

/* 收缩菜单放大框 */
@media (max-width:450px) {
	.dropdown_menu {
		left: 2rem;
		width: unset;
	}
}
/* 最小隐藏字体 */
@media (max-width:220px) {
	.name {
		display: none;
	}
}