@font-face {
    font-family: 'Nunito';
      src: url('https://static.igem.wiki/teams/4225/wiki/nunito-regular.ttf') format("truetype");
      font-weight: normal;
      font-style: normal;
  }

  @font-face {
    font-family: 'Nunito';
    src: url('https://static.igem.wiki/teams/4225/wiki/nunito-italic.ttf') format("truetype");
    font-weight: normal;
    font-style: italic;
  }
  
  @font-face {
    font-family: 'Nunito';
    src: url('https://static.igem.wiki/teams/4225/wiki/nunito-bold.ttf') format("truetype");
    font-weight: bold;
    font-style: normal;
  }

.fig-wrap {
    padding-top: 1rem;             /* 图片上方的内边距 */
    padding-bottom: 1rem;            /* 图片下方的内边距 */
    padding-left: 2rem;              /* 图片左方的内边距 */
    padding-right: 2rem;             /* 图片右方的内边距 */
    background-color: #f5f0d5;       /* 淡黄色背景颜色 */
    border-radius: 10px;             /* 圆角边缘 */
    width: 60vw;              /* 根据内容自适应宽度 */
    display: flex;                   /* 使用 Flexbox */
    justify-content: center;         /* 水平居中 */
    flex-direction: column;          /* 排列方向：列 */
    align-items: center;             /* 垂直居中 */
    align-self: center;              /* 自身居中 */
    margin: 2rem auto;               /* 上下各有 2rem 的外边距，让外层容器居中 */
    /* 添加轻微的阴影来增加视觉效果 */
}


.fig {
    width: 80%;
    height: auto;
}

/* 統一文字格式 ---------------------------------------------*/
.big_title {
    font-size: 48px; /* Adjust size if needed */
    color: #587449;  /* Set the color */
    font-family: 'Nunito';  /* Ensure consistent font */
    text-align: center;  /* Center the title */
}
.title_name p {       /*大標題字體大小與顏色*/
    font-size:2.2rem; /* 設置文字大小 */
    color: #AD7319; /* 設置文字顏色 */
    font-family: 'Nunito';
}
.title_nam p {       /*大標題字體大小與顏色*/
    font-size:1.5rem; /* 設置文字大小 */
    color: #AD7319; /* 設置文字顏色 */
    font-family: 'Nunito';
    text-align: center;
}

.subtitle_text{
    text-indent: 0rem;
    font-family: 'Nunito';
}

.subtitle_text p{
    font-size: 1.6rem;
    color: #1f1e1c;
    font-family: 'Nunito';
}

.subsubtitle_text{
    text-indent: 0rem;
    font-family: 'Nunito';
}

.subsubtitle_text p{
    font-size: 1.3rem;
    color: #6e6861;
    font-family: 'Nunito';
}

.content_text p{
    text-indent: 0px;  /*文章首行縮兩格*/
    font-size: 1.1rem;
    color: #503711;
    font-family: 'Nunito';
}

.content_text li{
    color: #503711;
}

.content_text ol{
    /* text-indent: 2em;  文章首行縮兩格 */
    color: #1f1e1c;
}

.form_title{
    text-align: center;  /*圖片名稱介紹*/
    font-family: 'Nunito';
    font-size: 0.9rem;
}

/* Accordion button styling */
.accordion-button {
    color: #ffffff; /* White text */
    background-color: #9ccc9c; /* Light green background */
    border: none; /* No border */
    border-radius: 0; /* Square corners */
    box-shadow: none; /* No box shadow */
    font-family: 'Nunito';  /* Ensure consistent font */
    font-size: 1.6rem;  /* Match the subtitle_text size */
}

/* Style for the accordion button when hovered or active */
.accordion-button:hover, 
.accordion-button:not(.collapsed) {
    color: #587449; /* Dark green text color when hovered or active */
    background-color: #d6efc0; /* Light beige-green background when hovered or active */
}

/* Accordion item styling */
.accordion-item {
    background-color: #9ccc9c; /* Light green background */
    border: none; /* No border */
    border-radius: 0; /* Square corners */
    box-shadow: none; /* No box shadow */
    margin-bottom: 0; /* No space between items */
    font-family: 'Nunito';  /* Ensure consistent font */
}

/* Accordion body styling */
.accordion-body {
    background-color: #f6f1da; /* Light beige background */
    padding: 1%; /* Padding inside the body */
    font-size: 1.1rem; /* Match content_text size */
    color: #503711; /* Dark brown text */
    font-family: 'Nunito'; /* Ensure consistent font */
    border: 1px solid #dee2e6; /* Border color */
    border-top: none; /* No border at the top */
    border-radius: 0; /* Square corners */
    text-align: left !important;
}
.sidenav {
    font-family: 'Nunito';   /* Apply Nunito font */
}
.MJXc-math {
    font-family: 'Nunito';
}
.content_text li {
    font-family: inherit;  /* Inherit the font from the parent .content_text */
}