body {
  background-color: #FBEEC9;
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

.content {
  flex: 1;
}

/* img {
float: right;
} */
.noNewlineText {
  white-space: nowrap;
  /* 禁止换行 */
}

a.small {
  line-height: 0.8;
}

h1.bolder {
  font-weight: 900;
  /* Bolder */
}

.navbar {
  position: fixed !important;
}

.centered-text {
  text-align: center;
}

.centered-hr {
  height: 1px;
  background-color: black;
  width: 35%;
  margin: 0 auto;
}

.nav-pills .nav-link {
  width: 2px;
  padding: 5px;
  border-radius: 0px;
}

.nav-pills>.nav-link {
  color: #fff !important;
  background: #Fff !important;
}

.nav-pills .nav-link.active,
.nav-pills .show>.nav-link {
  color: #85540A !important;
  background: #F0A22E !important;
}

/* .banner {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
  z-index: 1;
}

@media (max-width:800px) {
  .banner-area {
    min-height: 600px;
  }

  .banner-area h1 {
    font-size: 27px;
  }

  .banner-area h3 {
    font-size: 20px;
  }

  .banner-area a.banner-btn {
    padding: 8px 20px;
  }
} */

.wrapper h1 {
	text-align: center;
	text-transform: uppercase;
	margin: 70px 0 0;
	color: #fff;
	font-family: 'Bebas Neue', sans-serif;
	font-size: 80px;
}
.wrapper h2 {
	text-align: left;
	color: black;
	font-weight: 300;
	font-size: 20px;
}
.wrapper {
	width: 800px;
	margin: 0 auto;
}
.line {
	height: 35px;
	max-width: 800px;
	margin: 0 auto 10px auto;
	line-height: 35px;
	font-size: 15px;
	color: white;
	padding: 0 0 0 10px;
	position: relative;
	background: #262626;
	border-radius: 50px;
	z-index: -2;
	font-weight: 900;
	box-shadow: 0 2px 20px rgba(0,0,0,0.5);
}
.line::before {
	content: '';
	width: 100%;
	position: absolute;
	left: 0;
	height: 25px;
	top: 0;
	z-index: -2;
}
.line::after {
	content: '';
	background: linear-gradient(45deg, #ee0979, #ff6a00);
	height: 35px;
	transition: 0.7s;
	display: block;
	width: 100%;
	animation: animate 1 4s;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	border-radius: 0px;
}
.line1::after {
	max-width: 270%;
}
.line2::after {
	max-width: 268%;
}
.line3::after {
	max-width: 271%;
}
.line4::after {
	max-width: 274%;
}
.line5::after {
	max-width: 273%;
}
.line6::after {
	max-width: 275%;
}
.line7::after {
	max-width: 278%;
}
.line8::after {
	max-width: 280%;
}
.line9::after {
	max-width: 284%;
}
.line10::after {
	max-width: 289%;
}
.line11::after {
	max-width: 282%;
}
@keyframes animate {
	0% {
		width: 0;
	}
	100% {
		width: 100%;
	}
}
