body { /*background-color:#f9f5ef;*/
	padding-top: 56px; }
.left-aligned { margin-left: auto; }
.bg-dark { background-color: #343a40 !important; }
/*.bg-hero { background-color:}*/
.blank{
	height: 400px;
}
.figu{
	width: 800px;
	padding-bottom: 20px;
	text-align: center;
}

.notebook{
	left: 25%;
	position: relative;
	width: 50%;
	background-size: 100%;
	box-shadow:0 0 10px #f0a60680;
	border-style: dashed solid;
	border-width:thick;
    border-color: #d2a66c;
	padding-bottom: 0px;
}

.figu2{
	width: 800px;
	padding-bottom: 20px;
	height: 500px;
	margin-left: 50px;
	
}
.figu21{
	width: 600px;
	margin-top:20px;
	position: absolute;
	animation:ac1 10s linear  infinite ;
}
.figu22{
	width: 500px;
	margin-top:120px;
	position: absolute;
	animation:ac2 10s   linear  infinite ;
}
.figu23{
	width: 100px;
	margin-top:240px;
	margin-left: 450px;
	position: absolute;
	animation:ac3 10s linear  infinite ;
}
.figu24{
	width: 800px;
	margin-top:320px;
	position: absolute;
	animation:ac4 10s linear  infinite ;
}
.figu25{
	width: 900px;
	margin-top:320px;
	position: absolute;
	animation:ac5 10s linear  infinite ;
}
@keyframes ac1{
	0%{opacity:0 ;}
	10%{opacity:1;}
	90%{opacity:1;}
	100%{opacity:0;}
}
@keyframes ac2{
	0%{opacity:0 ;}
	10%{opacity:0;}
	20%{opacity:1;}
	90%{opacity:1;}
	100%{opacity:0;}
}
@keyframes ac4{
	0%{opacity:0 ;}
	20%{opacity:0;}
	30%{opacity:1;}
	40%{opacity:1;}
	41%{opacity:0;}
	100%{opacity:0;}
}
@keyframes ac3{
	0%{opacity:0 ;}
	38%{opacity:0;}
	41%{opacity:1;}
	90%{opacity:1;}
	100%{opacity:0;}
}
@keyframes ac5{
	0%{opacity:0 ;}
	42%{opacity:0;}
	44%{opacity:1;}
	90%{opacity:1;}
	100%{opacity:0;}
}
.figu3{
	width: 80%;
	padding-bottom: 20px;
	height:400px;
	left: 20%;
	position: relative;
	
}
.figu31{
	width: 70%;
	margin-top:20px;
	position: absolute;
	animation:acc1  linear 8s infinite ;
}
.figu32{width: 70%;
	margin-top:20px;
	position: absolute;
	animation:acc2  linear 8s infinite ;
}
.figu33{width: 70%;
	margin-top:20px;
	position: absolute;
	animation:acc3  linear 8s infinite ;}
.figu34{width: 70%;
	margin-top:20px;
	position: absolute;
	animation:acc4  linear 8s infinite ;
}
.figu35{width: 70%;
	margin-top:20px;
	position: absolute;
	animation:acc5  linear 8s infinite ;
}
.figu36{width: 70%;
	margin-top:20px;
	position: absolute;
	animation:acc6  linear 8s infinite ;
}
.figu37{width: 70%;
	margin-top:20px;
	position: absolute;
	animation:acc7  linear 8s infinite ;
}
.figu38{width: 70%;
	margin-top:20px;
	position: absolute;
	animation:acc8  linear 8s infinite ;
}
.figu39{width: 70%;
	margin-top:20px;
	position: absolute;
	animation:acc9  linear 8s infinite ;
}

@keyframes acc1{
	0%{opacity:1 ;}
	9%{opacity:1 ;}
	10%{opacity:0;}
	19%{opacity:0 ;}
	20%{opacity:0;}
	29%{opacity:0 ;}
	30%{opacity:0 ;}
	39%{opacity:0;}
	40%{opacity:0 ;}
	49%{opacity:0;}
	50%{opacity:0 ;}
	59%{opacity:0 ;}
	60%{opacity:0;}
	69%{opacity:0 ;}
	70%{opacity:0;}
	79%{opacity:0 ;}
	80%{opacity:0 ;}
	89%{opacity:0;}
	90%{opacity:0 ;}
	99%{opacity:0;}
	100%{opacity:0;}
}
@keyframes acc2{
	0%{opacity:0 ;}
	9%{opacity:0 ;}
	10%{opacity:1;}
	19%{opacity:1 ;}
	20%{opacity:0;}
	29%{opacity:0 ;}
	30%{opacity:0 ;}
	39%{opacity:0;}
	40%{opacity:0 ;}
	49%{opacity:0;}
	50%{opacity:0 ;}
	59%{opacity:0 ;}
	60%{opacity:0;}
	69%{opacity:0 ;}
	70%{opacity:0;}
	79%{opacity:0 ;}
	80%{opacity:0 ;}
	89%{opacity:0;}
	90%{opacity:0 ;}
	99%{opacity:0;}
	100%{opacity:0;}
}@keyframes acc3{
	0%{opacity:0 ;}
	9%{opacity:0 ;}
	10%{opacity:0;}
	19%{opacity:0;}
	20%{opacity:1;}
	29%{opacity:1 ;}
	30%{opacity:0 ;}
	39%{opacity:0;}
	40%{opacity:0 ;}
	49%{opacity:0;}
	50%{opacity:0 ;}
	59%{opacity:0 ;}
	60%{opacity:0;}
	69%{opacity:0 ;}
	70%{opacity:0;}
	79%{opacity:0 ;}
	80%{opacity:0 ;}
	89%{opacity:0;}
	90%{opacity:0 ;}
	99%{opacity:0;}
	100%{opacity:0;}
}@keyframes acc4{
	0%{opacity:0 ;}
	9%{opacity:0 ;}
	10%{opacity:0;}
	19%{opacity:0 ;}
	20%{opacity:0;}
	29%{opacity:0 ;}
	30%{opacity:1 ;}
	39%{opacity:1;}
	40%{opacity:0 ;}
	49%{opacity:0;}
	50%{opacity:0 ;}
	59%{opacity:0 ;}
	60%{opacity:0;}
	69%{opacity:0 ;}
	70%{opacity:0;}
	79%{opacity:0 ;}
	80%{opacity:0 ;}
	89%{opacity:0;}
	90%{opacity:0 ;}
	99%{opacity:0;}
	100%{opacity:0;}
}@keyframes acc5{
	0%{opacity:0 ;}
	9%{opacity:0 ;}
	10%{opacity:0;}
	19%{opacity:0 ;}
	20%{opacity:0;}
	29%{opacity:0 ;}
	30%{opacity:0 ;}
	39%{opacity:0;}
	40%{opacity:1 ;}
	49%{opacity:1;}
	50%{opacity:0 ;}
	59%{opacity:0 ;}
	60%{opacity:0;}
	69%{opacity:0 ;}
	70%{opacity:0;}
	79%{opacity:0 ;}
	80%{opacity:0 ;}
	89%{opacity:0;}
	90%{opacity:0 ;}
	99%{opacity:0;}
	100%{opacity:0;}
}@keyframes acc6{
	0%{opacity:0 ;}
	9%{opacity:0 ;}
	10%{opacity:0;}
	19%{opacity:0 ;}
	20%{opacity:0;}
	29%{opacity:0 ;}
	30%{opacity:0 ;}
	39%{opacity:0;}
	40%{opacity:0 ;}
	49%{opacity:0;}
	50%{opacity:1 ;}
	59%{opacity:1 ;}
	60%{opacity:0;}
	69%{opacity:0 ;}
	70%{opacity:0;}
	79%{opacity:0 ;}
	80%{opacity:0 ;}
	89%{opacity:0;}
	90%{opacity:0 ;}
	99%{opacity:0;}
	100%{opacity:0;}
}@keyframes acc7{
	0%{opacity:0 ;}
	9%{opacity:0 ;}
	10%{opacity:0;}
	19%{opacity:0 ;}
	20%{opacity:0;}
	29%{opacity:0 ;}
	30%{opacity:0 ;}
	39%{opacity:0;}
	40%{opacity:0 ;}
	49%{opacity:0;}
	50%{opacity:0 ;}
	59%{opacity:0 ;}
	60%{opacity:1;}
	69%{opacity:1 ;}
	70%{opacity:0;}
	79%{opacity:0 ;}
	80%{opacity:0 ;}
	89%{opacity:0;}
	90%{opacity:0 ;}
	99%{opacity:0;}
	100%{opacity:0;}
}@keyframes acc8{
	0%{opacity:0 ;}
	9%{opacity:0 ;}
	10%{opacity:0;}
	19%{opacity:0 ;}
	20%{opacity:0;}
	29%{opacity:0 ;}
	30%{opacity:0 ;}
	39%{opacity:0;}
	40%{opacity:0 ;}
	49%{opacity:0;}
	50%{opacity:0 ;}
	59%{opacity:0 ;}
	60%{opacity:0;}
	69%{opacity:0 ;}
	70%{opacity:1;}
	79%{opacity:1 ;}
	80%{opacity:0 ;}
	89%{opacity:0;}
	90%{opacity:0 ;}
	99%{opacity:0;}
	100%{opacity:0;}
}@keyframes acc9{
	0%{opacity:0 ;}
	9%{opacity:0 ;}
	10%{opacity:0;}
	19%{opacity:0 ;}
	20%{opacity:0;}
	29%{opacity:0 ;}
	30%{opacity:0 ;}
	39%{opacity:0;}
	40%{opacity:0 ;}
	49%{opacity:0;}
	50%{opacity:0 ;}
	59%{opacity:0 ;}
	60%{opacity:0;}
	69%{opacity:0 ;}
	70%{opacity:0;}
	79%{opacity:0 ;}
	80%{opacity:1 ;}
	89%{opacity:1;}
	90%{opacity:0 ;}
	99%{opacity:0;}
	100%{opacity:0;}
}


.teama1{
	width: 700px;
	margin-top:120px;
	margin-left: 270px;
	position: absolute;
	z-index: 15;
	animation: bigger3 1s ease-in-out  infinite alternate;
}
.teama2{
	width: 450px;
	margin-top:200px;
	margin-left: 450px;
	position: absolute;
	z-index: 10;
	animation:twinkle 3s linear  2s infinite ;
}
@keyframes twinkle{
	from{opacity: 0.8;}
to{opacity: 1;}}
.teama3{
	width: 800px;
	margin-top:150px;
	margin-left: 300px;
	position: absolute;
	z-index: 1;
	animation: 1s linear  2s infinite ;
}
.teama4{
	width: 470px;
	margin-top:25px;
	margin-left: 320px;
	position: absolute;
	animation: float-uup  ease-in-out  1.3s infinite ;
	-webkit-animation:float-uup  ease-in-out  1.3s infinite ;
}
@keyframes float-uup {
	from {
		transform: translateY(0px);
	}
	to {
		transform: translateY(-5px);
	}
	
} 

@-webkit-keyframes float-uup {
	from {
		transform: translateY(0px);
	}
	to {
		transform: translateY(-5px);
	}
	
} 
.teama5{
	width: 250px;
	margin-top:155px;
	margin-left: 310px;
	position: absolute;
	z-index: 3;
	animation: 1s linear  2s infinite ;
}
.teama6{
	width: 150px;
	margin-top:10px;
	margin-left: 900px;
	position: absolute;
	z-index: 0;
	animation: 1s linear  2s infinite ;
	-webkit-animation: wobble-hor-bottom 1.8s ease-in-out 1s infinite  ;
	animation: bigger3 1s 1 ,wobble-hor-bottom 2.5s  ease-in-out 1s infinite  ;
}
.teama7{
	width: 200px;
	margin-top:20px;
	margin-left: 1100px;
	position: absolute;
	z-index: 0;
	rotate: 30deg;
	animation: 1s linear  2s infinite ;
	-webkit-animation: wobble-hor-bottom 1.8s ease-in-out 1s infinite  ;
	animation: bigger3 1s 1 ,wobble-hor-bottom 2.5s  ease-in-out 1s infinite  ;
}
.teama8{
	width: 200px;
	margin-top:10px;
	margin-left: 50px;
	position: absolute;
	z-index: 0;
	rotate: -20deg;
	animation: 1s linear  2s infinite ;
	-webkit-animation: wobble-hor-bottom 1.8s ease-in-out 1s infinite  ;
	animation: bigger3 1s 1 ,wobble-hor-bottom 2.5s  ease-in-out 1s infinite  ;
}


.figu1{
	width: 25%;
	display: block;
	
}
.figu11{
	width: 30%;
	padding-left: 50px;
	padding-bottom: 30px;
	text-align: center;
	-webkit-animation: vibrate-2 5.5s linear infinite both;
	animation: vibrate-2 5.5s linear infinite both;
}
.figu12{
	width: 35%;
	padding-left: 50px;
	padding-bottom: 30px;
	text-align: center;
	-webkit-animation: vibrate-2 0.5s linear infinite both;
	animation: vibrate-2 0.5s linear infinite both;
}
.figu13{
	width: 30%;
	padding-left: 50px;
	padding-bottom: 30px;
	text-align: center;
	-webkit-animation: vibrate-2 5.5s linear infinite both;
	animation: vibrate-2 5.5s linear infinite both;
}
.figt{
	font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
	color: #532f22;
	font-weight: 500;
	font-size: large;
	line-height: 120%;
}
.container1{background-color:#f9f5ef;
	padding-top: 56px; 
	width: 100%;
}
footer{background-color:#f5ead8;
margin-top: 0%;
height:450px;}
.logo
{height: 130px;
padding-left: 20px;
padding-top:5px}
.logo1
{height: 220px;
padding-left: 20px;
padding-top: 20px;}
.leftlogo{
	padding-left: 30px;
	width:600px;
	display: inline-block;
}
.middlelogo{
	margin-left: 30px;
	width: 300px;
	position: absolute;
	display: inline-block;
}
.rightlogo{
	right: 0%;
	width: 370px;
	position: absolute;
	display: inline-block;
}
.pic{width: 30px;
	position: absolute;
	display: inline-block;
margin-top: 5px;}
.picc{
	width: 30px;
	position: absolute;
	display: inline-block;
margin-top: 5px;
}
.qrcode{
	width: 100px;
	display: none;
margin-top: 10px;}

img.picc:hover ~ img.qrcode{
	width: 100px;
	display: block;
}

hr.new1{
	border: none;
	border-top: 3px double #daaa99;
	color: #daaa99;
	overflow: visible;
	height: 5px;
  }
/*tiltle*/
.til{
	left:-5%;
	width: 98%;
	margin-left: -50px;
	margin-bottom: 100px;
	height:700px;
	display: relative;
}
.tilt{
	height: 130px;
	position: absolute;
	margin-top: 310px;
	margin-left: 380px;

}
.til8{
	position: absolute;
	width: 1300px;
	height: 800px;
	padding-left: 130px;
	
}
.til4{
	position: absolute;
	height: 300px;
	margin-top: 150px;
	margin-left: 20px;
	
}
.til3{
	position: absolute;
	height: 90px;
	margin-top: 90px;
	margin-left: 80px;
	animation:  appear1 0.5s ease-in-out  infinite alternate;
	
}
.til5{
	position: absolute;
	height: 200px;
	margin-top: 400px;
	margin-left: 1220px;
	animation:  appear1 1s ease-in-out  infinite alternate;
}
.til71{
	position: absolute;
	height: 80px;
	margin-top: 210px;
	margin-left: 430px;
	animation: grow-progress2 1s linear;
	animation-timeline: scroll();

}
.til72{
	position: absolute;
	height: 80px;
	margin-top: 210px;
	margin-left: 430px;
	animation: grow-progress3 1s linear;
	animation-timeline: scroll();

}

.til70{
	position: absolute;
	height: 80px;
	margin-top: 210px;
	margin-left: 430px;
	animation: grow-progress1 1s linear;
	animation-timeline: scroll();

}

.animove{
	animation:  grow-progress1 1s ease-in-out  infinite alternate;
}
.animove1{
	animation:  grow-progress2 1s ease-in-out  infinite alternate;
}
@keyframes grow-progress3 {
	
	0% {
	  transform:translateX(0) translateY(0px);
	}
	0.5% {
		transform:translateX(500px) translateY(0px);
	}
	1% {
		transform: translateY(80px) translateX(520px) rotate(-60deg);
	}
	1.5% {
		transform: translateY(80px) translateX(520px);
	}
	2% {
		transform:translateX(10px)
		translateY(80px);
	}
	2.5% {
		transform:translateX(-10px)
		translateY(130px)rotate(150deg);
	}
	3% {
		transform:translateX(10px)
		translateY(170px);
	}
	3.5% {
		transform:translateX(500px)
		translateY(170px)
		
	}
	4% {
		transform:translateX(500px)
		translateY(220px)
		rotate(-60deg);
	}
	4.2% {
		transform:translateY(290px) translateX(500px)
	}
	4.5% {
		transform:translateX(250px)
		translateY(290px)
		rotate(0deg);
	}
  }
@keyframes grow-progress1 {
	
	0% {
	  transform:translateX(0) translateY(0px);
	}
	1% {
		transform:translateX(500px) translateY(0px);
	}
	2% {
		transform: translateY(80px) translateX(520px) rotate(-60deg);
	}
	3% {
		transform: translateY(80px) translateX(520px);
	}
	4% {
		transform:translateX(10px)
		translateY(80px);
	}
	5% {
		transform:translateX(-10px)
		translateY(130px)rotate(150deg);
	}
	6% {
		transform:translateX(10px)
		translateY(170px);
	}
	7% {
		transform:translateX(500px)
		translateY(170px)
		
	}
	8% {
		transform:translateX(500px)
		translateY(220px)
		rotate(-60deg);
	}
	8.5% {
		transform:translateY(290px) translateX(500px)
	}
	9% {
		transform:translateX(250px)
		translateY(290px)
		rotate(0deg);
	}
  }
  @keyframes grow-progress2 {
	
	0% {
	  transform:translateX(0) translateY(0px);
	}
	0.2% {
		transform:translateX(500px) translateY(0px);
	}
	0.25% {
		transform: translateY(80px) translateX(520px) rotate(-60deg);
	}
	0.4% {
		transform: translateY(80px) translateX(520px);
	}
	0.49% {
		transform:translateX(10px)
		translateY(80px);
	}
	0.51% {
		transform:translateX(-10px)
		translateY(130px)rotate(150deg);
	}
	0.52% {
		transform:translateX(10px)
		translateY(170px);
	}
	0.53% {
		transform:translateX(500px)
		translateY(170px)
		
	}
	0.6% {
		transform:translateX(500px)
		translateY(220px)
		rotate(-60deg);
	}
	0.62% {
		transform:translateY(290px) translateX(500px)
	}
	0.7% {
		transform:translateX(250px)
		translateY(290px)
		rotate(0deg);
	}
  }
.til2{
	position: absolute;
	height: 120px;
	margin-top: 0px;
	margin-left: 90px;
	animation:  appear1 1s ease-in-out  infinite alternate;
	
}
.til1{
	position: absolute;
	height: 200px;
	margin-top: 330px;
	margin-left:1000px;
	animation: shake 0.1s linear;
	animation-timeline: scroll();
	
}
@keyframes shake {
	
	0% {
	  transform:translateX(0) translateY(0px);
	}
	2.3% {
		transform: rotate(0deg);
	}
	2.4% {
		transform: rotate(-60deg);
	}
	}
.til6{
	position: absolute;
	height: 100px;
	margin-top: 300px;
	margin-left: 1290px;
	animation:  appear1 0.7s ease-in-out  infinite alternate;
	
}
.til7{
	position: absolute;
	height: 80px;
	margin-top: 210px;
	margin-left: 430px;
	animation: grow-progress 1s linear;
	animation-timeline: scroll();
	
}

@keyframes grow-progress {
	
	0% {
	  transform:translateX(0) translateY(0px);
	}
	0.8% {
		transform:translateX(500px) translateY(0px);
	}
	1% {
		transform: translateY(80px) translateX(520px) rotate(-60deg);
	}
	1.5% {
		transform: translateY(80px) translateX(520px);
	}
	1.9% {
		transform:translateX(10px)
		translateY(80px);
	}
	2% {
		transform:translateX(-10px)
		translateY(130px)rotate(150deg);
	}
	2.1% {
		transform:translateX(10px)
		translateY(170px);
	}
	2.4% {
		transform:translateX(500px)
		translateY(170px)
		
	}
	2.5% {
		transform:translateX(500px)
		translateY(220px)
		rotate(-60deg);
	}
	2.6% {
		transform:translateY(290px) translateX(500px)
	}
	2.8% {
		transform:translateX(250px)
		translateY(290px)
		rotate(0deg);
	}
  }
/*动画*/
.anima{
	position: absolute;
	height: 750px;
	margin-top: -50px;
	box-shadow: 0px 0px 20px #f7a7d6a0;
}
.animation{
	position: absolute;
	height: 850px;
	margin-top: -8px;
	
	/*box-shadow: 0px 0px 10px #f8a3cda0;*/
}
.anima1{
	width: 180px;
	height: 180px;
	position: absolute;
	top: 120px;
	left: 9%;
	-webkit-animation: vibrate-2 1.5s linear infinite both;
	        animation: vibrate-2 1.5s linear infinite both;
	rotate: -17deg;
}
.anima2{
	width: 80px;
	height: 35px;
	position: absolute;
	top: 150px;
	left: 11.5%;
	rotate: -17deg;
	animation:  appear1 1s ease-in-out  infinite alternate;
}
@keyframes appear1 {
    
	from {
        opacity:0 ;
    to {
        opacity:1 ;
    }
}}
.anima3{
	width: 220px;
	position: absolute;
	top: 500px;
	left: 6%;
	-webkit-animation: vibrate-2 1.5s linear infinite both;
	        animation: vibrate-2 1.5s linear infinite both;
	rotate: -10deg;}

	.anima4{
		width: 110px;
		height: 200px;
		position: absolute;
		top: 150px;
		right: 8%;
		rotate: -10deg;
		-webkit-animation: vibrate-2 1.5s linear infinite both;
		animation: vibrate-2 1.5s linear infinite both;}
	.anima5{
			width: 170px;
			position: absolute;
			top: 160px;
			right: 6.5%;
			rotate: -10deg;
			animation:  bigger1 1s ease-in-out  infinite alternate;
		}
		.anima6{
			width: 170px;
			position: absolute;
			top: 470px;
			right: 8%;
			rotate: 13deg;
			-webkit-animation: vibrate-2 1.5s linear infinite both;
		animation: vibrate-2 1.5s linear infinite both;
			
		}
		.anima7{
			width: 40px;
			position: absolute;
			top: 460px;
			right: 6.7%;
			rotate: 13deg;
			animation:  appear2 1s ease-in-out  infinite alternate;
			
		}
		.anima8{
			width: 50px;
			position: absolute;
			top: 440px;
			left: 16.5%;
			rotate: -10deg;}
			.anima9{
				width: 30px;
				position: absolute;
				top: 440px;
				left: 20%;
				}
				@keyframes floating-R {
					from {
						transform: rotate('180')
					}
					to {
						transform: rotate('0');
					}
				}
			.anima10{
					width: 15px;
					position: absolute;
					top: 430px;
					left: 16%;
					rotate: -10deg;
					animation:bigger1 0.5s ease-in-out  infinite alternate;}
			@keyframes out {
				from {
					transform: rotate(90);
				}
				to {
					transform: rotate(0);}
				from {
						transform: translateY(0px) translateX(0px);
					}
					to {
						transform: translateY(-70px) translateX(-80px);
					}
				}
	
.anim{
	width: 600px;
	height: 600px;
	top: 100px;
	left: 30%;
}

.anim1{
	width: 600px;
	height: 600px;
	position: absolute;
	top: 100px;
	left: 30%;
	animation:  appear 1s ease-in-out  infinite alternate;
}
@keyframes appear {
    from {
        opacity:0.8 ;
    to {
        opacity:1 ;
    }
}}
.anim2{
	width: 120px;
	position: absolute;
	top: 220px;
	left: 30%;
	scale: 1.3;
	/*animation: wrapper-gradient 2s linear*/
		-webkit-animation: wobble-hor-bottom 3s infinite ;
				animation: wobble-hor-bottom 3s infinite ;
}
.anim2:hover{
	width: 120px;
	position: absolute;
	top: 220px;
	left: 30%;
	
}.anim4{
	width: 150px;
	position: absolute;
	top: 180px;
	left: 48%;
	/*animation: wrapper-gradient 2s linear*/
	animation:bigger1 1.5s ease-in-out  infinite alternate;
}
.anim4:hover{
	width: 150px;
	position: absolute;
	top: 180px;
	left: 48%;
	/*animation: bigger3 1s 1 ,bigger1 1.5s ease-in-out  1s infinite alternate;*/
}
.anim3{
	width: 180px;
	position: absolute;
	top: 150px;
	left: 58%;
	animation: bigger3 1s ease-in-out  infinite alternate;
	opacity: 0;
}
.anim3:hover{
	width: 180px;
	position: absolute;
	top: 160px;
	left: 58%;
	animation:twink 0.5s ease-in-out   infinite alternate;
}
.anim5{
	width: 400px;
	position: absolute;
	top: 270px;
	left: 29%;
	-webkit-animation: wobble-hor-bottom 1.8s ease-in-out 1s infinite  ;
	animation: bigger3 1s 1 ,wobble-hor-bottom 2.5s  ease-in-out 1s infinite  ;
}
.anim5:hover{
	width: 400px;
	position: absolute;
	top: 270px;
	left: 29%;
	-webkit-animation: wobble-hor-bottom 1.8s ease-in-out 1s infinite  ;
	animation: bigger3 1s 1 ,wobble-hor-bottom 1.8s  ease-in-out 1s infinite  ;
	opacity: 1;
	}
	.anim6{
		width: 400px;
		position: absolute;
		top: 260px;
		left: 45%;
		-webkit-animation: wobble-hor-bottom 6s ease-in-out 1s infinite  ;
		animation: bigger3 1s 1 ,wobble-hor-bottom 6s  ease-in-out 1s infinite  ;
		opacity: 1;
	}
	.anim6:hover{
		width: 400px;
		position: absolute;
		top: 260px;
		left: 45%;
		-webkit-animation: wobble-hor-bottom 1s ease-in-out 1s infinite  ;
		animation: bigger3 1s 1 ,wobble-hor-bottom 1s  ease-in-out 1s infinite  ;
		opacity: 1;
		}
		.anim7{
			width: 250px;
			position: absolute;
			top: 300px;
			left: 38%;
			animation:twink1 1.2s ease-in-out   infinite alternate;
			
		}
		.anim7:hover{
			width: 250px;
			position: absolute;
			top: 300px;
			left: 38%;
			-webkit-animation: vibrate-2 0.3s linear infinite both;
			animation: vibrate-2 0.3s linear infinite both;
			}
	/**
 * ----------------------------------------
 * animation wobble-hor-bottom
 * ----------------------------------------
 */
 /* ----------------------------------------------
 * Generated by Animista on 2024-7-25 21:41:19
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation vibrate-2
 * ----------------------------------------
 */
 /* ----------------------------------------------
 * Generated by Animista on 2024-7-25 21:44:0
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation wobble-hor-bottom
 * ----------------------------------------
 */
 @keyframes appear2 {
    from {
        transform: translateY(0.5px) translateX(-8px);
	  scale: 0;
    }
    to {
		scale: 1;
        transform: translateY(-0.5px) translateX(0px);
    }
}

  
@-webkit-keyframes vibrate-2 {
	0% {
	  -webkit-transform: translate(0);
			  transform: translate(0);
	}
	20% {
	  -webkit-transform: translate(2px, -2px);
			  transform: translate(2px, -2px);
	}
	40% {
	  -webkit-transform: translate(2px, 2px);
			  transform: translate(2px, 2px);
	}
	60% {
	  -webkit-transform: translate(-2px, 2px);
			  transform: translate(-2px, 2px);
	}
	80% {
	  -webkit-transform: translate(-2px, -2px);
			  transform: translate(-2px, -2px);
	}
	100% {
	  -webkit-transform: translate(0);
			  transform: translate(0);
	}
  }
  @keyframes vibrate-2 {
	0% {
	  -webkit-transform: translate(0);
			  transform: translate(0);
	}
	20% {
	  -webkit-transform: translate(2px, -2px);
			  transform: translate(2px, -2px);
	}
	40% {
	  -webkit-transform: translate(2px, 2px);
			  transform: translate(2px, 2px);
	}
	60% {
	  -webkit-transform: translate(-2px, 2px);
			  transform: translate(-2px, 2px);
	}
	80% {
	  -webkit-transform: translate(-2px, -2px);
			  transform: translate(-2px, -2px);
	}
	100% {
	  -webkit-transform: translate(0);
			  transform: translate(0);
	}
  }
  
@-webkit-keyframes wobble-hor-bottom {
	
	100% {
	  -webkit-transform: translateX(0%);
			  transform: translateX(0%);
	  -webkit-transform-origin: 50% 50%;
			  transform-origin: 50% 50%;
	}
	15% {
	  -webkit-transform: translateX(-10px) rotate(-2deg);
			  transform: translateX(-10px) rotate(-2deg);
	}
	30% {
	  -webkit-transform: translateX(10px) rotate(2deg);
			  transform: translateX(10px) rotate(2deg);
	}
	45% {
	  -webkit-transform: translateX(-10px) rotate(-2deg);
			  transform: translateX(-10px) rotate(-2deg);
	}
	60% {
	  -webkit-transform: translateX(9px) rotate(2deg);
			  transform: translateX(9px) rotate(2deg);
	}
	75% {
	  -webkit-transform: translateX(-6px) rotate(-1.2deg);
			  transform: translateX(-6px) rotate(-1.2deg);
	}
  }
  @keyframes wobble-hor-bottom {
	100% {
		-webkit-transform: translateX(0%);
				transform: translateX(0%);
		-webkit-transform-origin: 50% 50%;
				transform-origin: 50% 50%;
	  }
	  15% {
		-webkit-transform: translateX(-10px) rotate(-2deg);
				transform: translateX(-10px) rotate(-2deg);
	  }
	  30% {
		-webkit-transform: translateX(10px) rotate(2deg);
				transform: translateX(10px) rotate(2deg);
	  }
	  45% {
		-webkit-transform: translateX(-10px) rotate(-2deg);
				transform: translateX(-10px) rotate(-2deg);
	  }
	  60% {
		-webkit-transform: translateX(9px) rotate(2deg);
				transform: translateX(9px) rotate(2deg);
	  }
	  75% {
		-webkit-transform: translateX(-6px) rotate(-1.2deg);
				transform: translateX(-6px) rotate(-1.2deg);
	  }
  }
  
@keyframes wrapper-gradient {
	 from{opacity: 0;
	  transform: translateY(100%) 
	}
	 to{opacity: 1;
	  transform: translateY(0);
	}
  }
  @keyframes twink {
	from {
		opacity: 0;
	}
	to {opacity: 1;
	}
	}
	@keyframes twink1 {
		from {
			opacity: 0.5;
		}
		to {opacity: 1;
		}
		}
  @keyframes bigger2 {
	from {
		opacity: 0.5;
		transform:scale(1);
	}
	to {opacity: 1;
		transform:scale(1);
	}
	from {
		opacity: 1;
		transform:scale(1);
	}
	to {opacity: 0.5;
		transform:scale(1);
	}
	}
 

@keyframes bigger {
	from {
		opacity: 0;
		transform:scale(1.2);
	}
	to {opacity: 1;
		transform:scale(1.5);
	}
	}

@keyframes bigger3 {
	from {
		opacity: 0;
		transform:scale(1);
	}
	to {opacity: 1;
		transform:scale(1.2);
	}
	from {
		opacity: 0;
		transform:scale(1.2);
	}
	to {opacity: 1;
		transform:scale(1);}
		from {
			opacity: 1;
			transform:scale(1);
		}
		to {opacity: 0;
			transform:scale(1);
	}}
	@keyframes bigger1 {
		from {
			opacity: 1;
			transform:scale(1.5);
		}
		to {opacity: 1;
			transform:scale(1.2);
		}
		from {
			opacity: 1;
			transform:scale(1.2);
		}
		to {opacity: 1;
			transform:scale(1.5);
		}
		}
/* 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: rgb(173, 92, 92); font-weight: bold; text-decoration: none; }
footer a:hover { color: white; text-decoration: underline; }

/*LOADING*/
#loading-page {
	background-color: #f8edf9;
	position: fixed;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	opacity: 1;
	z-index: 9999;
}
/* 整个滚动条 */
::-webkit-scrollbar {
    /* 对应纵向滚动条的宽度 */
    width: 10px;
    /* 对应横向滚动条的宽度 */
    height: 20px;
}

/* 滚动条轨道 */
::-webkit-scrollbar-track {
    background-color:#f5ead8;
    border-radius: 32px;
}
::selection {
	color:#f6e4c8;
	background-color: #f5ead8;}
*{scrollbar-width:30px;
scrollbar-color:#f6e4c8 transparent;
}
.float {
	font-size:40px;
	font-family: "ButterSans-Rounded";
	line-height:30px;
	background-image:linear-gradient(#f3d39880,#dfa53b80,#f0667680);
	box-shadow: 0px 0px 5px #f5c77180;
	width: 180px;
	height: 100px;
	overflow-wrap: break-word;
	word-wrap: break-word;
	word-break: normal;
	hyphens: auto;
	padding:10px 20px 10px 30px;
	margin-left: 60px;
	border-radius:50px;
	display: inline-block;
}
.float:hover{
	font-size:40px;
	font-family: "ButterSans-Rounded";
	line-height:30px;
	background-image:linear-gradient(#f3d39880,#dfa53b80,#f0667680);
	box-shadow: 0px 0px 5px #f5c77180;
	width: 180px;
	height: 100px;
	overflow-wrap: break-word;
	word-wrap: break-word;
	word-break: normal;
	hyphens: auto;
	padding:10px 20px 10px 30px;
	margin-left: 60px;
	border-radius:50px;
	display: inline-block;
	animation: float-up 1s ease;
}
.col-lg-9 h5 {
	color: #815b34 !important;;
	font-size:20px;
	font-family: "ButterSans-Rounded";}

/*正文样式*/
div.col-lg-9 {
	margin-left: 350PX;
	display: block;
	width: fit-content;
	padding-right: 140px;
	padding-left: 70px;
	margin-top: 50px;
	margin-bottom:682px;
}
div.col-lg-9 > section::before {
	content: "";
	display: block;
	z-index:-10;
	position:relative;
	height: 60px;
	margin:-680px 0 0;
	background:transparent;

}
div.col-lg-9 > section p, div.col-lg-9 > section ul,div.col-lg-9 > section li,div.col-lg-9 > section figcaption {
	position:relative;
	z-index:1;
}
div.col-lg-9 > section {
	position:relative;
}
/*链接*/
.col-lg-9 a {
	color:#a97c2880;
	font-weight:inherit;
	
	font-size:30px;
}
.col-lg-9 a:hover {
	color:#ff96a7;
	font-weight:inherit;
	font-size:30px;
}
.view-more-horizontal-arrow{
	margin-left: 10px;
	animation: uup 0.5s ease-in-out infinite;
}

@keyframes uup
{from{transform:translateY(0);}
to{transform:translateY(5px);}}

div.view-more-horizontal-button:hover img.view-more-horizontal-arrow {
	animation: mo 0.5s linear;
}
@keyframes mo
{
	from{transform:rotate(0);}
	to{transform: rotate(90);}
}
.col-lg-9 sup {
	font-weight:600;
	font-size: 15px;
}
.col-lg-9 sub {
	font-weight:600;
	font-size: 15px;
}
.col-lg-9 h2 {
	color:#fff8ff;
	font-size:40px;
	font-family: "ButterSans-Rounded";
	line-height:60px;
	background-image: -webkit-linear-gradient(left, #b24c21, #e1a965 25%, #f78c9e 50%, #e1a965 75%, #b24c21);-webkit-text-fill-color: transparent;-webkit-background-clip: text;-webkit-background-size: 200% 100%;
	box-shadow: 0px 0px 20px #f5c77180;
	width: fit-content;
	max-width:98%;
	overflow-wrap: break-word;
	word-wrap: break-word;
	word-break: normal;
	hyphens: auto;
	padding:10px 20px 10px 10px;
	margin: 20px 0 20px 0;
	border-radius:50px 300px 300px 50px;
	-webkit-animation: maskedAnimation 4s infinite linear;
}


@keyframes maskedAnimation {
    0% {
        background-position: 0 0;
    }

    100% {
        background-position: -100% 0;
    }
}

.col-lg-9 h3 {
	color:#fff8ff;
	font-size: 25px;
	font-family: 'Montserrat';
	font-weight: 700 !important;
	box-shadow: 0px 0px 2px #ffb2ff80;
	background: #f7a3a3;
	overflow-wrap: break-word;
	word-wrap: break-word;
	word-break: normal;
	hyphens: auto;
	max-width:98%;
	padding:10px 30px 10px 30px;
	width: fit-content;
	border-radius:300px 300px 300px 300px;
	margin: 5px ;
}
.col-lg-9 h4 {
	color:#e1a965;
	font-size: 25px;
	font-family: 'Montserrat';
	font-weight: 700 !important;
	/* box-shadow: 0px 0px 2px #ffb2ff80;
	border:#ffbce5 solid 3px;
	border-radius:10px 30px 30px 10px; */
	padding:10px 30px 10px 15px;
	width: fit-content;
	margin: 5px 0;
}
.col-lg-9 h5 {
	color:#361810;
	font-weight:600;
	padding:10px 0;
}
.col-lg-9 p {
	color:#6d3d21;
	text-align: justify;
	/*设置了换行连字符，不想要删掉下面四行*/
	overflow-wrap: break-word;
	word-wrap: break-word;
	word-break: normal;
	hyphens: auto;
	font-weight:600;
	font-size: 20px;
	line-height: 35px;
	font-family:'Montserrat';
}
.col-lg-9 p.code {
	font-size:17px;
	font-family: 'SourceCodePro';
	background:#fff;
	border-radius: 5px;
	padding:2px 5px;
	line-height:22px;
	border:#ffe7ff solid 1px;
}

.col-lg-9 li {
	list-style: circle;
	color:#6d3d21;
	text-align: justify;
	font-weight:600;
	font-size: 20px;
	line-height: 35px;
	margin-left:25px;
	font-family:'Montserrat';
}
/*cd*/
.col-lg-92 li{
	max-width: 600px;
	color:#6d3d21;
	text-align: justify;
	font-weight:600;
	font-size: 20px;
	font-family:'Montserrat';
	text-decoration: none;
	line-height: 50px;
	padding-left: 1px;
}
.col-lg-92 li :hover{
	color:#d04a4e;
	text-align: justify;
	font-weight:600;
	font-size: 20px;
	font-family:'Montserrat';
	text-decoration: underline;
	line-height: 50px;
}
.col-lg-92 a{
	color:#fff;
	text-align: justify;
	font-weight:700;
	font-size: 20px;
	font-family:'Montserrat';
	text-decoration: none;
	line-height: 50px;
}
.cd-table-column
{    width: fit-content;
	max-width: 600px;
    float: left;
    border: 1.5px solid #bf8218;
    margin-left: -1px;
	background-color: #ecd1d0;
	opacity: 0.9;

}
/*正文样式*/
div.col-lg-92 {
	margin-left: 250PX;
	display: block;
	width: fit-content;
	padding-right: 140px;
	padding-left: 70px;
	margin-top: -600px;
	margin-bottom:682px;
}
div.col-lg-92 > section::before {
	content: "";
	display: block;
	z-index:-10;
	position:relative;
	height: 60px;
	margin:-680px 0 0;
	background:transparent;

}
div.col-lg-92 > section p, div.col-lg-9 > section ul,div.col-lg-9 > section li,div.col-lg-9 > section figcaption {
	position:relative;
	z-index:1;
}
div.col-lg-92 > section {
	position:relative;
}
/*链接*/
/*table 表格样式*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {

  margin: 0 ;
  padding: 0 ;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
  display: block;
}
body {
  line-height: 1;
}
ol, ul {
  list-style: none;
  padding: 0!important;
  margin: 0!important;
}
blockquote, q {
  quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
/*cd-table*/
.cd-table{
	width: 870px;
    position: relative;
    justify-content: center;
    /* overflow-x: scroll; */
    /* border-radius: 5px; */
    /* max-width: 90%; */
    white-space: nowrap;
    width: fit-content;
    /* max-width: 1170px; */
    margin: 1em auto;
    font-size: 14px;
    font-size: 0.875rem;
    display: flex;
    flex-direction: row;
}
/* --------------------------------

Primary style


/* -------------------------------- 

Modules - reusable parts of our design

-------------------------------- */
.cd-table .cd-unchecked span, .cd-table .cd-checked span {
  display: block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
}
/* 以下是瞎写的 NAVBAR */
.logon{height: 80px;}
.team_logo_svg1 {
	padding-left: 20px;
	height: 70px;
	margin: 0px;
	position: absolute;
}
.team_logo_svg2 {
	margin-top: 7px;
	margin-left: 60px;
	height: 40px;
	position: absolute;
	}
.team_logo_svg3 {
	height: 27px;
	margin-left: 657px;
	margin-top: 7px;
	position: absolute;
		}
/* new navigation */


.dropdown-content
{display: none;
  position:absolute;
  margin-top: -30px;
  width: 1420px;
}

/* .dropdown:hover .dropdown-content
{
  display:block;
} */



/*.cha{
	height: 60px;
margin-top:30px;
margin-left: 1350px;
position: absolute;
text-decoration: none;
color:  #fcfcfc!important;
font-family: 'Montserrat';
font-weight:600;
font-size:1.6rem;
}  
  .cha:after .dropdown-content
  {
	display:none!important;
  }*/
.dropdown
{
  margin-top: 0px;

}
.pict1
{height: 170px;
margin-top:80px;
margin-left: 100px;
position: absolute;}
.pict11
{height : 130px;
margin-top:120px;
margin-left: 120px;
position: absolute;}
.pict12
{height : 50px;
margin-top:80px;
margin-left: 133px;
position: absolute;
animation: float-up 0.5s ease-in-out  infinite alternate;}

.tex1
{color:  #3b046b!important;
	width: 180px;
margin-top:260px;
margin-left: 130px;
position: absolute;
font-family: 'Montserrat';
font-weight:700;
font-size:1.5rem;
}
.tex1:hover
{
	color:  #3b046b!important;
	/* width: 180px;
margin-top:260px;
margin-left: 130px;
position: absolute; */
font-family: 'Montserrat';
font-weight:700;
font-size:1.5rem;
text-shadow: 0px 0px 3px #e4bf2a;}
.menu1
{width: 180px;
	margin-top:290px;
	margin-left: 115px;
	position: absolute;}
.pict2
{width: 150px;
margin-top:80px;
margin-left: 300px;
position: absolute;
}
.pict21
{width: 50px;
margin-top:175px;
margin-left: 385px;
position: absolute;
animation: bigger3 2s ease-in-out  infinite alternate;}
.tex2
{color:  #3b046b!important;width: 180px;
margin-top:260px;
margin-left: 330px;
position: absolute;
font-family: 'Montserrat';
font-weight:700;
font-size:1.5rem;}
.tex2:hover
{color:  #3b046b!important;
	/* width: 180px;
margin-top:260px;
margin-left: 330px;
position: absolute; */
font-family: 'Montserrat';
font-weight:700;
font-size:1.5rem;
text-shadow: 0px 0px 3px #e4bf2a;}
.menu2
{width: 180px;
	margin-top:290px;
	margin-left: 315px;
	position: absolute;}
.pict3
{width: 160px;
margin-top:80px;
margin-left: 500px;
position: absolute;}
.tex3
{color:  #3b046b!important;width: 180px;
/* margin-top:260px;
margin-left: 530px;
position: absolute; */
font-family: 'Montserrat';
font-weight:700;
font-size:1.5rem;}
.tex3:hover
{color:  #3b046b!important;width: 180px;
/* margin-top:260px;
margin-left: 530px; */
position: absolute;
font-family: 'Montserrat';
font-weight:700;
font-size:1.5rem;
text-shadow: 0px 0px 3px #e4bf2a;}

.menu3
{width: 180px;
	margin-top:290px;
	margin-left: 515px;
	position: absolute;}
.pict4
{width: 180px;
margin-top:80px;
margin-left: 700px;
position: absolute;}
.tex4
{color:  #3b046b!important;width: 180px;
margin-top:260px;
margin-left: 730px;
position: absolute;
font-family: 'Montserrat';
font-weight:700;
font-size:1.5rem;}
.tex4:hover
{color:  #3b046b!important;width: 180px;
/* margin-top:260px;
margin-left: 730px; */
/* position: absolute; */
font-family: 'Montserrat';
font-weight:700;
font-size:1.5rem;
text-shadow: 0px 0px 3px #e4bf2a;}
.menu4
{width: 180px;
	margin-top:290px;
	margin-left: 715px;
	position: absolute;}
.pict51
{width: 170px;
margin-top:80px;
margin-left: 900px;
position: absolute;}

.pict52
{height: 100px;
margin-top:100px;
margin-left: 900px;
position: absolute;}
.pict52:hover
{height: 100px;
/* margin-top:100px;
margin-left: 900px;
position: absolute; */
animation: bigger3 0.5s ease-in-out  infinite alternate;}
.pict53
{height: 100px;
margin-top:100px;
margin-left: 1020px;
position: absolute;}
.pict53:hover
{
	/* height: 100px; */
/* margin-top:100px;
margin-left: 1020px;
position: absolute; */
animation: bigger3 0.5s ease-in-out  infinite alternate;}
.tex5
{color:  #3b046b!important;width: 180px;
margin-top:260px;
margin-left: 930px;
position: absolute;
font-family: 'Montserrat';
font-weight:700;
font-size:1.5rem;}
.tex5:hover
{color:  #3b046b!important;width: 180px;
margin-top:260px;
margin-left: 930px;
position: absolute;
font-family: 'Montserrat';
font-weight:700;
font-size:1.5rem;
text-shadow: 0px 0px 3px #f2c924;}
.menu5
{width: 180px;
	margin-top:290px;
	margin-left: 915px;
	position: absolute;}
.pict6
{width: 120px;
margin-top:80px;
margin-left: 1130px;
position: absolute;}
.pict61
{width: 138px;
margin-top:114px;
margin-left: 1121.5px;
position: absolute;
animation: cut-ani 1.5s ease-in-out infinite alternate;}
@keyframes cut-ani {
    from {
            transform: rotate(0deg);
    }
    to {
            transform: rotate(360deg);
    }
    
	}
.tex6
{color:  #3b046b!important;width: 180px;
margin-top:260px;
margin-left: 1130px;
position: absolute;
font-family: 'Montserrat';
font-weight:700;
font-size:1.5rem;}
.tex6:hover
{color:  #3b046b!important;width: 180px;
margin-top:260px;
margin-left: 1130px;
position: absolute;
font-family: 'Montserrat';
font-weight:700;
font-size:1.5rem;
text-shadow: 0px 0px 3px #e4bf2a;}
.menu6
{width: 180px;
	margin-top:290px;
	margin-left: 1115px;
	position: absolute;}


/* new navigation */
#navbarSupportedContent {
	bottom: 40px;
}

/* 导航栏白色背景+发光 */
.navbar {
	padding: 0%;
	background-color: #f5ead8;
	box-shadow: 0px 0px 7px #ecc970a0;
}




/* 下拉菜单那个渐变背景 */
ul.dropdown-menu {
	font-family: 'Montserrat';
	font-weight:700;
	right: 0px;
	display: block;
	width:fit-content;
}

ul.dropdown-menu:hover {
	display:block !important;
}
.nav-item {
    display: inline-block;
    margin-left: 30px;}

li.nav-item {
	background:#fff8ff;
}
li.nav-item.dropdown {
	height: 100%;
    margin-block-start: 20px;
}
/* 这个千万别动！！！！！ */
li.nav-item.dropdown:hover > ul.dropdown-menu {
	display: block !important;
	animation: float-up 0.5s ease;}
	

/* 这仨是导航悬浮变色+上浮一点点 */
.nav-item.dropdown:hover {
	transform: translateY(-5px);
	transition:0.5s;
}
.nav-item.dropdown:hover img.arrow{
	transform: rotate(180deg);
	transition:0.2s;
}
.nav-item.dropdown:hover .nav-link {
	color: #ff96a6 !important;
}
.nav-item:hover .nav-link {
	color: #ff96b4 !important;
}
.dropdown-item {
	font-weight: 600 !important;
	color:  #8e5e95!important;
    display: inline;
	font-size: larger;
	font-family: sans-serif;
	line-height: 140%;
	text-decoration: none;

}
.dropdown-item:hover {
	color: #64396f!important;
	text-shadow: 0px 0px 3px #fedcff;
	transform: translateX(2.5%) scale(1.05);
	background-color: rgba(255, 255, 255, 0) !important;
	display:block;
	font-family: sans-serif;
	line-height: 140%;
    }

/* 改了大标题字重 */
.nav-link {
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
	color: #ffa3a8 !important;
}

/* 改了小箭头的位置 */
.arrow {
	margin-left: -3px;
}

/* 原来的文件带的，感觉最好别动 */
#navbarSupportedContent {
	position: absolute;
	top: 20px;
	right: 10px;
	color: #ff9e9e;
}
/* 动画的关键帧 */
@keyframes float-up {
	from {
		opacity: 0.8;
		transform: translateY(5px);
	}
	to {
		opacity: 1;
		transform: translateY(0px);
	}
} 
/* NavBar 结束 */

/*以下是是电梯导航栏样式*/
.elevator
{list-style: none;
position: sticky;
top:14vh;
display: block;
height:fit-content;
margin-left: 60px;
margin-top: 30px;
width: fit-content;}
.side-nav::-webkit-scrollbar {display:none}
.side-nav::-ms-scrollbar {display:none}
.side-nav {scrollbar-width:none;
}
div.side-nav {
	list-style: none;
	position: sticky;
	top:15vh;
	display: block;
	height:75vh;
	overflow-y: scroll;
	margin-bottom: 150px;
	padding-top:20px;
	scrollbar-width: none;
}
.side-nav {
	list-style: none;
	position: sticky;
	top:15vh;
	display: block;
	height:75vh;
	width: 50px;
	overflow-y: scroll;
	margin-bottom: 150px;
	padding-top:20px;
	scrollbar-width: none;
}
.page-subtitle a {
	text-decoration: none;
	line-height:25px;
	color:#d4a554;
	font-family: sans-serif;
}
.page-secondary-title a {
	text-decoration: none;
	line-height:20px;
	color:#e2bb8e;
	font-family: sans-serif;
}
.page-subtitle a:hover {
	text-decoration: none;
	color:#bf9946;
	text-shadow:0 0 2px #fff6a6;
	font-family: sans-serif;
}
.page-secondary-title a:hover {
	text-decoration: none;
	color:#bf9946;
	text-shadow:0 0 2px #fff1cf;
	font-family: sans-serif;
}

/*shuxian*/
div.page-subtitle > li {
	height:fit-content;
	padding-left:20px;
	border-left:4px solid #f9f5ef;
	transition:0.5s border-left;
	padding-top:0PX;
	padding-bottom:25px;
	font-family: sans-serif;
}

div.page-secondary-title > li {
	height:fit-content;
	padding-left:20px;
	border-left:4px solid #f9f5ef;
	transition:0.5s border-left;
	padding-top:0PX;
	padding-bottom:25px;
	font-family: sans-serif;
}

/*div.page-secondary-title > li {
	height:fit-content;
	padding-left:10px;
	border-left:4px solid #5CB8FF;
	padding-bottom:10px;
	padding-top:10px;
}*/

.page-subtitle {
	font-size: 20px;
	line-height: 20px;
	font-weight: 600;
	font-family: sans-serif;
}
.page-secondary-title {
	font-size:17px;
	line-height: 17px;
	font-weight: 600;
	font-family: sans-serif;
}
/*蓝色空心圆圈*/
.page-subtitle::before {
	content:'';
	background: #fff8ff;
	position:absolute;
	transform:translateX(-80%) translateY(-40%);
	box-shadow: inset 0PX 0PX 0PX 4PX #b79539;
	margin: 10px;
	margin-left: 9.8px;
	width: 27px;
	height: 27px;
	border-radius: 50%;
}
.page-secondary-title::before {
	content:'';
	background: #fff8ff;
	position:absolute;
	transform:translateX(-92%) translateY(-53%);
	box-shadow: inset 0PX 0PX 0PX 4PX #c0a065;
	margin: 10px;
	width: 19px;
	height: 19px;
	border-radius: 50%;
	font-family: sans-serif;
}
/*以下是划过之后的粉色圆圈效果*/
div.page-subtitle > li.active ::before{
	z-index:2;
	content:'';
	opacity: 0%;
	background: linear-gradient(to left, #ff96ab 0%, #ff969d 50%, #ffa3a6 100%);
	box-shadow: 0px 0px 5px #ffb2c5;
	position:absolute;
	transform:translateX(-168%) translateY(-40%);
	margin: 10px!important;
	width: 27px;
	height: 27px;
	border-radius: 50%;
	animation: side-nav-circle-ani 2s ease-in-out 0.3s 1 forwards;
}
div.page-secondary-title > li.active ::before {
	z-index:2;
	content:'';
	opacity: 0;
	background: #f3aabc;
	position:absolute;
	transform:translateX(-218%) translateY(-53%);
	box-shadow: 0px 0px 5px #ffb2c3;
	margin: 10px;
	width: 19px;
	height: 19px;
	border-radius: 50%;
	animation: side-nav-circle-ani 0.3s ease-in 0.3s 1 forwards;
}
@keyframes side-nav-circle-ani {
	0% {
		opacity: 50%;
	}

	100% {
		opacity:100%;
	}
}
div.page-subtitle > li.active a {
	animation: font-turn-purple 1.5s ease-in 0.3s 1 forwards;
}
div.page-secondary-title > li.active a {
	animation: font-turn-pink 0.5s ease-in 0.3s 1 forwards;
}

@keyframes font-turn-pink {
	from {color: #ffd15ccf;}
	to {color: #ffa3b1;text-shadow: 0px 0px 2px #f290a0ee;}
}
 
@keyframes font-turn-purple {
	from {color: #fcc888;}
	to {color: #ffb596;text-shadow: 0px 0px 2px #fba9bbf3;}
}
/*电梯导航栏结束*/
section#design-nav-container {
	display:flex;
	flex-wrap: wrap;
	justify-content:center;
}
section#design-nav-container a {
	text-decoration:none;
}
section#design-nav-container div:hover {
	transform:translateY(-20px);
}
section#design-nav-container div {
	width: 350PX;
	margin:20px 20px;
	background:#ffbcbc;
	border-radius: 50PX;
	padding:20px;
	transition:1s;
	box-shadow:  0px 0px 5px #ffb2cc;
}
section#design-nav-container div h3 {
	padding:0;
	font-size: 1.2rem;
}
section#design-nav-container div p {
	font-size: 0.9rem;
	line-height:1.2rem;
	word-wrap: break-word;
	word-break:normal;
	hyphens:auto;

}
.fig{
	font-size: larger;
	font-family:Georgia, 'Times New Roman', Times, serif;
	font-weight:bold;
	color: #bf9946;
	padding-top: 5px;
}
/*不同屏幕宽度的适应*/
@media screen and (max-width: 1000px) {
	.side-nav {display: none;}
	footer > section.footer-nav {display: none;}
	footer > section.acknowledgements {display: none;}
	footer > section.contact-us {display: none;}
	footer > section.copyright {display: none;}
	.navbar {height:fit-content}
	button.navbar-toggler {position:absolute; right:10px;top:10px;color:#ffa3ab}
	}
	@media screen and (max-width: 1080px) {
		li.nav-item {font-size: 0.85rem;}
	}
	/*team*/


		.quote{color:#633a08;
			font-size: 16px;
			font-family: 'Montserrat';
			font-weight: 500 !important;
			text-align:justify;
			margin-top: 10px;
			width: 300px;
			height:fit-content;
			border-radius:20px;
			box-shadow:0 0 10px #e98c5e80;
			padding: 4px;
			background-color: #f7e1d9;
			}
		div.col-lg-91 {
			margin-left: 100pX;
			display: flex;
			flex-wrap: wrap;
			flex-direction: row;
			width: fit-content;
			padding-left: 70px;
			margin-top: -50px;
		}
	h3.text-55 {
        font-family: "ButterSans-Rounded";
        padding:10vw;
        font-size: 7vw;
        color:#ffa3a8;
        text-shadow:0 0 2px #FFA3D7;
        text-align: center;
		margin-left: 200px;
		margin-top: -250px;
        position: absolute;
}

h3.text-551 {
	font-family: "ButterSans-Rounded";
	padding:10vw;
	font-size: 7vw;
	color:#ffa3a8;
	text-shadow:0 0 2px #FFA3D7;
	text-align: center;
	margin-left: 200px;
	margin-top: -250px;
	position: absolute;
	animation:team1 1s linear ;
	animation-timeline: scroll();
}

h3.text-552 {
	font-family: "ButterSans-Rounded";
	padding:10vw;
	font-size: 7vw;
	color:#ffa3a8;
	text-shadow:0 0 2px #FFA3D7;
	text-align: center;
	margin-left: 200px;
	margin-top: -250px;
	animation:team2 1s linear ;
	animation-timeline: scroll();
}
h3.text-553 {
	font-family: "ButterSans-Rounded";
	padding:10vw;
	font-size: 7vw;
	color:#ffa3a8;
	text-shadow:0 0 2px #FFA3D7;
	text-align: center;
	margin-left: 200px;
	margin-top: -250px;
	animation:team3 1s linear ;
	animation-timeline: scroll();
}
@keyframes team1{
	0%{scale:0.5 ;}
	10%{scale:1;}}
@keyframes team2{
		60%{scale:0.5 ;}
		75%{scale:1;}}
		@keyframes team3{
			80%{scale:0.5 ;}
			95%{scale:1;}}
.f1{width: 300px;
	margin-left: 30px;
	margin-top: 50px;
	display: inline-block;
padding-top: 0%!important;}
.f2{width: 300px;
		margin-left: 50px;
		margin-top: 50px;
		display: inline-block;
	padding-top: 0%!important;}
.f3{width: 300px;
			margin-left: 50px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;}	

		.f22{width: 450px;
			margin-left: 70px;
			margin-top: 20px;
			display: inline-block;
		padding-top: 0%!important;}	

		.f23{width: 450px;
			margin-left: 20px;
			margin-top: 20px;
			display: inline-block;
		padding-top: 0%!important;}
	.floata1 {
		
		background-image:url("https://static.igem.wiki/teams/5048/zycc.png");
		background-size: 100%;
		box-shadow:0 0 10px #eb9d0e80;
		width: 300px;
		height: 180px;
		border-radius:20px;
	}

	.floata2 {
		background-image:url("https://static.igem.wiki/teams/5048/zayy.png");
		background-size: 100%;
		box-shadow:0 0 10px #eb9d0e80;
		width: 300px;
		height: 180px;
		border-radius:20px;
	}
	.floata3 {
		background-image:url("https://static.igem.wiki/teams/5048/cytt.png");
		background-size: 100%;
		box-shadow:0 0 10px #eb9d0e80;
		width: 300px;
		height: 180px;
		border-radius:20px;
	}
	.floata4 {
		
		background-image:url("https://static.igem.wiki/teams/5048/lyhh.png");
		background-size: 100%;
		box-shadow:0 0 10px #eb9d0e80;
		width: 300px;
		height: 180px;
		border-radius:20px;
	}

	.floata5 {
		background-image:url("https://static.igem.wiki/teams/5048/lsq-gai.webp");
		background-size: 100%;
		box-shadow:0 0 10px #eb9d0e80;
		width: 300px;
		height: 180px;
		border-radius:20px;
		
	}
	.floata6 {
		background-image:url("https://static.igem.wiki/teams/5048/pzyy.png");
		background-size: 100%;
		box-shadow:0 0 10px #eb9d0e80;
		width: 300px;
		height: 180px;
		border-radius:20px;
	}
	.floata7 {
		
		background-image:url("https://static.igem.wiki/teams/5048/wyz-gai.webp");
		background-size: 100%;
		box-shadow:0 0 10px #eb9d0e80;
		width: 300px;
		height: 180px;
		border-radius:20px;
	}

	.floata8 {
		background-image:url("https://static.igem.wiki/teams/5048/zcyy.png");
		background-size: 100%;
		box-shadow:0 0 10px #eb9d0e80;
		width: 300px;
		height: 180px;
		border-radius:20px;
		
	}
	.floata9 {
		background-image:url("https://static.igem.wiki/teams/5048/ckll.png");
		background-size: 100%;
		box-shadow:0 0 10px #eb9d0e80;
		width: 300px;
		height: 180px;
		border-radius:20px;
	}
	.floata10 {
		
		background-image:url("https://static.igem.wiki/teams/5048/hyh-gai.webp");
		background-size: 100%;
		box-shadow:0 0 10px #eb9d0e80;
		width: 300px;
		height: 180px;
		border-radius:20px;
	}

	.floata11 {
		background-image:url("https://static.igem.wiki/teams/5048/mzhh.png");
		background-size: 100%;
		box-shadow:0 0 10px #eb9d0e80;
		width: 300px;
		height: 180px;
		border-radius:20px;
		
	}
	.floata12 {
		background-image:url("https://static.igem.wiki/teams/5048/hw-gai.webp");
		background-size: 100%;
		box-shadow:0 0 10px #eb9d0e80;
		width: 300px;
		height: 180px;
		border-radius:20px;
	}
	.floata13 {
		
		background-image:url("https://static.igem.wiki/teams/5048/zzyy.png");
		background-size: 100%;
		box-shadow:0 0 10px #eb9d0e80;
		width: 300px;
		height: 180px;
		border-radius:20px;
	}

	.floata14 {
		background-image:url("https://static.igem.wiki/teams/5048/hnqq.png");
		background-size: 100%;
		box-shadow:0 0 10px #eb9d0e80;
		width: 300px;
		height: 180px;
		border-radius:20px;
		
	}
	.floata15 {
		background-image:url("https://static.igem.wiki/teams/5048/pxx.png");
		background-size: 100%;
		box-shadow:0 0 10px #eb9d0e80;
		width: 300px;
		height: 180px;
		border-radius:20px;
	}
	.floata16 {
		
		background-image:url("https://static.igem.wiki/teams/5048/lxyy.png");
		background-size: 100%;
		box-shadow:0 0 10px #eb9d0e80;
		width: 300px;
		height: 180px;
		border-radius:20px;
	}

	.floata17 {
		background-image:url("https://static.igem.wiki/teams/5048/njyy.png");
		background-size: 100%;
		box-shadow:0 0 10px #eb9d0e80;
		width: 300px;
		height: 180px;
		border-radius:20px;
		
	}
	.floata18 {
		background-image:url("https://static.igem.wiki/teams/5048/xxyy.png");
		background-size: 100%;
		box-shadow:0 0 10px #eb9d0e80;
		width: 300px;
		height: 180px;
		border-radius:20px;
	}
	
	.floataa1 {
		background-image:url("https://static.igem.wiki/teams/5048/advisorr1.png");
		background-size: 100%;
		box-shadow:0 0 10px #7bd8e280;
		width: 400px;
		height: 240px;
		border-radius:20px;
	}
	.floataa2 {
		background-image:url("https://static.igem.wiki/teams/5048/advisorr2.png");
		background-size: 100%;
		box-shadow:0 0 10px #7bd8e280;
		width: 400px;
		height: 240px;
		border-radius:20px;
	}
	.floataa3 {
		background-image:url("https://static.igem.wiki/teams/5048/advisorr3.png");
		background-size: 100%;
		box-shadow:0 0 10px #7bd8e280;
		width: 400px;
		height: 240px;
		border-radius:20px;
	}
	.floataa4 {
		background-image:url("https://static.igem.wiki/teams/5048/advisorr4.png");
		background-size: 100%;
		box-shadow:0 0 10px #7bd8e280;
		width: 400px;
		height: 240px;
		border-radius:20px;
	}
	.floataa5 {
		background-image:url("https://static.igem.wiki/teams/5048/advisor41.png");
		background-size: 100%;
		box-shadow:0 0 10px #bf0eeb80;
		width: 400px;
		height: 240px;
		border-radius:20px;
	}
	.floataa6 {
		background-image:url("https://static.igem.wiki/teams/5048/advisor71.png");
		background-size: 100%;
		box-shadow:0 0 10px #bf0eeb80;
		width: 400px;
		height: 240px;
		border-radius:20px;
	}
	.dhz
	{margin-top: 50px;
	margin-left: 120px;
	width: 800px;}
	.float:hover{
		font-size:40px;
		font-family: "ButterSans-Rounded";
		line-height:30px;
		background-image:linear-gradient(#f3d39880,#dfa53b80,#f0667680);
		box-shadow: 0px 0px 5px #f5c77180;
		width: 180px;
		height: 100px;
		overflow-wrap: break-word;
		word-wrap: break-word;
		word-break: normal;
		hyphens: auto;
		padding:10px 20px 10px 30px;
		margin-left: 60px;
		border-radius:50px;
		display: inline-block;
		animation: float-up 1s ease;}
		.boo {
			font-size:20px;
			font-family: "ButterSans-Rounded";
			text-align: center;
			color:#733a08;
			line-height:30px;
			background-image:linear-gradient(#f3d39880,#dfa53b80,#f0667680);
			box-shadow: 0px 0px 5px #f5c77180;
			width: 200px;
			overflow-wrap: break-word;
			word-wrap: break-word;
			word-break: normal;
			hyphens: auto;
			padding:10px 20px 10px 20px;
			margin-left: 30px;
			border-radius:50px;
			display: inline-block;
		}
		.figuuu1{
			margin-left: 30px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-image:url("https://static.igem.wiki/teams/5048/collaboration-experience-exchange-and-project-sharing-hubu-china-01.webp");
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 380px;
		height: 250px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;}
		.figuuu2{
			margin-left: 30px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-image:url("https://static.igem.wiki/teams/5048/collaboration-experience-exchange-and-project-sharing-hubu-china-02.webp");
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 380px;
		height: 250px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;}
		.figuuu3{
			margin-left: 30px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-image:url("https://static.igem.wiki/teams/5048/collaboration-experience-exchange-and-project-sharing-hubu-china-03.webp");
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 380px;
		height: 250px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;}

		.figuuu4{
			margin-left: 30px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-image:url("https://static.igem.wiki/teams/5048/collaboration-experience-exchange-and-project-sharing-hubu-china-04.webp");
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 380px;
		height: 250px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;}
		.figuuu5{
			margin-left: 30px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-image:url("https://static.igem.wiki/teams/5048/collaboration-experience-exchange-and-project-sharing-jlu-nbbms-01.webp");
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 380px;
		height: 200px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;}
		.figuuu6{
			margin-left: 30px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-image:url("https://static.igem.wiki/teams/5048/collaboration-experience-exchange-and-project-sharing-jlu-nbbms-02.webp");
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 380px;
		height: 200px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;}
		.figuuu7{
			margin-left: 30px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-image:url("https://static.igem.wiki/teams/5048/collaboration-experience-exchange-and-project-sharing-jlu-nbbms-03.webp");
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 380px;
		height: 200px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;}
		.figuuu8{
			margin-left: 30px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-image:url("https://static.igem.wiki/teams/5048/collaboration-experience-exchange-and-project-sharing-jlu-nbbms-04.webp");
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 380px;
		height: 200px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;}

		.figuuu9{
			margin-left: 200px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-image:url("https://static.igem.wiki/teams/5048/collaboration-experience-exchange-and-project-sharing-jlu-nbbms-05.webp");
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 380px;
		height: 200px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;}
		.figuuu10{
			margin-left: 30px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-image:url("https://static.igem.wiki/teams/5048/collaboration-experience-exchange-and-project-sharing-hubei-syn-01.webp");
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 380px;
		height: 250px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;}
		.figuuu11{
			margin-left: 30px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-image:url("https://static.igem.wiki/teams/5048/collaboration-experience-exchange-and-project-sharing-hubei-syn-02.webp");
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 380px;
		height: 250px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;}
		.figuuu12{
			margin-left: 30px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-image:url("https://static.igem.wiki/teams/5048/collaboration-experience-exchange-and-project-sharing-ccic-01.webp");
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 380px;
		height: 200px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;}
		.figuuu13{width: 380px;
			height: 200px;
			margin-left: 30px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-image:url("https://static.igem.wiki/teams/5048/collaboration-experience-exchange-and-project-sharing-ccic-02.webp");
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;}
		.figuuu14{
			margin-left: 30px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-image:url("https://static.igem.wiki/teams/5048/coll-fig.png");
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;width: 380px;
		height: 250px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;}
		.figuuu15{
			margin-left: 30px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-image:url("https://static.igem.wiki/teams/5048/collaboration-experience-exchange-and-project-sharing-ccic-04.webp");
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 380px;
		height: 250px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;}
		.figuuu16{
			margin-left: 180px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-image:url("https://static.igem.wiki/teams/5048/collaboration-experience-exchange-and-project-sharing-nycu-01.webp");
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 380px;
		height: 250px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;}
		.figuuu17{width: 380px;
			height: 250px;
			margin-left: 30px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-image:url("https://static.igem.wiki/teams/5048/collaboration-experience-exchange-and-project-sharing-huazhong-01.webp");
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;

		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;}
		
		.figuuu18{
			margin-left: 30px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-image:url("https://static.igem.wiki/teams/5048/collaboration-experience-exchange-and-project-sharing-huazhong-02.webp");
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 380px;
		height: 250px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;}
		.figuuu19{
			margin-left: 30px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-image:url("https://static.igem.wiki/teams/5048/collaboration-experience-exchange-and-project-sharing-huazhong-03.webp");
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 380px;
		height: 250px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;}
		
		.figuuu20{
			margin-left: 30px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-image:url("https://static.igem.wiki/teams/5048/collaboration-experience-exchange-and-project-sharing-huazhong-04.webp");
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 380px;
		height: 250px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;}
		.figuuu21{
			margin-left: 30px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-image:url("https://static.igem.wiki/teams/5048/collaboration-monopoly-01.webp");
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 380px;
		height: 250px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;}
		.figuuu22{
			margin-left: 30px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-image:url("https://static.igem.wiki/teams/5048/collaboration-monopoly-02.webp");
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 380px;
		height: 250px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;}
		.figuuu23{
			margin-left: 30px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-image:url("https://static.igem.wiki/teams/5048/collaboration-presentation-of-project-01.webp");
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 380px;
		height: 250px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;}
		.figuuu24{
			margin-left: 30px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-image:url("https://static.igem.wiki/teams/5048/collaboration-presentation-of-project-02.webp");
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 380px;
		height: 250px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;}
		.figuuu25{
			margin-left: 30px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-image:url("https://static.igem.wiki/teams/5048/coll-fig25.png");
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 380px;
		height: 200px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;}
		.figuuu26{
			margin-left: 30px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-image:url("https://static.igem.wiki/teams/5048/collaboration-syhthetic-biology-course-02.webp");
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		border-radius:20px;
		width: 380px;
		height: 200px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;}
		.figuuu27{
			margin-left: 230px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-image:url("https://static.igem.wiki/teams/5048/collaboration-syhthetic-biology-course-01.webp");
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 400px;
		height: 600px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;}
		.figuuu28{
			position: relative;
			left: 30%;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-image:url("https://static.igem.wiki/teams/5048/qrwechat.png");
		width: 300px;
		height: 300px;
		}
		.figuuu29{
			position: relative;
			margin-top: 50px;
			margin-left: 3%;
			display: inline-block;
		padding-top: 0%!important;
		background-image:url("https://static.igem.wiki/teams/5048/qr-instagram.webp");
		width: 300px;
		height: 300px;
		}

		.figuuu30{
			margin-left: 200px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-image:url("https://static.igem.wiki/teams/5048/enwp1.png");
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 300px;
		height: 400px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;}

		.figuuu31{
			margin-left: 60px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-image:url("https://static.igem.wiki/teams/5048/enwp2.png");
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 300px;
		height: 400px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;}
		.figuuuu1{
			margin-left: 60px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 360px;
		height: 250px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;
		background-image:url("https://static.igem.wiki/teams/5048/edu01.webp");
		}
		.figuuuu2{
			margin-left: 60px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 360px;
		height: 250px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;
		background-image:url("https://static.igem.wiki/teams/5048/edu02.webp");
		}
		.figuuuu3{
			margin-left: 200px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 400px;
		height: 200px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;
		background-image:url("https://static.igem.wiki/teams/5048/edu03.webp");
		}
		.figuuuu4{
			margin-left: 60px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 360px;
		height: 250px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;
		background-image:url("https://static.igem.wiki/teams/5048/edu04.webp");
		}
		.figuuuu5{
			margin-left: 60px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 360px;
		height: 250px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;
		background-image:url("https://static.igem.wiki/teams/5048/edu05.webp");
		}
		.figuuuu6{
			margin-left: 60px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 360px;
		height: 250px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;
		background-image:url("https://static.igem.wiki/teams/5048/edu06.webp");
		}
		.figuuuu7{
			margin-left: 60px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 360px;
		height: 250px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;
		background-image:url("https://static.igem.wiki/teams/5048/edu07.webp");
		}
		.figuuuu8{
			margin-left: 260px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 300px;
		height: 400px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;
		background-image:url("https://static.igem.wiki/teams/5048/edu18.webp");
		}
		.figuuuu9{
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 350px;
		height: 400px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;
		background-image:url("https://static.igem.wiki/teams/5048/edu-merch-1.webp");
		}
		.figuuuu10{
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 380px;
		height: 280px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;
		background-image:url("https://static.igem.wiki/teams/5048/edu-merch-2.webp");
		}
		.figuuuu11{
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 400px;
		height: 530px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;
		background-image:url("https://static.igem.wiki/teams/5048/edu-merch-3.webp");
		}
		.figuuuu12{
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 380px;
		height: 300px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;
		background-image:url("https://static.igem.wiki/teams/5048/edu-merch-4.webp");
		}	.figuuuu13{
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 350px;
		height: 250px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;
		background-image:url("https://static.igem.wiki/teams/5048/edu08.webp");
		}
		.figuuuu14{
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 380px;
		height: 250px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;
		background-image:url("https://static.igem.wiki/teams/5048/edu09.webp");
		}
		.figuuuu15{
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 400px;
		height: 280px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;
		background-image:url("https://static.igem.wiki/teams/5048/edu10.webp");
		}
		.figuuuu16{
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 380px;
		height: 250px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;
		background-image:url("https://static.igem.wiki/teams/5048/edu11.webp");
		}	.figuuuu17{
			margin-left: 60px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 340px;
		height: 200px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;
		background-image:url("https://static.igem.wiki/teams/5048/edu12.webp");
		}
		.figuuuu18{
			margin-left: 60px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 340px;
		height: 200px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;
		background-image:url("https://static.igem.wiki/teams/5048/edu13.webp");
		}
		.figuuuu19{
			margin-left: 260px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 320px;
		height: 400px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;
		background-image:url("https://static.igem.wiki/teams/5048/edu14.webp");
		}
		
		.figuuuu20{
			margin-left: 60px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 350px;
		height: 250px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;
		background-image:url("https://static.igem.wiki/teams/5048/edu15.webp");
		}
		.figuuuu21{
			margin-left: 60px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 350px;
		height: 250px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;
		background-image:url("https://static.igem.wiki/teams/5048/edu16.webp");
		}
		.figuuuu22{
			margin-left: 200px;
			margin-top: 50px;
			display: inline-block;
		padding-top: 0%!important;
		background-size: 100%;
		box-shadow:0 0 10px #eb0ec380;
		width: 400px;
		height: 180px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;
		background-image:url("https://static.igem.wiki/teams/5048/edu17.jpg");
		}
		.floataaward {
			background-image:url("https://static.igem.wiki/teams/5048/medal.svg");
			background-size: 100%;
			box-shadow:0 0 10px #eb9d0e80;
			width: 300px;
			height: 300px;
			border-radius:20px;
		}
		.videoo{
		margin-left: 200px;
		width: 570px;
		height: 325px;
		border-radius:20px;
	    border-style: dashed solid;
		border-width:thick;
        border-color: #8e5e95;
		}

		.vieww{
			margin-left: 10px;
			animation: uup 1.5s ease-in-out infinite;
			display: inline-block;
		}
		
		@keyframes uup
		{from{transform:translateY(0);}
		to{transform:translateY(5px);}}
		
		div.view-more-horizontal-button:hover img.vieww {
			animation: mo 0.5s linear;
		}
		div.view-more-horizontal-button:hover img.qrcode {
			display: inline-block;
		}
		div.wechat-sub:hover img.qrcode{
			display: inline-block;
		}