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

.bg-dark1{
  background-color: #83DDBA!important;
}

/* CALLOUT */
.bd-callout {
  padding: 1.25rem;
  margin-top: 1.25rem;
  margin-bottom: 1.25rem;
  border: 1px solid #e9ecef;
  border-left-width: 0.25rem;
  border-radius: 0.25rem;
}
.bd-callout h4 {
  margin-bottom: 0.25rem;
}
.bd-callout p:last-child {
  margin-bottom: 0;
}
.bd-callout code {
  border-radius: 0.25rem;
}
.bd-callout + .bd-callout {
  margin-top: -0.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: #212529;
  font-weight: bold;
  text-decoration: none;
}
footer a:hover {
  color: #212529;
  text-decoration: underline;
}

.back-top {
  position: fixed;
  right: 50px;
  bottom: 100px;
  scroll-behavior: smooth;
}

body {
  background: #d1ebe9;
}

.article-wrap {
  max-width: 1200px;
  margin-right: auto;
  margin-left: auto;
}

.article-wrap > div {
  display: flex;
}

.article-left {
  width: 300px;
  margin-right: 30px;    max-height: 80vh;
  overflow: auto;

}

.article-right {
  flex: 1;
  border: 8px #63e1d3 solid;
  background: #fffcf7;
  padding: 35px 70px;
}

.article-right p {
  font-size: 17px;
  line-height: 1.5;
}

.article-right h1,
.article-right h2,.h12,.article-right p.h12 {
  color: #ff5c5c;
  font-size:2rem;
}

p.h12.bold{
  font-weight: bold;
}

.article-right img {
  text-align: center;
  margin: auto;
  display: block;
  margin-bottom: 10px;
  max-width: 100%;
}

.article-left .list {
  border-bottom-width: 5px;
  border-color: #fe6d73;
  border-left-width: 5px;
  border-right-width: 5px;
  border-style: dashed;
  border-top-width: 5px;
  border-radius: 10px;

  /* background-image: url(https://static.igem.wiki/teams/4882/wiki/navbg2.png);
  padding-top: 170px; */
  background-size: contain;
  background-repeat: no-repeat;
}

.article-left .list a {
  background: #63e1d3;
  height: 64px;
  display: block;
  margin: 10px;
  border-radius: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  width:270px;
}

.article-left .list p{
  margin-bottom:0;
  line-height:1.1;
}

.article-left .list a div {
  width: 100%;
  text-align: center;
}

.references {
  color: #787878;
}

.references  p{
  color: #787878;
}

.banner-img {
  height: 80vh;
  margin-bottom:50px;
}

.banner-img img {
  height: 100%;
  display: block;
  margin: auto;
}

.banner-img .framer-text:hover {
  scale: 1.01;
  transition: all;
  transition-duration: 0.5s;
}


.table-container  table,.article-right table{
  width:100%;
}

.table-container td,.article-right table td{
  padding: 10px;
  border:1px #333 solid!important;

}

.table-container table tr:nth-child(1) td{
  font-weight:bold;
}

.article-left-wrap{
  width:310px;
  margin-right:30px;
  min-width:310px;
}

.article-left-wrap::after {
  content: '1212111111111111111111111111111111111';
  display: block;
  color: transparent;
}

.inpage_dingwei {
  position: relative;
  top: -120px;
}

foreignobject span,.foreignobject span{
  left:160px!important;
}


.navbar-dark .navbar-nav .nav-link{
  color: #fff;
}



/* WebKit 浏览器（如 Chrome 和 Safari） */
.element-ui-scroll::-webkit-scrollbar {
    width: 12px; /* 滚动条的宽度 */
}

.element-ui-scroll::-webkit-scrollbar-track {
    background: #f5f5f5; /* 滚动条的轨道颜色 */
    border-radius: 12px; /* 轨道的圆角 */
}

.element-ui-scroll::-webkit-scrollbar-thumb {
    background: #c0c4cc; /* 滚动条的滑块颜色 */
    border-radius: 12px; /* 滑块的圆角 */
}

.element-ui-scroll::-webkit-scrollbar-thumb:hover {
    background: #a0a4a8; /* 滚动条滑块悬停时的颜色 */
}

/* Firefox */
.element-ui-scroll {
    scrollbar-width: thin; /* 滚动条的宽度 */
    scrollbar-color: #c0c4cc #f5f5f5; /* 滚动条的滑块颜色和轨道颜色 */
}

 
 

@media (max-width:966px){
  .article-left-wrap{
 
    margin-right: 0;
    min-width: 0;
  }

  .article-left{
    width: 300px;
    margin-right: 0;
    min-width: 0;
  }
 

  .article-right{
    padding: 35px 28px;
  }
}


@media (max-width:836px){
  .article-left-wrap{
    display: none;
  }
}

.references p{
  word-break: break-all;
}