/* 自定义菜单 */

html {
    --main-color: 52 73 94;
    --background-color-num: 246 247 255;
    --background-white-num: 255 255 255;
    --main: rgb(var(--main-color));
    --colorG: rgb(var(--main-color) / 80%);
    --colorF: rgb(var(--main-color) / 70%);
    --colorE: rgb(var(--main-color) / 60%);
    --colorD: rgb(var(--main-color) / 50%);
    --colorC: rgb(var(--main-color) / 35%);
    --colorB: rgb(var(--main-color) / 20%);
    --colorA: rgb(var(--main-color) / 10%);
    --color-red: #f56c6c;
    --color-grey: #ededed;
    --color-white: #fff;
    --under-background: #f7f8f9;
    --diary-background: var(--background);
    --background-color: rgb(var(--background-white-num));
    --background-fill: rgb(var(--background-color-num));
    --background: rgb(var(--background-color-num) / 80%);
    --blur: blur(1rem);
    --blur2: saturate(5) var(--blur);
    --radius: 0.5rem;
    --text-shadow: 1px 2px 1px var(--colorB);
    --title-shadow: 1px 2px 1px var(--theme-30);
    --box-shadow: 0px 7px 15px 0px #a48fff30;
    --margin: 2rem;
    --gap: 1.5rem;
    --border: 1px solid var(--color-grey);
    --main-read-color: 80 50 0;
    --main-read: rgb(var(--main-read-color));
    --background-image: url(data:image/webp;base64,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);
    --background-colorA-read: #ffdab7 var(--background-image);
    --background-colorB-read: #ffe6cc var(--background-image);
    --box-shadow-read: 0px 7px 15px 0px rgb(80 50 0 / 10%);
        --th_A: #ff00bc;
    --th_B: #ff9b00;
    --theme: var(--th_A);
    --theme-10: rgb(255 0 188 / 10%);
    --theme-30: rgb(255 0 188 / 30%);
    --theme-60: rgb(255 0 188 / 60%);
    --theme-80: rgb(255 0 188 / 80%);
}
#cat_menu {
    display: none;
    position: absolute;
    background: var(--background-color);
    backdrop-filter: var(--blur);
    -webkit-backdrop-filter: var(--blur);
    color: var(--main);
    box-shadow: var(--box-shadow);
    border: var(--border);
    border-radius: var(--radius);
    font-size: 1rem;
    line-height: 2rem;
    padding: 3px;
    z-index: 999999;
    -webkit-transition: 0.2s;
    transition: 0.2s;
}
/*#cat_menu:hover{*/
/*    outline: 2px solid var(--theme);*/
/*}*/
#cat_menu ul{
    padding: 0.25rem;
    border-top: 1px dashed var(--colorB);
}
#cat_menu ul:first-child{
    border-top: 0;
}
#cat_menu ul.icons {
    font-size: 1.1rem;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.5rem;
}
#cat_menu ul.text,
#cat_menu ul.image{
    display: none;
}
#cat_menu ul button,
#cat_menu ul li{
    display: flex;
    gap: 0.25rem;
    flex-direction: row;
    padding: 0.25rem 0.6rem;
    margin: 0.25rem 0;
    cursor: pointer;
    border-radius: var(--radius);
    -webkit-transition: 0.2s;
    transition: 0.2s;
}
#cat_menu ul li a{
    width: 100%;
    display: flex;
    gap: 0.25rem;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: baseline;
}
#cat_menu ul li a i{
    width: 1.6rem;
    text-align: center;
}
#cat_menu ul.icons button,
#cat_menu ul.icons li{
    justify-content: center;
}
#cat_menu ul button{
    font-size: 1rem;
    background: unset;
    font-family: unset;
    color: var(--main);
    align-items: center;    
    width: 100%;
    line-height: 2rem;
}
#cat_menu ul button:hover,
#cat_menu ul li:hover{
    background: linear-gradient(to right, var(--th_A), var(--th_B));
    color: var(--color-white);
    box-shadow: 0px 2px 6px 2px var(--theme-30);
    -webkit-text-fill-color: unset;
}
#cat_menu ul button:hover a,
#cat_menu ul li:hover a{
    color: var(--color-white);
    -webkit-text-fill-color: unset;
}
#cat_menu ul svg{
    fill: var(--main);
    height: 2rem;
}
#cat_menu ul button:hover svg,
#cat_menu ul li:hover svg{
    fill: var(--color-white);
}

.animation_border::before {
  content: '';
  box-sizing: border-box;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0;
  height: 0;
  opacity: 0;
  border: 3px solid transparent;
  border-radius: var(--radius);
  transition: all .4s ease-out; /* 添加过渡效果 */
}
.animation_border::after {
  content: '';
  box-sizing: border-box;
  position: absolute;
  right: 0;
  top: 0;
  width: 0;
  height: 0;
  opacity: 0;
  border: 3px solid transparent;
  border-radius: var(--radius);
  transition: all .4s ease-out; /* 添加过渡效果 */
}
.animation_border:hover::before,
.animation_border:hover::after {
  width: 100%;
  height: 100%;
  opacity: 1;
  border: 3px solid transparent;
  background-clip: padding-box, border-box;
  background-origin: padding-box, border-box;
  background-image: linear-gradient(to right, var(--background-color), var(--background-color)), linear-gradient(135deg, var(--th_A), var(--th_B));
}


.animation_border_in {
    position: relative;
    padding: 0.25rem 0.5rem;
    background: var(--background-color);
    border-radius: var(--radius);
    z-index: 1;
}



/*海浪*/
.waves {
  position: relative;
  width: 100%;
  height: 15vh;
  background: #3865f2;
}
@media (max-width: 767px){
	.waves {
		height: 7vh;
	}
}
.parallax > use {
    animation: move-forever 25s cubic-bezier(0.55, 0.5, 0.45, 0.5) infinite;
}
.parallax > use:nth-child(1) {
    animation-delay: -2s;
    animation-duration: 7s;
}
.parallax > use:nth-child(2) {
    animation-delay: -3s;
    animation-duration: 10s;
}
.parallax > use:nth-child(3) {
    animation-delay: -4s;
    animation-duration: 13s;
}
.parallax > use:nth-child(4) {
    animation-delay: -5s;
    animation-duration: 20s;
}
@keyframes move-forever {
    0% {
        transform: translate3d(-90px, 0, 0);
    }
    100% {
        transform: translate3d(85px, 0, 0);
    }
}
@keyframes twinkle {
	0% {
		opacity: 0.2;
		filter: alpha(opacity=20);
	}
	50% {
		opacity: 1;
		filter: alpha(opacity=100);
	}
	100% {
		opacity: 0.2;
		filter: alpha(opacity=20);
	}
}


hr:not([size]) {
	height: 0;
    margin: 0;
    border-top: 1px dashed #fff4f4;
}
