/* 一级菜单居中 */
#nav .menus_items {
  position: absolute !important;
  width: fit-content !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
}

/* 子菜单横向展示 */
#nav .menus_items .menus_item:hover .menus_item_child {
  display: flex !important;
}

/* 这里的2是代表导航栏的第2个元素，即有子菜单的元素，可以按自己需求修改 */
.menus_items .menus_item:nth-child(2) .menus_item_child {
  left: 10px;
}

.menus_items .menus_item:nth-child(3) .menus_item_child {
  left: -50px;
}

.menus_items .menus_item:nth-child(4) .menus_item_child {
  left: -80px;
}


/* 标题增强 */
#site-name::before {
  opacity: 0;
  background-color: rgb(4, 164, 127) !important;
  border-radius: 8px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
  transition: 0.3s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
  position: absolute;
  top: 0 !important;
  right: 0 !important;
  width: 100%;
  height: 100%;
  content: "\f015";
  box-shadow: 0 0 5px rgb(4, 164, 127);
  font-family: "Font Awesome 6 Free";
  text-align: center;
  color: white;
  line-height: 54px;
  /*如果有溢出或者垂直不居中的现象微调一下这个参数*/
  font-size: 18px;
  /*根据个人喜好*/
}

#site-name:hover::before {
  opacity: 1;
  scale: 1.03;
}

#site-name {
  position: relative;
  font-size: 24px;
  /*一定要把字体调大点，否则效果惨不忍睹！*/
}


/* 顶栏常驻 */
.nav-fixed #nav{
  transform: translateY(58px)!important;
  -webkit-transform: translateY(58px)!important;
  -moz-transform: translateY(58px)!important;
  -ms-transform: translateY(58px)!important;
  -o-transform: translateY(58px)!important;
}
#nav{
  transition: none!important;
  -webkit-transition: none!important;
  -moz-transition: none!important;
  -ms-transition: none!important;
  -o-transition: none!important;
}


/* 导航栏显示标题 */
#page-name::before {
  font-size: 22px;
  position: absolute;
  width: 100%;
  height: 90%;
  border-radius: 8px;
  color: white !important;
  top: 0;
  left: 0;
  content: "枯萎的花儿，能否再次绽放";
  background-color: rgb(4, 164, 127);
  transition: all 0.3s;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  -ms-transition: all 0.3s;
  -o-transition: all 0.3s;
  opacity: 0;
  box-shadow: 0 0 3px rgb(153, 233, 214);
  line-height: 46px;
  /*如果垂直位置不居中可以微调此值，也可以删了*/
}

#page-name:hover:before {
  opacity: 1;
}

#name-container {
  transition: all 0.3s;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  -ms-transition: all 0.3s;
  -o-transition: all 0.3s;
  line-height: 54px;
}

#name-container:hover {
  scale: 1.03;
}

#page-name {
  position: relative;
  padding: 10px 30px;
  /*如果文字间隔不合理可以微调修改，第二个是水平方向的padding，第一个是垂直的*/
}

#nav {
  padding: 0 20px;
}

/* 修复滚动显示标题居中 */
center#name-container {
  position: absolute !important;
  width: fit-content !important;
  left: 40% !important;
}
  

@media screen and (max-width: 768px) {
  center#name-container {
    display: none;
  }
}