.review li .details {
	width: 100%
}

.review li h4 {
	font-size: 1.15rem;
}

#blog_section {
	font-family: MicrosoftYaHei;
	font-size: 1.1rem;
	line-height: 1.3rem;
}

.blog_avatar {
	border: 2px solid white;
}

.blog_1b_content,
.blog_1v_content,
.blog_2a_content,
.blog_2b_content,
.blog_2c_content,
.blog_2d_content,
.blog_2e_content,
.blog_3a_content,
.blog_3d_content,
.blog_3b_content,
.blog_3c_content,
.blog_4a_content,
.blog_4b_content,
.blog_4c_content {
	padding: 2.5rem 1rem 1rem;
	background: white;
	max-width: calc(100% - 2rem);
}

.blog_1b, .blog_1v, .blog_2b, .blog_2c, .blog_2d, .blog_2e, .blog_3a, .blog_3d, .blog_3b, .blog_3c, .blog_4a, .blog_4b, .blog_4c {
	margin-top: 2.5rem;
	position: relative;
	overflow: visible;
	display: inline-block;
	width: calc(100% - 15px);
}

.blog_1b_header,
.blog_1v_header,
.blog_2b_header,
.blog_2c_header,
.blog_2d_header,
.blog_2e_header,
.blog_3a_header,
.blog_3d_header,
.blog_3b_header,
.blog_3c_header,
.blog_4a_header,
.blog_4b_header,
.blog_4c_header {
	position: absolute;
	top: -3rem;
	padding-top: 35px;
	padding-left: 34px;
}

.zh .blog_1b_header h5,
.zh .blog_1v_header h5,
.zh .blog_2b_header h5,
.zh .blog_2c_header h5,
.zh .blog_2d_header h5,
.zh .blog_2e_header h5,
.zh .blog_3a_header h5,
.zh .blog_3d_header h5,
.zh .blog_3b_header h5,
.zh .blog_3c_header h5,
.zh .blog_4a_header h5,
.zh .blog_4b_header h5,
.zh .blog_4c_header h5 {
	letter-spacing: 3.73px;
	font-size: 25px;
}

.blog_1b_header h5,
.blog_1v_header h5,
.blog_2b_header h5,
.blog_2c_header h5,
.blog_2d_header h5,
.blog_2e_header h5,
.blog_3a_header h5,
.blog_3d_header h5,
.blog_3b_header h5,
.blog_3c_header h5,
.blog_4a_header h5,
.blog_4b_header h5,
.blog_4c_header h5 {
	font-size: 22px;
	font-weight: normal;
	color: white;
	line-height: 38px;
	text-align: left;
}

.texttable {
	white-space: preserve-breaks;
	line-height: 1.1rem;
}

.field-heading {
	height: auto;
	line-height: 1.8rem;
	position: absolute;
}

.field-content {
	min-width: 50px;
	margin-left: 50px;
	line-height: 1.8rem;
}

.blog_item {
	padding: 0.5rem;
	flex: 1;
}

#salearea .blog_item .blogitem,
#salearea .blog_item p {
	max-width: 100%;
	width: 100%
}

#blog_1 {
	position: relative;
	overflow: visible
}

.blog_1a {
	padding: 2rem 0.5rem 1rem 1rem;
}

.blog_1a .topright {
	background: #ff597b;
	color: white;
	padding: 0.75rem 1.5rem;
	border-bottom-left-radius: 1.5rem;
	text-align: center;
	position: relative;
	right: -0.5rem;
	top: -2rem;
	float: right;
}

.field-content.cl {
	margin-left: 0;
}

.blog_1a .row {
	margin-right: 10px;
	border: 1px solid #EB768E;
	padding-bottom: 0;
	margin-bottom: 10px;
}

.blog_1a .col-4,
.blog_1a .col-3,
.blog_1a .col-6,
.blog_1a .col-auto,
.blog_1a .col {
	padding: 12px 15px;
	border: 1px solid #EB768E;
	line-height: 0;
}

.blog_1a .col-4 {
	max-width: calc(33.333333% - 32px);
	flex: 0 0 33.333333%;
}

.blog_1a .col-6 {
	max-width: calc(50% - 32px);
	flex: 0 0 50%;
}

.blog_1a .col-4 .field-heading,
.blog_1a .col-6 .field-heading,
.blog_1a .col-auto .field-heading,
.blog_1a .col .field-heading {
	color: #73315C
}

.blog_1a .col-4 .field-content,
.blog_1a .col-6 .field-content,
.blog_1a .col-auto .field-content,
.blog_1a .col .field-content {
	color: brown
}

.blog_1b_header {
	background: url(Video-button.png) 0 0 no-repeat;
	width: 240px;
	height: 66px
}

.blog_1b_header i {
	background: url(Video-button2.png) 0 0 no-repeat;
	width: 24px;
	height: 24px;
	left: 172px;
	top: 39px;
	position: absolute
}

.blog_1b_content {
	background: #F4D8BD;
	border: 2px solid white;
	border-radius: 1.5rem;
	padding-top: 2.5rem
}

.blog_1v_header {
	background: url(Audio-button.png) 0 0 no-repeat;
	width: 240px;
	height: 66px
}

.blog_1v_header i {
	background: url(voice.png) 0 0 no-repeat;
	width: 24px;
	height: 24px;
	left: 172px;
	top: 42px;
	position: absolute
}

.blog_1v_content {
	background: #E8BDF4;
	border: 2px solid white;
	border-radius: 1.5rem;
	padding-top: 2.5rem
}

.blog_2a {
	margin: 0 7px 15px 5px;
	display: flex
}

.blog_2a_header {
	text-align: center
}

.blog_2a_header h5 {
	font-size: 1.1rem;
	color: white;
	background: #C71D8E;
}

.blog_2a_content {
	font-size: 1rem;
	border-top-right-radius: 1.5rem;
	border-bottom-right-radius: 1.5rem;
	border: 1px solid #EB768E;
	flex-grow: 1;
	padding-top: 1rem;
}

.blog_2a_content .field-heading {
	float: none;
	text-align: left
}

.blog_2a_content .field-content {
	margin-left: 4rem;
	font-size: 0.95rem;
	line-height: 1.41rem;
	padding-top: 1.61rem;
}

.blog_2b_header {
	left: 1.5vw;
	background: url(Others-button.png) 0 0 no-repeat;
	width: 184px;
	height: 66px
}

.blog_2b_header i {
	background: url(Others-button2.png) 0 0 no-repeat;
	width: 28px;
	height: 7px;
	left: 114px;
	top: 48.77px;
	position: absolute
}

.blog_2b_content {
	border: 2px solid #2E3192;
	border-top-left-radius: 1.5rem;
	border-bottom-left-radius: 1.5rem;
}

.blog_2b_content .field-content {
	margin-left: 4rem;
	font-size: 0.95rem;
	line-height: 1.41rem;
	padding-top: 0.161rem;
}

.blog_2c_header {
	left: 1.5vw;
	background: url(MyDetails-button.png) 0 0 no-repeat;
	width: 240px;
	height: 66px
}

.blog_2c_header i {
	background: url(MyDetails-button2.png) 0 0 no-repeat;
	width: 21px;
	height: 13.57px;
	left: 173px;
	top: 45.21px;
	position: absolute
}

.blog_2c_content {
	border: 2px solid #FB5427;
	border-top-left-radius: 1.5rem;
	border-bottom-left-radius: 1.5rem;
	letter-spacing: 0.5vw;
	line-height: normal;
}

.blog_2c_content img {
	width: auto;
	max-width: min(100% - 1rem, 480px);
	max-height: calc(100vh - 3rem);
	position: relative;
}

.blog_2d_header {
	left: 1.5vw;
	background: url(BlogReport-button.png) 0 0 no-repeat;
	filter: hue-rotate(-141deg);
	width: 240px;
	height: 66px
}

.blog_2d_header i {
	background: url(BlogReport-button2.png) 0 0 no-repeat;
	width: 22.56px;
	height: 18.96px;
	left: 173px;
	top: 43.08px;
	position: absolute
}

.blog_2d_content {
	border: 2px solid #62619d;
	border-top-left-radius: 1.5rem;
	border-bottom-left-radius: 1.5rem;
	display: flex;
	flex-wrap: wrap;
}

.blog_2e_header {
	left: 1.5vw;
	background: url(BlogReport-button.png) 0 0 no-repeat;
	filter: hue-rotate(-141deg);
	width: 240px;
	height: 66px
}

.blog_2e_header i {
	background: url(BlogReport-button2.png) 0 0 no-repeat;
	width: 22.56px;
	height: 18.96px;
	left: 173px;
	top: 43.08px;
	position: absolute
}

.blog_2e_content {
	border: 2px solid #62619d;
	border-top-left-radius: 1.5rem;
	border-bottom-left-radius: 1.5rem;
	display: flex;
	flex-wrap: wrap;
}

.blog_3a_header {
	left: calc(18px + 1.5vw);
	padding-left: 21.2px;
	background: url(MyPhotos-button.png) 0 0 no-repeat;
	width: 280px;
	height: 66px
}

.blog_3a_header i {
	background: url(MyPhotos-button2.png) 0 0 no-repeat;
	width: 21px;
	height: 18px;
	left: 213.84px;
	top: 42.72px;
	position: absolute
}

.blog_3a_content {
	border: 2px solid #4F2D6D;
	border-top-left-radius: 1.5rem;
	border-bottom-left-radius: 1.5rem;
}

.blog_3a_content span {
	flex-basis: 16%;
	position:relative;
	display:inline-block;
	overflow:visible
}

.blog_3a_content span img{
	max-height: 180px;
	max-width: fit-content;
}
.blog_3a_content span small{
	position:absolute;
	bottom:3px;
	left:0.6rem;
	font-size:0.7em
}

.blog_3d {
	filter: hue-rotate(-45deg);
}

.blog_3d_header {
	left: calc(18px + 1.5vw);
	padding-left: 21.2px;
	background: url(MyPhotos-button.png) 0 0 no-repeat;
	width: 280px;
	height: 66px
}

.blog_3d_header i {
	background: url(MyPhotos-button2.png) 0 0 no-repeat;
	width: 21px;
	height: 18px;
	left: 213.84px;
	top: 42.72px;
	position: absolute;
	letter-spacing: 1.73px;
}

.blog_3d_content {
	border: 2px solid #4F2D6D;
	border-top-left-radius: 1.5rem;
	border-bottom-left-radius: 1.5rem;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-evenly;
}

.blog_3d_content span {
	flex-basis: 20%;
}

.blog_3b_header {
	left: calc(18px + 1.5vw);
	padding-left: 21.2px;
	background: url(MyBlogPhoto-button.png) 0 0 no-repeat;
	width: 280px;
	height: 80px;
	z-index: 99;
}

.blog_3b_header i {
	background: url(MyBlogPhoto-button2.png) 0 0 no-repeat;
	width: 21px;
	height: 18px;
	left: 213.84px;
	top: 42.72px;
	position: absolute;
}

.blog_3b_content {
	border: 2px solid #39774A;
	border-top-left-radius: 1.5rem;
	border-bottom-left-radius: 1.5rem;
	width: calc(100% - 2rem - 4px);
	overflow: hidden;
	position: relative;
	padding-bottom: 0;
}

.blog_3b_content .bx-viewport li {
	width: auto !important;
}

.blog_3b_content {
	padding-top: 3rem
}

#girlpage .bx-wrapper .bx-pager {
	float: none;
	text-align: center;
}

#girlpage .bx-wrapper .bx-viewport {
	margin: auto;
	max-width: calc(100% - 4rem);
}

#girlpage .bx-wrapper .bx-prev {
	left: 0;
}

#girlpage .bx-wrapper .bx-next {
	right: 0;
}

.blog_3c_header {
	left: 1.5vw;
	background: url(Cart-button.png) 0 0 no-repeat;
	width: 215.04px;
	height: 66px
}

.blog_3c_header i {
	background: url(Cart-button2.gif) 0 0 no-repeat;
	width: 24px;
	height: 24px;
	left: 146.37px;
	top: 40.55px;
	position: absolute
}

.blog_3c_content {
	border: 2px solid #E02F48;
	border-top-left-radius: 1.5rem;
	border-bottom-left-radius: 1.5rem;
}

.blog_4a_header {
	left: 1.5vw;
	background: url(Blog-button.png) 0 0 no-repeat;
	width: 240px;
	height: 66px
}

.blog_4a_header i {
	background: url(Blog-button2.png) 0 0 no-repeat;
	width: 20px;
	height: 20px;
	left: 173.31px;
	top: 42.37px;
	position: absolute
}

.blog_4a_content {
	border: 2px solid #1C75BC;
	border-top-left-radius: 1.5rem;
	border-bottom-left-radius: 1.5rem;
}

.blog_4a_content .details {
	border: 1px solid gray;
	background: #ffe5e9;
	border-radius: .5rem;
	margin: 0.5rem;
	display: flex;
	flex-flow: column;
	cursor: pointer;
}

.blog_4a_content h4 {
	color: white;
	font-size: 1.25rem;
	padding: 0.5rem 1rem;
}

.blog_4a_content .b1 {
	border-color: #6886ca;
}

.blog_4a_content .b1 h4 {
	background: url(HK-1-mobile-08.png) center center / 100% 100%;
}

.blog_4a_content .b2 {
	border-color: #de5bb2;
}

.blog_4a_content .b2 h4 {
	background: url(HK-1-mobile-09.png) center center / 100% 100%;
}

.blog_4a_content .b3 {
	border-color: #fba36e;
}

.blog_4a_content .b3 h4 {
	background: url(HK-1-mobile-10.png) center center / 100% 100%;
}

.blog_4a_content .b4 {
	border-color: #52a1c8;
}

.blog_4a_content .b4 h4 {
	background: url(HK-1-mobile-11.png) center center / 100% 100%;
}

.blog_4a_content .b5 {
	border-color: #64bcbd;
}

.blog_4a_content .b5 h4 {
	background: url(HK-1-mobile-12.png) center center / 100% 100%;
}

.blog_4a_content .b6 {
	border-color: #e5c37d;
}

.blog_4a_content .b6 h4 {
	background: url(HK-1-mobile-13.png) center center / 100% 100%;
}

.blog_4a_content .content {
	padding: 0.2rem 1rem;
	flex-grow: 1
}

.blog_4a_content .info {
	padding: 0.2rem 1rem;
	flex-shrink: 1;
	font-size: 0.85rem;
	background: #0001;
}

.blog_4a_content .info .details_btn {
	float: right;
}

@media only screen and (max-width: 479px) {
	.blogpage #blog_content .details {
		flex-basis: calc(100% - 2px);
	}

	#salearea {
		flex-flow: column;
	}
}

@media only screen and (min-width: 480px) {
	.blogpage #blog_content .details {
		flex-basis: calc(50% - 1rem - 2px);
	}
}

@media only screen and (min-width: 1021px) {
	.blogpage #blog_content .details {
		flex-basis: calc(33.33% - 1rem - 2px);
	}
}

@media only screen and (min-width: 1232px) {
	.blogpage #blog_content .details {
		flex-basis: calc(25% - 1rem - 2px);
	}
}

.blog_4b_header {
	left: 1.5vw;
	background: url(BlogReport-button.png) 0 0 no-repeat;
	padding-left: 40px;
	width: 245px;
	background-size: 100% 100%;
	height: 80px;
}
.blog_4b_header h5{
	line-height: 30px;
}

.blog_4b_header i {
	background: url(BlogReport-button2.png) 0 0 no-repeat;
	width: 22.56px;
	height: 18.96px;
	right: 56px;
	top: 40px;
	position: absolute;
}

.blog_4b_content {
	border: 2px solid #8B5E3C;
	border-top-left-radius: 1.5rem;
	border-bottom-left-radius: 1.5rem;
}

#blog_content {
	display: flex;
	flex-wrap: wrap;
}

.blog_4c {
	filter: hue-rotate(-45deg);
}

.blog_4c_header {
	left: 1.5vw;
	background: url(MyDetails-button.png) 0 0 no-repeat;
	width: 240px;
	height: 66px
}

.blog_4c_header i {
	background: url(MyDetails-button2.png) 0 0 no-repeat;
	width: 21px;
	height: 13.57px;
	left: 173px;
	top: 45.21px;
	position: absolute
}

.blog_4c_content {
	border: 2px solid #FB5427;
	border-top-left-radius: 1.5rem;
	border-bottom-left-radius: 1.5rem;
	line-height: normal;
}

.blog_4c_content ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-evenly;
}

.blog_4c_content li {
	max-width: 141px;
	float: left;
	margin: 5px;
	text-align: center;
	flex-basis: auto;
}

.blog_4c_content li img {
	width: 100%;
}

@media only screen and (max-width: 639px) {
	#blog_1 {
		border: 1px solid #EB768E
	}

	.blog_avatar {
		float: left;
		margin-right: 10px;
		margin-bottom: 15px;
		position: absolute;
	}

	.blog_1b,
	.blog_1v {
		clear: both;
		background: #eb768e;
		padding: 3rem 2vw 2rem;
		text-align: center;
    width: calc(100% - 4vw);
	}

	.blog_1b_header,
	.blog_1v_header {
		top: 0
	}

	.blog_1c {
		padding: 2rem;
	}

	.blog_2a {
		flex-flow: column;
	}

	.blog_2a_header h5 {
		border-top-left-radius: 1.5rem;
		border-top-right-radius: 1.5rem;
		display: inline-block;
		padding: 3px 1.5rem;
	}

	.blog_2a_content {
		border-top-left-radius: 1.5rem;
		border-bottom-left-radius: 1.5rem;
	}

	.blog_2b_header,
	.blog_2c_header,
	.blog_2d_header,
	.blog_3a_header,
	.blog_3b_header,
	.blog_3c_header,
	.blog_3d_header,
	.blog_4a_header,
	.blog_4b_header {
		scale: 0.8;
		transform-origin: 0 20%;
	}

	.field-heading {
		text-align: left;
		min-width: 50px;
	}

	.field-content {
		margin-left: 0;
	}
}

@media only screen and (max-width: 727px) {
	.field-heading {
		float: none;
		text-align: left;
		font-size: 0.9rem;
	}

	.field-content {
		margin-left: 40px;
	}

	.texttable .field-content {
		margin-left: 0;
		padding-top: 1.41rem;
		text-align: center;
	}
}

@media only screen and (min-width: 640px) {
	#blog_1 {
		padding-left: 238px;
		min-height: 888px;
		background: #EB768E;
		border-top-left-radius: 1.5rem;
		border-bottom-left-radius: 1.5rem;
		border-bottom-right-radius: 1.5rem;
		border: 1px solid #EB768E;
	}

	.blog_1a,
	.blog_1c {
		background: #ffe1e1
	}

	.blog_1b {
		position: absolute;
		left: 9px;
		top: 280px;
		width: 220px;
	}

	.blog_1v {
		position: absolute;
		left: 9px;
		bottom: 15px;
		width: 220px;
		margin-top: -2rem
	}

	.blog_1c {
		min-height: 200px;
		border-bottom-right-radius: 1.5rem;
		padding: 1rem;
	}

	.blog_avatar {
		position: absolute;
		left: 25px;
		top: 25px
	}

	.blog_2a_header {
		display: flex;
	}

	.blog_2a_header h5 {
		writing-mode: tb-rl;
		font-size: 18px;
		font-weight: normal;
		line-height: 2.25rem;
		float: left;
		letter-spacing: 3px;
	}

	.zh .blog_2a_header h5 {
		border-top-left-radius: 1rem;
		border-bottom-left-radius: 1rem;
	}

	.en .blog_2a_header h5 {
		transform: rotate(180deg);
		border-top-right-radius: 1rem;
		border-bottom-right-radius: 1rem;
	}

	.field-heading {
		min-width: auto;
		height: auto
	}

}

@media only screen and (min-width: 1024px) {
	#blog_1 {
		padding-left: 314px;
		min-height: 1000px;
		position: relative;
	}

	.blog_1b {
		left: 10px;
		top: 390px;
		width: 294px
	}

	.blog_1v {
		left: 10px;
		bottom: 1rem;
		width: 294px
	}

	.blog_1b_header,
	.blog_1v_header {
		left: 38px;
	}

	.blog_avatar {
		left: 45px;
		top: 45px
	}
}

@media only screen and (min-width: 480px) and (max-width: 639px) {
	.pl180 {
		margin-top: 5rem;
		padding-left: min(180px, 33vw)
	}

	.blog_1b_content .blog_video .shadowtext {
		bottom: 3.2rem !important;
		left: max(2.5rem, 50% - 175px) !important;
	}
}

@media only screen and (max-width: 479px) {
	.field-heading {
		position: relative !important;
		line-height: 1.41rem !important;
	}

	.field-content {
		margin: 0 !important;
		padding: 0 !important;
		line-height: 1.41rem !important;
	}

	#picProfile {
		width: 100%;
		max-width: 100%;
	}

	.pl180 {
		margin-top: 0;
		padding-left: 0
	}

	.blog_avatar {
		width: 99%;
		margin: 0;
		position: relative;
		float: none;
	}

	.blog_1a .address {
		clear: both;
	}

	.texttable .field-content {
		margin: 0 -12px
	}

	.blog_1b_content .blog_video .shadowtext {
		bottom: 3.2rem !important;
		left: max(2.5rem, 50% - 175px) !important;
	}

	.blog_1c {
		padding: 1rem;
	}
}

.blog_2b_content .nowrap,
.field-content dl {
	display: inline-block;
	margin: 0.2rem;
	background: linear-gradient(141deg, transparent, orange);
	border: 1px solid #c5a161;
	padding: 0.382rem 0.618rem;
	border-radius: 5%;
}

.blog_2b_content .stview.nowrap {
	background: linear-gradient(141deg, transparent, #00ffe7);
	border: 1px solid #009788;
	font-weight: bold;
}

.blog_2b_content .rejected.nowrap {
	background: linear-gradient(141deg, transparent, #c9b0fe);
	border: 1px solid #a870e4;
	font-size: 0.85rem;
}

.package_item{
	max-width: 100%;
	border:1px solid #dbadad;
	padding:0.5rem 0.75rem;
	background:linear-gradient(141deg, #fbc04229, #fcd8ec);
	margin-bottom: 1rem;
	border-radius: 5px;
	box-shadow: 1px 1px 4px #f0a5b5;
}

.package_s {
	font-size: 1.2rem;
	color: midnightblue;
	width: 100%;
}
.package_s i{
	float: right;
	font-size: 0.85rem;
	color: mediumpurple;
	margin-left: 0.75rem;
}

.package_c{
	display: flex;
	flex-wrap: wrap;
	gap:0.5rem;
	place-items:center;
	width: 100%;
}

.package_d {
	width: fit-content;
	max-width: calc(100% - 90px);
	flex-grow: 1;
}
.package_d > div:first-child{
	margin-right: 0.5rem;
	line-break: normal;
	display: inline-block;
}

.package_i{
	display: inline-block;
}
.package_i img{
	max-width: 50px;
	border: 2px solid whitesmoke;
	margin-left: 4px;
	box-shadow: 1px 1px 3px gray;
}

.package_p{
	border-left: 1px solid gray;
	padding-left: 0.5rem;
	min-width: 72px;
	justify-items: center;
}
.package_p p {
  color: darkgoldenrod;
}

.one-coin-icon{
	display: inline-block;
	width: 25px;
	height: 25px;
	background: url(Coin.svg) center center no-repeat #8e5200;
	vertical-align: bottom;
	border-radius: 50%;
	padding: 0.25px;
	margin-left: 3px;
}
@media only screen and (max-width: 480px){
	.blog_3a_content span {
		flex-basis: 33%;
	}
	.blog_1b, .blog_1v, .blog_2b, .blog_2c, .blog_2d, .blog_3a, .blog_3d, .blog_3b, .blog_3c, .blog_4a, .blog_4b, .blog_4c{
		display: block;
	}
}

#package-lightbox {
    display: flex;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(10, 10, 10, 0.95);
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

#package-lightbox-content {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    max-width: 90vw;
    max-height: 90vh;
}

#package-media-container {
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 100%;
    max-height: 90vh;
}

#package-image {
    max-width: 100%;
    max-height: 90vh;
    object-fit: contain;
}

#package-prev, #package-next, #package-lightbox-close {
    position: absolute;
    top: -2.25rem;
    right: 0;
    font-size: 1.2rem;
    color: white;
    cursor: pointer;
    background: rgb(86 85 85);
    border-radius: 50%;
		border: none;
    width: 2rem;
    height: 2rem;
    text-align: center;
    z-index: 1001;
    line-height: 2rem;
}

#package-prev:hover, #package-next:hover, #package-lightbox-close:hover {
    background: rgb(122, 121, 121);
}

#package-prev {
    left: 0;
}

#package-next {
    left: 3rem;
}

a.tg-button span {
	white-space: nowrap;
	font-size: 1.5rem;
	margin-top: 5px;
}

a.tg-button {
	font-size: 1rem;
	color: #fff;
	margin: 1rem;
	display: inline-block;
	padding: 16px 24px;
	font-size: 1.2rem;
	font-weight: bold;
	background: linear-gradient(135deg, #d5657c, #eb768e);
	border: none;
	border-radius: 25px;
	text-decoration: none;
	text-align: center;
	box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
	position: relative;
	overflow: hidden;
	animation: pulse 1.5s infinite alternate;
	font-family: 'Microsoft JhengHei', sans-serif;
	text-shadow: 1px 1px 2px #0008;
}

.tg-button:hover {
	background: linear-gradient(135deg, #ffaad8, #ffb9dc);
}

a.tg-button:hover {
	color: #003273;
}

.tg-button::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 300%;
	height: 300%;
	background: rgba(255, 255, 255, 0.15);
	transition: all 0.5s;
	border-radius: 50%;
	z-index: 0;
	transform: translate(-50%, -50%);
}

.tg-button:hover::before {
	width: 0;
	height: 0;
	opacity: 0;
}

.tg-button:active {
	transform: scale(0.95);
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

@media screen and (max-width: 520px) {
	a.tg-button {
		padding: 18px;
		margin: 2rem 0.5rem;
	}
}

@keyframes pulse {
	from {
		transform: scale(1);
		box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
	}

	to {
		transform: scale(1.05);
		box-shadow: 0 8px 16px rgba(0, 0, 0, 0.25);
	}
}

/* Banner Container - Flex layout for TG and AI banners */
.banner-container {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: flex-start;
	gap: 0;
	margin-top: 1rem;
}

.banner-container .align-center {
	display: inline-block;
	max-width:50%;
}

/* AI Banner Button Styles */
a.ai-banner-button {
	display: inline-block;
	margin: 1rem;
	padding: 0;
	border-radius: 15px;
	text-decoration: none;
	position: relative;
	overflow: hidden;
	box-shadow: 0 6px 12px rgba(0, 0, 0, 0.5);
	transition: all 0.3s ease;
}

a.ai-banner-button img {
	display: block;
	transition: transform 0.3s ease;
	border-radius:15px;
}

a.ai-banner-button:hover {
	box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3);
	transform: scale(1.05);
}

a.ai-banner-button:active {
	transform: scale(0.98);
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

/* Mobile: Stack buttons vertically */
@media screen and (max-width: 520px) {
	.banner-container {
		flex-direction: column;
		align-items: center;
	}
	
	a.ai-banner-button {
		margin: 2rem 0.5rem;
	}
}


@media only screen and (max-width: 970px){
	.banner-container .align-center {
		width:339px;
		max-width:100%;
	}
}