body { padding-top: 56px; }
.left-aligned { margin-left: auto; }
.bg-dark { background-color: #343a40 !important; }
/*.bg-hero { background-color: #45b06cff; }*/


/* 分页title字体 */
@font-face {
    font-family: 'title';
    src: url(Moderniz.otf);
}

/* preloader */
.preloader
 {
     position: fixed;
     top: 0;
     left: 0;
     z-index: 999;
     width: 100%;
     height: 100%;
     display: flex;
     align-items: center;
     justify-content: center;
     background-color: white;
 }
 /* 分页 bg */
 .project-bg{
    margin-top: 50px;
    height: 55vh;
   /* 背景色 */
    background-image: url(https://static.igem.wiki/teams/5979/uestcpic/project/projecthead.webp);
    display: flex;
    flex-direction: column;
    position: relative;
    overflow: hidden;
    /* padding: 10% 0; 增加上下内边距，防止内容贴边 */
    background-size: cover;
    background-repeat: no-repeat;
    z-index: 1;
    width: 100%;
    border-bottom-left-radius: 50px;
    border-bottom-right-radius: 50px;
    box-shadow: 2px;
   }
   .wetlab-bg
   {
    margin-top: 50px;
    height: 55vh;
    /* 背景色 */
     background-image: url(https://static.igem.wiki/teams/5979/uestcpic/wetlab/wethead.webp);
     display: flex;
     flex-direction: column;
     position: relative;
     overflow: hidden;
     /* padding: 10% 0; 增加上下内边距，防止内容贴边 */
     background-size: cover;
     background-repeat: no-repeat;
     z-index: 1;
     width: 100%;
     border-bottom-left-radius: 50px;
     border-bottom-right-radius: 50px;
     box-shadow: 2px;
   }
   .drylab-bg
   {
    margin-top: 50px;
    height: 55vh;
    /* 背景色 */
     background-image: url(https://static.igem.wiki/teams/5979/uestcpic/drylab/dryhead.webp);
     display: flex;
     flex-direction: column;
     position: relative;
     overflow: hidden;
     /* padding: 10% 0; 增加上下内边距，防止内容贴边 */
     background-size: cover;
     background-repeat: no-repeat;
     z-index: 1;
     width: 100%;
     border-bottom-left-radius: 50px;
     border-bottom-right-radius: 50px;
     box-shadow: 2px;
   }
   .team-bg{
    margin-top: 50px;
    height: 55vh;
   /* 背景色 */
    background-image: url(https://static.igem.wiki/teams/5979/uestcpic/team/teamhead.webp);
    display: flex;
    flex-direction: column;
    position: relative;
    overflow: hidden;
    /* padding: 10% 0; 增加上下内边距，防止内容贴边 */
    background-size: cover;
    background-repeat: no-repeat;
    /* z-index: 2; */
    width: 100%;
    border-bottom-left-radius: 50px;
    border-bottom-right-radius: 50px;
    box-shadow: 2px;
   }
   .award-bg {
       margin-top: 50px;
       height: 55vh;
       /* 背景色 */
       background-image: url(https://static.igem.wiki/teams/5979/uestcpic/award/awardhead.webp);
       display: flex;
       flex-direction: column;
       position: relative;
       overflow: hidden;
       /* padding: 10% 0; 增加上下内边距，防止内容贴边 */
       background-size: cover;
       background-repeat: no-repeat;
       /* z-index: 2; */
       width: 100%;
       border-bottom-left-radius: 50px;
       border-bottom-right-radius: 50px;
       box-shadow: 2px;
   }
   .human-practice-bg
   {
    margin-top: 50px;
    height: 55vh;
   /* 背景色 */
    background-image: url(https://static.igem.wiki/teams/5979/uestcpic/human-practice/hphead.webp);
    display: flex;
    flex-direction: column;
    position: relative;
    overflow: hidden;
    /* padding: 10% 0; 增加上下内边距，防止内容贴边 */
    background-size: cover;
    background-repeat: no-repeat;
    z-index: 1;
    width: 100%;
    border-bottom-left-radius: 50px;
    border-bottom-right-radius: 50px;
    box-shadow: 2px;
   }
   
  
   /* 分页title */
   .title-text
{
    align-items: center;
    text-align: center;
    font-family: 'title';
    font-size: 10vh;
    color: #ffffff;
    justify-content: center;
    margin: auto;
    text-shadow: 0 0 4px #000000,
    0 0 4px #000000,
    0 0 4px #000000,
    0 0 4px #000000,
    0 0 4px #000000,
    0 0 4px #000000,
    0 0 4px #000000;
    top: 50%;
}
/* 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; }

/* 基本样式 */
*, *::before {
    box-sizing: border-box;
}

body {
    font-family: 'Raleway', sans-serif;
}

html {
    font-family: sans-serif;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
}

.container > section {
    margin: 0 auto;
    padding: 10em 3em;
    text-align: center;
}

.container {
    margin-left: 70px !important;
    margin-right: 70px !important;
}

/* 链接基本样式 */
a {
    text-decoration: none;
}

.navbar-nav .nav-link {
    position: relative;
    display: inline-block;
    margin: 15px 10px;
    outline: none;
    font-weight: bold; /* 设置字体为加粗 */
    color: #ffffff;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 1px;
    text-shadow: 0 0 1px rgba(0, 0, 0, 0.3);
    font-size: 1.2em;
    padding: 0px 0px 0px;
    font-family: 'Raleway', sans-serif;
    max-height: 100px;
}

.navbar {
    background-color: rgba(72, 51, 50, 0.8);
    backdrop-filter: blur(10px); /* 背景模糊效果 */
    -webkit-backdrop-filter: blur(10px); /* 为了兼容 Safari 浏览器 */
}

.navbar {
    padding: 0 !important;
    width: 100vw;
}


.navbar-nav .nav-link.dropdown-toggle::after {
    display: none; /* 隐藏倒三角 */
}

.navbar-nav .nav-link::before {
    position: absolute;
    top: 80%;  /* 从文字底部开始 */
    left: 0;
    width: 100%;
    height: 0;  /* 初始高度为 0 */
    background: #566473;  /* 灰蓝色背景 */
    content: '';
    transition: height 0.3s ease, top 0.3s ease;  /* 同时调整 height 和 top */
    opacity: 0;
    transform-origin: top;  /* 变换原点在顶部 */
}

.navbar-nav .nav-link:hover::before {
    height: 5px;  /* 悬停时高度变为 3px */
    top: 100%;  /* 在文字底部下移 10px 的位置 */
    opacity: 1;  /* 完全可见 */
}

.navbar-nav .nav-link::before {
    transition: height 0.3s ease-in-out, top 0.3s ease-in-out;  /* 平滑过渡效果 */
}

.navbar-nav .nav-link::after {
    transition: transform 0.3s 0.3s, opacity 0.3s; /* 添加延迟以匹配鼠标移开时的动画 */
}



/* 设置下拉菜单背景颜色 */
.dropdown-menu {
    background-color: rgba(72, 68, 50, 0.9); /* 与导航栏的背景色相同 */
}

/* 确保文本和链接在深色背景下可见 */
.dropdown-menu .dropdown-item {
    color: #ffffff; /* 蓝色 */
}

.dropdown-menu .dropdown-item:hover {
    background-color: rgb(72, 51, 50); /* 鼠标悬停时的背景颜色变化 */
}
/* footer */
.container-fluid
{
    width: 100%;
}