body { padding-top: 0px; overflow-x: hidden; }
.left-aligned { margin-left: auto; }
.bg-dark { background-color: #343a40 !important; }
.bg-hero { background-color: #45b06cff; }

/* CALLOUT */
.bd-callout { padding:1.25rem; margin-top:1.25rem; margin-bottom:1.25rem; border:1px solid #e9ecef; border-left-width:.25rem; border-radius:.25rem }
.bd-callout h4 { margin-bottom:.25rem }
.bd-callout p:last-child { margin-bottom:0 }
.bd-callout code { border-radius:.25rem }
.bd-callout+.bd-callout { margin-top:-.25rem }
.bd-callout-info { border-left-color:#5bc0de }
.bd-callout-warning { border-left-color:#f0ad4e }
.bd-callout-danger { border-left-color:#d9534f }

/* footer */
footer a { color: white; font-weight: bold; text-decoration: none; }
footer a:hover { color: white; text-decoration: underline; }


p{
  
  text-align: justify;
  
}
.wave{
  bottom: 0;
}
.footer{
  bottom: 0;
}

.loader-img1{

    position: fixed;
    width: 100%;
    height: 100%;
    background-color: #00031f;
    z-index: 99000;
    display: flex;
    justify-content: center;
    align-items: center;
    display: block;
}
.loader-img2{
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #00031f;
    z-index: 99000;
    display: none;
    justify-content: center;
    align-items: center;
}



p{
  font-size: 1.2vw;
  line-height: 1.5vw;
  padding: 2%;
}

#gotopimg{
  transition-duration: 0.3s;
}

#gotopimg:hover{
    transform: scale(2);
}

.menu-picture {
  position: fixed;
  top: 10px; /* 与顶部的距离 */
  right: 50px; /* 与右侧的距离 */
  z-index: 9999;
}

html{
  scroll-behavior: smooth;
  overflow: -moz-scrollbars-none;  /* For Firefox */
  -ms-overflow-style: none;  /* For Internet Explorer and Edge */
  scrollbar-width: none;  /* For Firefox */
  &::-webkit-scrollbar { 
    display: none;  /* For Chrome, Safari, and Opera */
  }
}













































.bigcard{
    width: 100%;
    height: 500vw;
    background-color: blue;
    margin: 0;
}
.menu-moon{
position: absolute;
width: 30%;
left:1.5vw ;
top: 1vw;
rotate: 20deg;
transition: 0.35s;
}
.menu-line{
position: absolute;
width: 40%;
top: 3vw;
height: 7vw;
left: -3vw;
}

.sidenav {
font-family: comic sans ms;
background-color: #416d8e;
display: block;
left: -500px;
top: 30%;
width: 14%;
position: fixed;
z-index: 3;
pointer-events: all;
text-align: right;
font-size: 1.2rem;
font-weight: bold;
line-height: 2vw;
/* 初始位置在屏幕左侧 */
transition: left 0.2s;
/* 添加过渡效果 */
border-radius: 20px;
}

a.side {
color: #fff1b6;
word-wrap: break-word;
word-break: keep-all;
text-align: center;
text-decoration: none;

display: inline;
padding: 0 0px;
font-size: 1rem;
font-family: comic sans ms;
}

a.side:hover {
font-size: 1.2rem;
text-align: right;
background-color: transparent;
}



.sidebox {
display: flex;
margin: 5% 0% 8% 0%;
margin-left: 2%;
}

.sideleft {
flex: 1;
text-align: center;
}