html,
body {
	position: relative;
	font-family: 'Lunasima', sans-serif;
	font-size: 14px;
	color: #b0aea3;
	background-color: #0d0d0d
}




a,
button {
	font-family: 'Lunasima', sans-serif;
	color: #bfbeb6
}

.flex {
	display: flex;
	justify-content: center;
	align-items: center
}

.icon-container {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 20px;
	background-repeat: no-repeat;
	background-size: contain;
	transition: all 0.3s
}

.icon-container.users {
	background-image: url(../img/users.png)
}

.icon-container.download-icon {
	width: 45px;
	height: 45px;
	background-image: url(../img/download-icon.png)
}

.img-container {
	display: flex; margin-bottom: 30px;
}

.img-container img {
	object-fit: contain;
	max-height: 100%;
	max-width: 100%
}

.hide-on-desktop {
	display: none !important
}

.dropdown-custom {
	position: relative;
	display: inline-block;
	height: 100%
}

.dropdown-custom-toggle {
	position: relative;
	display: flex;
	align-items: center;
	gap: 5px;
	cursor: pointer;
	height: 100%;
	width: 100%;
	outline: none;
	border: none;
	font-size: 12px;
	padding: 5px;
	border-radius: 10px;
	background-color: #333
}

.dropdown-custom.lang .img-container {
	margin-right: 5px
}

.dropdown-custom-toggle:hover {
	color: #ff9b00
}

.dropdown-custom-toggle svg {
	transition: all 0.3s;
	height: 12px;
	transform: rotate(180deg);
	stroke: #bfbeb6;
	fill: #fff0
}

.dropdown-custom-toggle.active svg {
	transform: rotate(0)
}

.dropdown-custom-menu {
	display: none;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	z-index: 5;
	top: 100%;
	width: 100%;
	background-color: #333;
	border-radius: 10px
}

.dropdown-custom-menu .dropdown-custom-item {
	display: flex;
	width: 100%;
	align-items: center;
	padding: 7px 5px;
	text-decoration: none;
	font-size: 12px;
	font-weight: 400;
	color: #bfbeb6
}

.dropdown-custom-menu .dropdown-custom-item:hover {
	background-color: #211c28;
	border-radius: 10px;
	color: #ffcd6d
}

.button {
	display: flex;
	align-items: center;
	justify-content: center;
	background-image: url(../img/button.png);
	background-repeat: no-repeat;
	background-size: cover;
	font-size: 13px;
	text-transform: uppercase;
	box-shadow: 0 5px 18px 0 #ff7f0059
}

.button-small {
	display: flex;
	align-items: center;
	justify-content: center;
	background-image: url(../img/button-small.png);
	background-repeat: no-repeat;
	background-size: cover;
	font-size: 13px;
	text-transform: uppercase;
	box-shadow: 0 5px 18px 0 #ff7f0059
}

.bgweb {
	position: absolute;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	inset: 0
}

.bgweb-top {
	position: absolute;
	top: 0;
	z-index: 1;
	display: block;
	width: 100%;
	height: 850px;
	background-image: url(../img/bg-top.jpg);
	background-position-x: center;
	background-position-y: top;
	background-repeat: no-repeat;
	min-height: 850px
}

.bgweb-bottom {
	position: absolute;
	bottom: 0;
	display: block;
	width: 100%;
	height: 1200px;
	background-image: url(../img/bg-bottom.png);
	background-position-x: center;
	background-position-y: bottom;
	background-repeat: no-repeat;
	min-height: 1200px
}

.main-nav {
	position: relative;
	z-index: 5;
	display: block;
	height: 62px;
	width: 100%;
	background-image: url(../img/bg-nav.png);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center
}

.main-nav ul {
	display: flex;
	justify-content: center;
	gap: 5px
}

.main-nav a {
	color: #dbd3c6;
	font-size: 14px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 1px;
	text-decoration: none;
	padding: 8px 12px;
	position: relative;
	transition: all 0.3s ease-in-out
}

.main-nav a:hover {
	color: #fc0;
	text-shadow: 0 0 10px rgb(255 140 0 / .8)
}

.main-content {
	margin: 0 10px;
	padding-top: 10px;
	margin-top: -3px;
	width: calc(100% - 20px);
	height: max-content;
	background-image: url(../img/bg-content-top.jpg);
	background-repeat: repeat-y;
	background-position: center
}

.main-content-bottom {
	margin: 0 10px;
	width: calc(100% - 20px);
	height: 17px;
	background-image: url(../img/bg-content-bottom.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center
}

.nav-frame {
	position: absolute;
	top: -40px;
	display: block;
	width: 110px;
	height: 134px;
	z-index: 5;
	background-image: url(../img/nav-frame.png);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center
}

.nav-frame.nav-left {
	left: -45px
}

.nav-frame.nav-right {
	right: -45px;
	transform: scaleX(-1)
}

.header {
	position: relative;
	z-index: 5;
	background-color: #191919;
	max-height: 44px;
	height: 44px
}

.header .container {
	height: 100%
}

.header-content {
	display: flex;
	height: 100%;
	justify-content: space-between;
	align-items: center;
	gap: 10px
}

.logo {
	position: relative;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 10px;
	padding-right: 30px;
	top: 15px
}

.logo-big {
	display: block;
	width: max-content;
	margin-left: 50px;
	padding: 0
}

.logo:hover {
	filter: brightness(120%)
}

.server-online {
	position: relative;
	padding-left: 30px
}

.server-online .wrapper {
	display: flex;
	height: 100%;
	width: 100%;
	align-items: center;
	justify-content: space-between
}

.total-online {
	display: flex;
	align-items: center;
	gap: 5px;
	font-size: 12px;
	font-weight: 400;
	color: #b0aea3
}

.server-online .online {
	display: flex;
	gap: 10px;
	align-items: center
}

.online-bar {
	width: 120px;
	height: 3px;
	background-color: #403e42
}

.online-bar span {
	width: 100%;
	display: block;
	height: 3px;
	background: linear-gradient(90deg, rgb(153 177 41) 0%, rgb(192 138 21) 100%)
}

.online-users {
	display: flex;
	align-items: center;
	font-size: 10px;
	font-weight: 400
}

.top-content {
	position: relative;
	padding-bottom: 45px;
	display: flex;
	align-items: center;
	flex-direction: column;
	gap: 40px
}

.download-btn {
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 22px;
	text-transform: uppercase;
	color: #e1fa72;
	font-style: italic;
	font-weight: 700;
	padding-bottom: 10px;
	right: 50px;
	bottom: 0;
	width: 289px;
	height: 128px;
	background: url(../img/download-btn.png)
}

.nav {
	position: relative;
	z-index: 6;
	height: 100%;
	display: flex;
	align-items: center;
	font-size: 14px;
	font-weight: 700;
	text-transform: uppercase;
	padding: 0 45px
}

.nav .nav-item .nav-link {
	padding: 25px
}

.nav .nav-item .nav-link:hover {
	color: #ff9b00
}

.nav-item.has-dropdown {
	position: relative
}

.nav-item.has-dropdown .nav-link {
	padding-right: 28px;
	position: relative
}

.nav-item.has-dropdown:hover .nav-link {
	color: #ffb505
}

.dropdown-menu {
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translateX(-50%);
	min-width: 150px;
	background-color: rgb(20 20 20 / .9);
	border: 1px solid rgb(50 50 50 / .4);
	border-radius: 2px;
	box-shadow: 0 2px 6px rgb(0 0 0 / .2);
	z-index: 100;
	opacity: 0;
	visibility: hidden;
	transition: all 0.2s ease;
	margin-top: -6px;
	padding: 3px 0
}

.nav-item.has-dropdown:hover .dropdown-menu {
	opacity: 1;
	visibility: visible
}

.dropdown-menu .dropdown-item {
	display: block;
	padding: 6px 12px;
	color: #aaa;
	font-size: 12px;
	text-decoration: none;
	text-align: center;
	transition: all 0.15s ease;
	position: relative;
	overflow: hidden
}

.dropdown-menu .dropdown-item:hover {
	color: #ffb505;
	background-color: rgb(40 40 40 / .5)
}

.nav-item.has-dropdown .nav-link:after {
	display: none
}

.nav-item.has-dropdown:before {
	content: '';
	position: absolute;
	height: 10px;
	bottom: -10px;
	left: 0;
	right: 0;
	z-index: 101
}

.dropdown-menu .dropdown-item:not(:last-child) {
	border-bottom: 1px solid rgb(70 70 70 / .1)
}

.dropdown-menu .dropdown-item:hover:after {
	width: 70%
}

.dropdown-menu .dropdown-item:after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 50%;
	width: 0;
	height: 1px;
	background: rgb(255 181 5 / .3);
	transition: all 0.15s ease;
	transform: translateX(-50%)
}

.header-content .dropdown-custom .img-container {
	width: 15px;
	height: 15px
}

.dropdown-custom.lang {
	padding: 10px 0
}

.header-content .right-content {
	display: flex;
	align-items: center;
	gap: 20px;
	margin-right: 10px
}

.header-content .right-content .header-buttons {
	display: flex;
	align-items: center;
	gap: 20px
}

.header-content .left-content {
	display: flex;
	align-items: center;
	height: 100%
}

.reg-btn {
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	color: #ff9b00
}

.reg-btn:hover {
	opacity: .5
}

.login-btn {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	background-image: url(../img/button.png);
	background-repeat: no-repeat;
	width: 86px;
	height: 28px;
	font-size: 12px;
	color: #fff;
	text-transform: uppercase
}

.login-btn .axe {
	position: absolute;
	display: block;
	top: -5px;
	height: 36px;
	width: 15px;
	background-image: url(../img/axe.png);
	background-repeat: no-repeat;
	background-size: cover
}

.login-btn .axe-left {
	left: -5px;
	transform: scaleX(-1)
}

.login-btn .axe-right {
	right: -5px
}

.brightness:hover {
	filter: brightness(120%)
}

.main {
	position: relative;
	z-index: 2;
	overflow: hidden
}

.slider-login {
	margin: 0 20px;
	display: flex;
	justify-content: space-between
}

.slider-block {
	width: 610px;
	background: url(../img/bg-h-content.jpg) no-repeat;
	background-size: cover;
	background-position: center bottom;
	box-shadow: 0 10px 20px -5px #000;
	padding-bottom: 25px;
	position: relative
}

.slider-block::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 40px;
	height: 40px;
	border: 3px solid rgb(255 255 255 / .3);
	border-top: 3px solid #fff;
	border-radius: 50%;
	animation: spin 1s linear infinite;
	z-index: 1;
	display: block
}

.slider-block.slider-ready::before {
	display: none
}

@keyframes spin {
	0% {
		transform: translate(-50%, -50%) rotate(0deg)
	}

	100% {
		transform: translate(-50%, -50%) rotate(360deg)
	}
}

.main-slider {
	padding: 5px;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s ease-in-out
}

.main-slider.slick-initialized {
	opacity: 1;
	visibility: visible
}

.main-slider.fallback-show {
	opacity: 1;
	visibility: visible
}

.main-slider:not(.slick-initialized):not(.fallback-show)>.img-container {
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
	visibility: hidden
}

.main-slider:not(.slick-initialized):not(.fallback-show)>.img-container:first-child {
	position: relative;
	opacity: 1;
	visibility: visible
}

.main-slider.fallback-show>.img-container {
	position: relative !important;
	opacity: 1 !important;
	visibility: visible !important
}

.main-slider.slick-initialized>.img-container,
.main-slider.slick-initialized .slick-slide .img-container {
	position: relative !important;
	opacity: 1 !important;
	visibility: visible !important;
	display: block !important
}

.login-block,
.server-info-block {
	width: 100%;
	background: url(../img/bg-h-content.jpg) no-repeat;
	background-size: cover;
	background-position: center bottom;
	box-shadow: 0 10px 20px -5px #000
}

.donation-block {
	margin-bottom: 30px;
	width: 100%;
	background: url(../img/bg-h-content.jpg) no-repeat;
	background-size: cover;
	background-position: center bottom;
	box-shadow: 0 10px 20px -5px #000;
	padding-right: 0px !important;
	padding-left: 0px !important;
	margin-left: 15px;
	margin-right: 15px;
}


.block-shadow {
	position: absolute;
	top: 0;
	left: 50%;
	opacity: .25;
	transform: translateX(-50%);
	display: block;
	height: 40px;
	width: 320px;
	background: url(../img/block-title-shadow.png) no-repeat;
	background-size: contain;
	background-position: center
}

.block-frame {
	position: absolute;
	top: -3px;
	display: block;
	height: 48px;
	width: 55px;
	background: url(../img/block-title-frame.png) no-repeat;
	background-size: contain;
	background-position: center
}

.block-frame.left {
	left: 0
}

.block-frame.right {
	right: 0;
	transform: scaleX(-1)
}

.registration-form {
	display: flex;
	flex-direction: column;
	gap: 10px;
	width: 100%;
	padding: 10px;
	min-width: 350px;
}

.login_form.registration-form {
	padding: 25px
}

.registration-form .button {
	padding: 16px
}

.form-group {
	position: relative;

	flex-direction: column;
	gap: 5px
}

.registration-form .form-group {
	position: relative;
	display: flex;
	flex-direction:row;
	gap: 5px
}


.form-group .icon-container {
	position: absolute;
	left: 4px;
	top: 50%;
	transform: translateY(-50%);
	width: 25px;
	height: 25px;
	z-index: 5
}

.form-group select.form-input {
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	padding-right: 30px;
	position: relative;
	background-image: none
}

.form-group select.form-input {
	background-image: linear-gradient(45deg, transparent 50%, #7c7671 50%), linear-gradient(135deg, #7c7671 50%, transparent 50%);
	background-position: calc(100% - 18px) center, calc(100% - 13px) center;
	background-size: 5px 5px, 5px 5px;
	background-repeat: no-repeat
}

.icon-container.user {
	background-image: url(../img/icon-user.png)
}

.icon-container.password {
	background-image: url(../img/icon-password.png)
}

.icon-container.email {
	background-image: url(../img/icon-email.png)
}

.icon-container.credits {
	background-image: url(../img/icon-credits.png)
}

.icon-container.wcoin {
	background-image: url(../img/icon-wcoin.png)
}

.icon-container.subject {
	background-image: url(../img/icon-subject.png)
}

.icon-container.department {
	background-image: url(../img/icon-department.png)
}

.icon-container.priority {
	background-image: url(../img/icon-priority.png)
}

.icon-container.attachment {
	background-image: url(../img/icon-attachment.png)
}

.icon-container.icon-character-status {
	background-image: url(../img/icon-character-status.png)
}

.icon-container.zen-amount {
	background-image: url(../img/icon-zen-amount.png)
}

.icon-container.icon-location {
	background-image: url(../img/icon-location.png)
}

.icon-container.icon-period {
	background-image: url(../img/icon-period.png)
}

.icon-container.account {
	background-image: url(../img/icon-account.png)
}

.icon-container.icon-strength {
	background-image: url(../img/icon-strength.png)
}

.icon-container.icon-agility {
	background-image: url(../img/icon-agility.png)
}

.icon-container.icon-vitality {
	background-image: url(../img/icon-vitality.png)
}

.icon-container.icon-energy {
	background-image: url(../img/icon-energy.png)
}

.icon-container.icon-online-status {
	background-image: url(../img/icon-online-status.png)
}


.login_deidad
	
	{
	display: flex;
	flex-direction: column;
	gap: 15px;
	width: 100%;
	padding: 10px;
	min-width: 180px;
}



.form-input {
	position: relative;
	border: 1px solid #fff0;
	background-color: #00000080;
	height: 35px;
	display: flex;
	width: 100%;
	align-items: center;
	color: #898888;
	transition: all 0.3s;
	padding-left: 40px;
	font-size: 13px;
	outline: none
}

.form-input:focus:not([disabled]) {
	border: 1px solid #070707;
	background-color: #070707
}

.form-input:hover:not([disabled]) {
	background-color: #0a0a0a;
	border: 1px solid #0a0a0a
}

input::placeholder {
	color: #353535
}

.forgot-link {
	font-size: 13px
}

.forgot-link:hover {
	opacity: .5
}

.registration-form .button {
	position: relative;
	width: 110px;
	height: 35px
}

.registration-form .button .axe {
	position: absolute;
	display: block;
	top: -5px;
	height: 36px;
	width: 15px;
	background-image: url(../img/axe.png);
	background-repeat: no-repeat;
	background-size: cover
}

.registration-form .button .axe-left {
	left: -5px;
	transform: scaleX(-1)
}

.registration-form .button .axe-right {
	right: -5px
}

.registration-form .button span {
	color: #facf96e3;
	-webkit-background-clip: text;
	background-clip: text;
	text-shadow: 1px 1px 1px rgb(255 165 0 / 60%), -1px -1px 1px rgb(0 0 0 / 60%);
	font-weight: 700;
	letter-spacing: 1px
}

.recaptcha-container {
	display: flex;
	justify-content: center;
	width: 100%;
	margin: 15px 0
}

.main-content-middle {
	display: flex;
	justify-content: space-between;
	margin: 0 20px;
	padding: 5px 0 15px 0;
	gap: 10px
}

.main-content-middle .left-content {
	display: flex;
	flex-direction: column;
	gap: 15px;
	width: 610px;
}

.main-content-middle .left-content-full {
	display: flex;
	flex-direction: column;
	gap: 15px;
	width:100%;
}


.main-content-middle .right-content {
	display: flex;
	flex-direction: column;
	gap: 15px;
	width: 320px
}

.server-info-block {
	height: 233px;
	background-image: url(../img/bg-server-info.jpg);
	background-size: contain
}

.server-info-content {
	padding: 20px 25px;
	display: flex;
	flex-direction: column
}

.server-info-content .wrapper {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: 13px;
	line-height: 30px
}

.server-info-content .wrapper .text {
	color: #ffb505
}

.castle-block {
	position: relative;
	background-color: rgb(21 21 21 / .4);
	border-radius: 5px;
	overflow: hidden;
	padding: 0;
	box-shadow: 0 0 10px rgb(0 0 0 / .5)
}

.castle-block:before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: url(../img/m7T6oTa.png);
	background-size: cover;
	background-position: center center;
	opacity: .85;
	z-index: 0;
	filter: brightness(.9)
}

.castle-block .wrapper-content {
	position: relative;
	z-index: 1;
	padding: 15px;
	display: flex;
	flex-direction: column;
	align-items: center
}

.castle-title {
	text-align: center;
	font-size: 18px;
	text-transform: uppercase;
	color: #ffb505;
	margin-bottom: 10px;
	width: 100%
}

.castle-owner {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	margin-bottom: 10px;
	width: 100%;
	text-align: center
}

.castle-siege-img {
	width: 45px;
	height: 45px
}

.castle-siege-img img {
	width: 45px;
	height: 45px;
	border-radius: 3px;
	object-fit: cover
}

.flex-wrapper {
	display: flex;
	flex-direction: column;
	gap: 4px;
	align-items: center
}

.nextbattle {
	color: #ffb505;
	font-size: 11px;
	margin-bottom: 2px;
	text-align: center
}

.wrapper .text {
	font-size: 12px;
	color: #d9d8d4;
	text-align: center
}

.castle-info {
	text-align: center;
	background-color: rgb(0 0 0 / 25%);
	padding: 4px 40px;
	font-size: 12px;
	border-radius: 4px;
	max-width: 90%;
	margin: 0 auto 8px
}

.castle-more-link {
	text-align: center;
	padding-top: 5px;
	opacity: .7;
	transition: all 0.25s ease;
	position: relative;
	z-index: 2;
	width: 100%
}

.castle-more-link:hover {
	opacity: 1
}

.cs-link {
	display: inline-flex;
	align-items: center;
	color: #d7d4c9;
	font-size: 11px;
	padding: 3px 8px;
	border-radius: 3px;
	background-color: rgb(0 0 0 / .3);
	text-decoration: none;
	transition: all 0.25s ease;
	cursor: pointer
}

.cs-link:hover {
	color: #ffb505;
	background-color: rgb(0 0 0 / .5);
	transform: translateY(-2px)
}

.cs-link i {
	margin-left: 5px;
	transition: transform 0.2s ease
}

.cs-link:hover i {
	transform: translateX(3px)
}

.top-player {
	background: url(../img/bg-h-content.jpg) no-repeat;
	background-size: cover;
	background-position: center bottom;
	box-shadow: 0 10px 20px -5px #000;
	color: #b0aea3
}

.rating-table {
	margin-top: 12px;
	display: flex;
	width: 100%;
	min-width: 320px;
	flex-direction: column
}

.rating-table .row-wrapper {
	position: relative;
	padding: 10px 0
}

.rating-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: 13px;
	padding: 0 20px;
	text-align: center;
	gap: 20px;
	transition: all 0.3s;
	line-height: 30px
}

.rating-row:not(.rating-heading-row):hover {
	background-color: #121212;
	transform: translateX(5px)
}

.rating-heading-row {
	padding: 10px 25px;
	background-color: #00000040;
	color: #7c7671;
	line-height: 1
}

.rating-heading-row span {
	font-size: 13px;
	color: #7c7671
}

.rating-number {
	width: 10%;
	display: flex;
	justify-content: center;
	align-items: center
}

.rating-name {
	min-width: 90px;
	width: 40%;
	overflow: hidden;
	text-align: start;
	color: #ffb505
}

.rating-level {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 25%
}

.rating-country {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 25%
}

.events {
	background: url(../img/bg-h-content.jpg) no-repeat;
	background-size: cover;
	background-position: center bottom;
	box-shadow: 0 10px 20px -5px #000
}

.events-table {
	display: flex;
	flex-direction: column;
	padding: 15px 20px 10px 20px
}

.events-table li {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 10px
}

.event-name {
	font-size: 13px
}

.event-name span {
	color: #ffb505;
	font-size: 11px
}

.event-name a {
	display: block;
	margin-bottom: 2px;
	color: #b0aea3
}

.event-name a:hover {
	opacity: .5
}

.event-time {
	text-align: right;
	color: #b0aea3;
	font-size: 13px
}

.event-time p {
	margin-bottom: 2px
}

.event-time span {
	color: #ffb505;
	font-size: 11px
}

.events-table li.view-more-container {
	justify-content: center;
	margin: 5px 0 0 0;
	padding: 8px 0 5px;
	border-top: 1px solid rgb(255 255 255 / .08)
}

.view-more-link {
	color: #b0aea3;
	font-size: 11px;
	text-decoration: none;
	cursor: pointer;
	display: inline-block;
	padding: 4px 10px;
	border-radius: 3px;
	background: rgb(0 0 0 / .15);
	transition: all 0.2s
}

.view-more-link:hover {
	color: #ffb505;
	background: rgb(0 0 0 / .25)
}

.view-more-link[data-state="expanded"] {
	color: #ffb505
}

.articles {
	display: flex;
	flex-direction: column;
	gap: 15px
}

.article-block {
	display: flex;
	flex-direction: column;
	background: url(../img/bg-h-content.jpg) no-repeat;
	background-size: cover;
	background-position: center bottom;
	box-shadow: 0 10px 20px -5px #000
}

.article-title-container {
	position: relative;
	background: url(../img/block-title.png) repeat-x center bottom;
	background-size: cover;
	height: 40px;
	color: #fff;
	overflow: hidden;
	display: flex;
	align-items: center
}

.article-title-container::before {
	content: '';
	position: absolute;
	inset: 0;
	background: #ffcc7e;
	opacity: .5;
	mix-blend-mode: multiply;
	z-index: 1
}

.article-title {
	position: relative;
	z-index: 2;
	font-size: 14px;
	font-weight: 500;
	font-family: 'Segoe UI', sans-serif;
	color: #907c68;
	text-transform: uppercase;
	padding: 0 10px;
	text-shadow: 2px 2px 1px rgb(0 0 0 / .6)
}

.article-content {
	padding: 25px;
	padding-bottom: 15px
}

.article-bottom {
	margin-top: 10px;
	display: flex;
	justify-content: space-between;
	gap: 10px
}

.article-text {
	display: flex;
	flex-direction: column;
	max-width: 460px;
	font-size: 12px;
	color: #b0aea3
}

.article-des {
	line-height: 30px
}

.article-bottom .more-button {
	width: 63px;
	height: 20px;
	text-transform: none;
	margin-top: 5px;
	margin-right: 10px
}

.article-main-content {
	display: flex;
	flex-direction: column;
	width: 100%
}

.article-content-row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: 10px
}

.article-button-container {
	text-align: right !important; float: right; margin-top: 20px;
}

.article-date-row {
	width: 100%;
	text-align: right;
	margin-top: 3px;
	height: 20px;
	padding-right: 10px;
}

.article-date {
	font-size: 10px;
	color: #575759
}

.pagination {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 35px;
	margin-top: 10px;
	margin-bottom: 20px
}

.pagination .page-numbers {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px
}

.pagination-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	background: #1c1b1b;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	color: #7c7671;
	font-size: 12px
}

.pagination .pagination-btn:hover:not([disabled]),
.page-number.active {
	color: #b7b6b6;
	box-shadow: 0 10px 10px 0 #fff0
}

.pagination .pagination-btn:hover:not([disabled]) .arrow {
	opacity: 1
}

.icon-container.arrow {
	display: flex;
	width: 7px;
	height: 12px;
	background-image: url(../img/arrow_1.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	opacity: .25
}

.arrow.left-arrow {
	transform: scaleX(-1)
}

.footer {
	padding: 10px 0;
	position: relative;
	z-index: 2;
	margin-top: 5px;
	background: #fff0
}

.footer-wrapper {
	display: flex;
	flex-direction: column;
	width: 100%;
	max-width: 980px;
	margin: 0 auto;
	padding: 0 5px
}

.footer-top {
	display: flex;
	justify-content: space-between;
	align-items: center
}

.footer-links {
	display: flex;
	align-items: center;
	gap: 15px
}

.footer-link {
	color: #ffb505;
	text-decoration: none;
	font-size: 12px;
	position: relative;
	transition: color 0.3s ease;
	padding-bottom: 2px
}

.footer-link::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 0;
	height: 1px;
	background-color: #ffb505;
	transition: width 0.3s ease
}

.footer-link:hover {
	color: #ffcc42
}

.footer-link:hover::after {
	width: 100%
}

.footer-link-separator {
	display: inline-block;
	height: 10px;
	width: 1px;
	background: linear-gradient(to bottom, transparent, rgb(255 181 5 / .3), transparent);
	margin: 0 5px
}

.social-links {
	display: flex;
	justify-content: flex-end;
	gap: 10px;
	margin-right: 5px
}

.social-link {
	width: 24px;
	height: 24px;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.2s ease;
	background: #fff0;
	border: none
}

.social-link i {
	color: #7c7671;
	font-size: 14px;
	opacity: .7;
	transition: all 0.3s ease
}

.social-link:hover {
	transform: translateY(-2px)
}

.social-link:hover i {
	color: #ffb505;
	opacity: 1
}

.footer-divider {
	height: 1px;
	width: 100%;
	background: linear-gradient(to right, transparent, #aeaeae26, #aeaeae26, #aeaeae26, transparent);
	margin: 5px 0
}

.footer-bottom {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	margin-top: 20px
}

.footer-left {
	display: flex;
	flex-direction: column;
	gap: 6px;
	max-width: 430px
}

.footer-text {
	color: #7c7671;
	font-size: 11px;
	line-height: 16px
}

.quote {
	font-style: italic;
	font-size: 10px;
	color: #5d5954;
	margin-top: 4px;
	padding-top: 4px
}

.footer-time {
	display: flex;
	gap: 30px;
	justify-content: flex-end
}

.time {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 3px
}

.time div:first-child {
	color: #7c7671;
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 1px
}

.timer {
	font-family: 'Consolas', monospace;
	font-size: 22px;
	font-weight: 400;
	color: #ffb505;
	padding: 3px 0
}

.time-des {
	color: #7c7671;
	font-size: 10px
}

.hamburger-menu {
	position: relative;
	z-index: 15;
	top: 50%;
	transform: translateY(-50%);
	left: 0;
	cursor: pointer;
	display: block;
	width: 75px;
	height: 100%;
	background-image: url(../img/menu.png);
	background-repeat: no-repeat;
	background-position: center
}

.hamburger-menu-close {
	cursor: pointer;
	display: block;
	font-size: 24px;
	font-weight: 700;
	color: #fff;
	padding: 15px 30px
}

.hamburger-menu-content {
	position: fixed;
	z-index: 50;
	height: 100vh;
	max-height: 100vh;
	width: 100%;
	max-width: 620px;
	overflow-y: auto;
	background-color: #000;
	transform: translateX(-100%);
	transition: all 0.3s
}

.hamburger-menu-content.active {
	transform: translateX(0)
}

.hamburger-menu-content .nav {
	height: max-content;
	flex-direction: column;
	align-items: flex-start;
	padding: 0
}

.hamburger-menu-content .nav-item {
	display: flex;
	width: 100%
}

.hamburger-menu-content .nav .nav-item .nav-link {
	position: relative;
	font-size: 24px;
	height: 100%;
	width: 100%;
	justify-content: flex-start;
	padding: 10px 30px
}

.hamburger-menu-content .nav-link:hover {
	color: #ffba36
}

.hamburger-menu-content .dropdown-custom.lang {
	margin-left: 30px;
	height: max-content
}

.hamburger-menu-content .dropdown-custom .img-container {
	width: 20px;
	height: 20px
}

.hamburger-menu-content .lang-name {
	font-size: 20px
}

.download-block {
	display: flex;
	flex-direction: column;
	background: url(../img/bg-h-content.jpg) no-repeat;
	background-size: cover;
	background-position: center bottom;
	box-shadow: 0 10px 20px -5px #000
}

.download-title {
	position: relative;
	height: 40px;
	width: 100%;
	background: url(../img/block-title.png) no-repeat;
	background-size: cover;
	background-position: center bottom;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 0 10px;
	font-size: 14px;
	text-transform: uppercase;
	color: #898888
}

.download-title::before {
	content: '';
	position: absolute;
	inset: 0;
	background: #ffe7c2;
	opacity: .6;
	mix-blend-mode: multiply;
	z-index: 1
}

.squares-wrapper {
	display: flex;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: center;
	gap: 12px;
	margin: 10px 0;
	padding: 0 5px
}

.download-content {
	display: flex;
	flex-direction: column;
	gap: 10px;
	justify-content: center;
	padding: 15px
}

.download-content .square {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	width: 128px;
	min-width: 118px;
	height: 114px;
	background-color: rgb(17 18 18 / .8);
	border-radius: 3px;
	transition: all 0.2s ease;
	border: 1px solid #1e1e1e
}

.download-content .square .img-container {
	transform: translateY(-10px);
	padding: 3px;
	display: flex;
	align-items: center;
	justify-content: center
}

.download-content .square .img-container img {
	width: 75px;
	height: auto
}

.download-content .square.shadow-7 .img-container,
.download-content .square.shadow-8 .img-container,
.download-content .square.shadow-9 .img-container {
	transform: translateY(0)
}

.download-content .square .square-shadow {
	position: absolute;
	bottom: 0;
	left: 0;
	display: block;
	width: 128px;
	height: 79px;
	background: url(../img/bg-shadow-1.png) center/cover no-repeat
}

.download-content .square span {
	position: absolute;
	z-index: 2;
	bottom: 10px;
	font-size: 12px;
	text-shadow: 0 1px 1px rgb(0 0 0 / .5)
}

.download-content .square.shadow-1 .square-shadow {
	background-image: url(../img/bg-shadow-1.png)
}

.download-content .square.shadow-1 span {
	color: #4d9df7
}

.download-content .square.shadow-1:hover {
	box-shadow: 0 0 20px 0 #0077ff80;
	transform: translateY(-3px)
}

.download-content .square.shadow-2 .square-shadow {
	background-image: url(../img/bg-shadow-2.png)
}

.download-content .square.shadow-2 span {
	color: #f4555c
}

.download-content .square.shadow-2:hover {
	box-shadow: 0 0 20px 0 #f4555c80;
	transform: translateY(-3px)
}

.download-content .square.shadow-3 .square-shadow {
	background-image: url(../img/bg-shadow-3.png)
}

.download-content .square.shadow-3 span {
	color: #60eca5
}

.download-content .square.shadow-3:hover {
	box-shadow: 0 0 20px 0 #60eca580;
	transform: translateY(-3px)
}

.download-content .square.shadow-4 .square-shadow {
	background-image: url(../img/bg-shadow-4.png)
}

.download-content .square.shadow-4 span {
	color: #2c85b0
}

.download-content .square.shadow-4:hover {
	box-shadow: 0 0 20px 0 #2c85b080;
	transform: translateY(-3px)
}

.download-content .square.shadow-5 .square-shadow {
	background-image: url(../img/bg-shadow-5.png)
}

.download-content .square.shadow-5 span {
	color: #67217a
}

.download-content .square.shadow-5:hover {
	box-shadow: 0 0 20px 0 #67217a80;
	transform: translateY(-3px)
}

.download-content .square.shadow-6 .square-shadow {
	background-image: url(../img/bg-shadow-6.png)
}

.download-content .square.shadow-6 span {
	color: #476010
}

.download-content .square.shadow-6:hover {
	box-shadow: 0 0 20px 0 #47601080;
	transform: translateY(-3px)
}

.download-content .square.shadow-7 .square-shadow {
	background-image: url(../img/bg-shadow-7.png)
}

.download-content .square.shadow-7 span {
	color: #787c6f
}

.download-content .square.shadow-7:hover {
	box-shadow: 0 0 20px 0 #787c6f80;
	transform: translateY(-3px)
}

.download-content .square.shadow-8 .square-shadow {
	background-image: url(../img/bg-shadow-8.png)
}

.download-content .square.shadow-8 span {
	color: #115ea2
}

.download-content .square.shadow-8:hover {
	box-shadow: 0 0 20px 0 #115ea280;
	transform: translateY(-3px)
}

.download-content .square.shadow-9 .square-shadow {
	background-image: url(../img/bg-shadow-9.png)
}

.download-content .square.shadow-9 span {
	color: #009a66
}

.download-content .square.shadow-9:hover {
	box-shadow: 0 0 20px 0 #009a6680;
	transform: translateY(-3px)
}

.download-grey-text {
	color: #575759;
	font-size: 11px;
	text-align: center;
	background-color: rgb(0 0 0 / .2);
	padding: 6px 20px 6px 20px;
	border-radius: 3px;
	margin: 3px auto;
	max-width: 90%
}

.download-text {
	font-size: 12px;
	text-align: center;
	line-height: 1.4;
	color: #b0aea3;
	margin: 0 auto 5px
}

.separator {
	height: 1px;
	background: linear-gradient(to right, transparent, rgb(255 155 0 / 50%), transparent);
	margin: 15px 0;
	width: 100%
}

.page-content {
	display: grid;
	row-gap: 10px;
	align-items: center;
	margin: 20px auto;
	max-width: 560px;
	grid-template-columns: 170px 1fr
}

.page-title-glow {
	color: #ff9b00;
	font-size: 13px;
	font-weight: 600;
	text-shadow: 0 0 10px rgb(255 181 5 / .3);
	letter-spacing: .5px;
	text-transform: uppercase
}

.page-content.columns-wide {
	grid-template-columns: 210px 2fr
}

.page-content.columns-medium {
	grid-template-columns: 170px 1fr
}

.page-content.columns-narrow {
	grid-template-columns: 120px 1fr
}

.page-content .content-title {
	text-align: left;
	color: #b0aea3;
	margin: 0;
	font-size: 13px
}

.page-content .bottom-form {
	grid-column: span 2;
	display: flex;
	justify-content: center;
	margin-top: 20px
}

.page-content .form-input-wrapper {
	display: flex;
	align-items: center;
	width: 100%
}

.page-content .button {
	display: flex;
	align-items: center;
	justify-content: center;
	background-image: url(../img/button.png);
	background-repeat: no-repeat;
	background-size: cover;
	font-size: 13px;
	text-transform: uppercase;
	box-shadow: 0 5px 18px 0 #ff7f0059;
	color: #fff;
	font-family: 'Lunasima';
	width: 110px;
	height: 35px;
	padding: 16px;
	position: relative
}

.page-content .button .axe {
	position: absolute;
	display: block;
	top: -5px;
	height: 36px;
	width: 15px;
	background-image: url(../img/axe.png);
	background-repeat: no-repeat;
	background-size: cover
}

.page-content .button .axe-left {
	left: -5px;
	transform: scaleX(-1)
}

.page-content .button .axe-right {
	right: -5px
}

.page-content .button span {
	color: #facf96e3;
	-webkit-background-clip: text;
	background-clip: text;
	text-shadow: 1px 1px 1px rgb(255 165 0 / 60%), -1px -1px 1px rgb(0 0 0 / 60%);
	font-weight: 700;
	letter-spacing: 1px
}

.i_note,
.s_note,
.w_note,
.e_note {
	border: 1px solid;
	margin: 10px 0;
	padding: 12px 10px 12px 40px;
	background-repeat: no-repeat;
	-moz-border-radius: .5em;
	-webkit-border-radius: .5em;
	border-radius: .5em;
	text-align: left;
	font-size: 12px;
	width: 100%
}

.i_note {
	color: #004085;
	background-color: #cce5ff;
	background-image: url(../img/info.png);
	background-position: 10px center
}

.s_note {
	color: #155724;
	background-color: #d4edda;
	background-image: url(../img/success.png);
	background-position: 10px center
}

.w_note {
	color: #9F6000;
	background-color: #FEEFB3;
	background-image: url(../img/warning.png);
	background-position: 10px center
}

.e_note {
	color: #721c24;
	background-color: #f8d7da;
	background-image: url(../img/error.png);
	background-position: 10px center
}

.e_note a {
	color: #721c24;
	text-decoration: underline
}

.info-card {
	width: 100%;
	font-size: 12px;
	background-color: rgb(18 18 18 / .8);
	background-image: linear-gradient(rgb(30 30 30 / .05) 1px, transparent 1px), linear-gradient(90deg, rgb(30 30 30 / .05) 1px, transparent 1px);
	background-size: 20px 20px;
	border-radius: 4px;
	box-shadow: 0 2px 8px rgb(0 0 0 / .25);
	border: 1px solid rgb(60 60 60 / 30%);
	overflow: hidden;
	padding: 15px
}

.section-header {
	display: flex;
	align-items: center;
	margin-bottom: 12px;
	padding-bottom: 8px;
	border-bottom: 1px solid #ffb50580;
	color: #d0d0d0;
	font-size: 13px;
	font-weight: 600
}

.warning-header {
	color: #ffb505;
	border-bottom-color: #ffb50580
}

.info-header {
	color: #5aabff;
	border-bottom-color: #5aabff7d
}

.neutral-header {
	color: #a0a0a0;
	border-bottom-color: #a0a0a080
}

.success-header {
	color: #50c050;
	border-bottom-color: #50c05080
}

.icon {
	width: 15px;
	height: 15px;
	margin-right: 10px;
	background-color: currentColor;
	mask-repeat: no-repeat;
	mask-position: center;
	mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: center;
	-webkit-mask-size: contain
}

.info-header .icon {
	mask-image: url(../img/exclamation-circle.svg);
	-webkit-mask-image: url(../img/exclamation-circle.svg)
}

.warning-header .icon {
	mask-image: url(../img/exclamation-triangle.svg);
	-webkit-mask-image: url(../img/exclamation-triangle.svg)
}

.success-header .icon {
	mask-image: url(../img/exclamation-circle.svg);
	-webkit-mask-image: url(../img/exclamation-circle.svg)
}

.neutral-header .icon {
	mask-image: url(../img/exclamation-circle.svg);
	-webkit-mask-image: url(../img/exclamation-circle.svg)
}

ul {
	margin: 0;
	padding: 0;
	list-style-type: none
}

li {
	display: flex;
	align-items: flex-start;
	color: #b0aea3;
	line-height: 1.3
}

.bullet {
	color: gray;
	margin-right: 10px;
	font-size: 15px
}

.text-content {
	color: #b0b0b0;
	line-height: 1.5;
	font-size: 14px
}

.registration-block {
	display: flex;
	flex-direction: column;
	background: url(../img/bg-h-content.jpg) no-repeat;
	background-size: cover;
	background-position: center bottom;
	box-shadow: 0 10px 20px -5px #000
}

.registration-title {
	position: relative;
	height: 40px;
	width: 100%;
	background: url(../img/block-title.png) no-repeat;
	background-size: cover;
	background-position: center bottom;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 0 10px;
	font-size: 14px;
	text-transform: uppercase;
	color: #898888
}

.registration-title::before {
	content: '';
	position: absolute;
	inset: 0;
	background: #ffe7c2;
	opacity: .6;
	mix-blend-mode: multiply;
	z-index: 1
}

.registration-content {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	padding: 20px;
	width: 100%
}

.registration-content .table-data a {
	color: #ffb505 !important
}

.registration-content .table-data a:hover {
	color: #ffc740 !important
}

.registration-block .registration-form {
	align-items: center
}

.registration-block .registration-form .form-group {
	max-width: 300px;
	width: 100%
}

.registration-block .registration-form .button {
	width: 130px;
	height: 35px;
	margin-top: 15px
}

.registration-block .confirm-text {
	font-size: 13px
}

.registration-block .form-link {
	color: #ff9b00
}

.registration-block .form-link:hover {
	opacity: .5
}

.registration-banners {
	display: flex;
	flex-direction: column
}

.form-field-group {
	display: flex;
	flex-direction: column;
	margin-bottom: 10px;
	width: 100%;
	max-width: 350px
}

.field-label {
	color: #b0aea3ad;
	font-size: 13px;
	margin-bottom: 7px;
	text-align: left
}

.field-note {
	color: #ff2700cf;
	font-size: 9px;
	margin-top: 5px;
	text-align: right
}

.banner {
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	padding: 10px;
	font-size: 12px
}

.banner-1 {
	background: #2e3825;
	border: 1px solid #7a8540;
	border-radius: 6px;
	color: #d6d1b1;
	box-shadow: 0 0 8px rgb(0 0 0 / .3);
	margin: 5px
}

.banner-2 {
	background: #252f3e;
	border: 1px solid #60718c;
	border-radius: 6px;
	color: #d6d1b1;
	box-shadow: 0 0 8px rgb(0 0 0 / .3);
	margin: 5px
}

.banner-3 {
	background: rgb(255 159 34 / .2);
	border: 1px solid #ff9f00;
	border-radius: 6px;
	color: #fff5d0;
	box-shadow: 0 0 8px rgb(0 0 0 / .3);
	margin: 5px
}

.banner span {
	margin-left: 3px
}

.banner-1 span {
	color: #d5ff17
}

.banner-2 span {
	color: #68bbeb
}

.banner-3 span {
	color: #e9c996
}

.rankings-block {
	position: relative;
	display: flex;
	flex-direction: column;
	background: url(../img/bg-h-without-line.jpg) no-repeat;
	background-size: cover;
	background-position: center bottom;
	box-shadow: 0 10px 20px -5px #000
}

.bottom-line {
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	height: 1px;
	width: 100%;
	background: radial-gradient(circle, rgb(81 48 4 / .6026785714285714) 0%, #fff0 100%)
}

.rankings-title {
	position: relative;
	height: 40px;
	width: 100%;
	background: url(../img/block-title.png) no-repeat;
	background-size: cover;
	background-position: center bottom;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 0 10px;
	font-size: 14px;
	text-transform: uppercase;
	color: #898888
}

.rankings-title::before {
	content: '';
	position: absolute;
	inset: 0;
	background: #ffe7c2;
	opacity: .6;
	mix-blend-mode: multiply;
	z-index: 1
}

.rankings-class-image {
	border: 1px solid rgb(255 155 0 / .3);
	transition: all 0.2s ease;
	border-radius: 10%
}

.fix-image-avatar img {
	border: 1px solid rgb(255 155 0 / .3);
	transition: all 0.2s ease;
	border-radius: 10%
}

.table-data tr:hover .rankings-class-image {
	border-color: rgb(255 155 0 / .8);
	transform: scale(1.05)
}

.rankings-content {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	padding: 20px
}

.rankings-btns,
.sub-buttons {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 15px 8px;
	align-items: center
}

.rank-btn {
	padding: 10px 33px;
	text-transform: none
}

.search-block {
	align-self: flex-start;
	display: flex;
	width: 100%;
	align-items: center;
	margin-top: 20px
}

.search-title {
	font-size: 13px;
	color: #ff9b00;
	width: 25%;
	white-space: nowrap;
	margin-right: 8px
}

.search-query {
	display: flex;
	align-items: center;
	width: 80%;
	gap: 10px
}

.search-query .search-input {
	width: 40%;
	flex-grow: 1;
	height: 28px;
	background-color: #00000080;
	border: 1px solid #fff0;
	border-radius: 2px;
	color: #989690;
	padding: 0 10px;
	margin-left: 0
}

.search-query .search-input:focus:not([disabled]) {
	background-color: #00000080;
	outline: 1px solid #fff0
}

.search-query .search-input:hover:not([disabled]) {
	background-color: #00000080;
	border: 1px solid #080808
}

.search-btn {
	padding: 5px 20px;
	text-transform: unset;
	white-space: nowrap;
	margin-left: auto
}

.rank-btn.active,
.rank-btn:hover {
	box-shadow: 0 5px 18px 0 #ff7f0059
}

.col-width-5 {
	width: 5%;
	display: flex;
	justify-content: center;
	align-items: center
}

.col-width-10 {
	width: 10%;
	display: flex;
	justify-content: center;
	align-items: center
}

.col-width-15 {
	width: 15%;
	display: flex;
	justify-content: center;
	align-items: center
}

.col-width-20 {
	width: 20%;
	display: flex;
	justify-content: center;
	align-items: center
}

.col-width-25 {
	width: 25%;
	display: flex;
	justify-content: center;
	align-items: center
}

.col-width-30 {
	width: 30%;
	display: flex;
	justify-content: center;
	align-items: center
}

.col-width-40 {
	width: 40%;
	display: flex;
	justify-content: center;
	align-items: center
}

.col-width-80 {
	width: 80%;
	display: flex;
	justify-content: center;
	align-items: center
}

#account-history-table .rankings-row {
	font-size: 10px
}

#account-history-table .rankings-heading-row span {
	font-size: 12px
}

.server-block {
	display: flex;
	flex-direction: column;
	background: url(../img/bg-h-content.jpg) no-repeat;
	background-size: cover;
	background-position: center bottom;
	box-shadow: 0 10px 20px -5px #000
}

.server-title {
	position: relative;
	height: 40px;
	width: 100%;
	background: url(../img/block-title.png) no-repeat;
	background-size: cover;
	background-position: center bottom;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 0 10px;
	font-size: 14px;
	text-transform: uppercase;
	color: #898888
}

.server-title::before {
	content: '';
	position: absolute;
	inset: 0;
	background: #ffe7c2;
	opacity: .6;
	mix-blend-mode: multiply;
	z-index: 1
}

.server-content {
	flex-direction: column;
	gap: 20px;
	justify-content: center;
	align-items: center;
	padding: 20px 15px
}

.tab-content {
	display: none;
	-webkit-animation-name: fadeIn;
	animation-name: fadeIn;
	-webkit-animation-duration: 0.5s;
	animation-duration: 0.5s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both
}

@-webkit-keyframes fadeIn {
	0% {
		opacity: 0
	}

	100% {
		opacity: 1
	}
}

@keyframes fadeIn {
	0% {
		opacity: 0
	}

	100% {
		opacity: 1
	}
}

.tab-content.active {
	display: block
}

.server-info-table {
	display: table;
	width: 100%;
	border-collapse: separate;
	border-spacing: 0 1px;
	padding: 0;
	border: 1px solid rgb(60 60 60 / .2);
	border-radius: 4px;
	overflow: hidden;
	box-shadow: 0 2px 8px rgb(0 0 0 / .15)
}

.server-info-table .row-wrapper {
	display: table-row-group;
	width: 100%
}

.server-row {
	display: table;
	width: 100%;
	table-layout: fixed;
	margin-bottom: 1px;
	font-size: 12px
}

.server-row:not(:last-child) {
	border-bottom: 1px solid rgb(70 70 70 / .1)
}

.server-row .col-primary,
.server-row .col-content {
	display: table-cell;
	padding: 8px 10px;
	vertical-align: middle;
	box-sizing: border-box;
	white-space: nowrap;
	background-color: #352d1f26
}

.server-row .col-primary {
	width: 40%;
	border-right: 1px solid #0c07014d
}

.server-row .center {
	text-align: center
}

.server-row .col-content {
	width: 60%
}

.server-row .col-action,
.server-row .col-header {
	display: table-cell;
	padding: 8px 10px;
	vertical-align: middle;
	box-sizing: border-box;
	white-space: nowrap;
	width: 30%;
	background-color: #0000004d;
	text-align: center;
	color: inherit
}

.server-row .col-action.bordered {
	border-right: 1px solid #0c07014d
}

.server-row.header-row {
	background-color: rgb(20 20 20 / .95) !important
}

.server-row.header-row .col-primary,
.server-row.header-row .col-action,
.server-row.header-row .col-header {
	background-color: rgb(20 20 20 / .95)
}

.server-row.main-header .col-header {
	width: 60%;
	text-align: center;
	border-left: none
}

.server-row.sub-header {
	border-top: none;
	background-color: rgb(30 30 30 / .95) !important
}

.server-row.sub-header .col-primary,
.server-row.sub-header .col-action {
	background-color: rgb(30 30 30 / .95)
}

.server-row:nth-child(even) .col-content,
.server-row:nth-child(even) .col-primary {
	background-color: #f0f0f00d
}

.server-row:nth-child(n+3):nth-child(odd) .col-action {
	background-color: #0000004d
}

.server-row:nth-child(n+3):nth-child(even) .col-action {
	background-color: rgb(25 25 25 / .9)
}

.server-row:hover .col-primary,
.server-row:hover .col-content,
.server-row:hover .col-action,
.server-row:hover {
	background-color: #0a0a0a !important;
	box-shadow: inset 0 0 0 1px rgb(255 155 0 / .05)
}

.server-row.header-row:hover .col-primary,
.server-row.header-row:hover .col-action,
.server-row.header-row:hover .col-header {
	background-color: rgb(20 20 20 / .95) !important
}

.server-row.sub-header:hover .col-primary,
.server-row.sub-header:hover .col-action {
	background-color: rgb(30 30 30 / .95) !important
}

.server-info-link {
	color: #ff9b00;
	font-size: 12px
}

.server-info-link:hover {
	opacity: .5
}

.highlight-link a {
	color: #ffb505
}

.highlight-link a:hover {
	color: #ffb505;
	opacity: .8
}

.sup-tag {
	font-size: 75%;
	position: relative;
	top: -1px;
	vertical-align: top;
	line-height: 0;
	color: #ffb505;
	font-weight: 700;
	letter-spacing: .8px
}

.status-online {
	color: #01a908;
	font-weight: 700
}

.sup-tag.hot-spot {
	color: #f20707;
	font-weight: 700;
	display: inline-flex;
	align-items: center;
	gap: 2px;
	letter-spacing: 0
}

.sup-tag.new-tag {
	color: #f7f6f2;
	letter-spacing: 0;
	background: #9e0101;
	padding: 1px 4px;
	border-radius: 10px;
	font-size: 8px
}

.tab-content .server-info-title:first-child,
.tab-container>.server-info-title:first-child {
	margin-top: 0
}

.check-success {
	color: #17cd28;
	font-weight: 400
}

.check-error {
	color: #dc1c1c;
	font-weight: 400
}

.info-icon-container {
	position: relative;
	display: inline-block
}

.info-icon {
	cursor: help;
	font-size: 14px;
	color: #3498db
}

.check-info {
	color: #3498db
}

.info-icon-container:hover .tooltip-content {
	display: block
}

.vip-star {
	color: #fbb91b;
	position: relative;
	text-shadow: 0 0 3px rgb(255 215 0 / .4);
	transition: transform 0.3s ease, text-shadow 0.3s ease
}

.tooltip-content {
	display: none;
	position: absolute;
	background-color: #1f1f1f;
	color: #b6b4ab;
	border-radius: 4px;
	padding: 10px;
	z-index: 9999;
	font-size: 11px;
	top: -10px;
	right: 25px;
	left: auto;
	left: auto;
	box-shadow: 0 2px 5px rgb(0 0 0 / .3);
	width: auto !important;
	min-width: auto !important;
	max-width: none !important;
	transition: opacity 0.3s
}

.info-icon-container:hover .tooltip-content {
	display: block;
	visibility: visible
}

.tooltip-content:after {
	content: '';
	position: absolute;
	bottom: -10px;
	right: 5px;
	border-width: 5px;
	border-style: solid;
	border-color: rgb(0 0 0 / .85) #fff0 #fff0 #fff0
}

.tooltip-line {
	display: flex !important;
	align-items: center !important;
	margin-bottom: 6px !important;
	white-space: nowrap !important;
	overflow: visible !important
}

.tooltip-line .check-green,
.tooltip-line .x-red {
	margin-right: 5px;
	font-size: 14px
}

.tooltip-line:last-child {
	margin-bottom: 0 !important
}

.tooltip-line i {
	margin-top: 3px !important;
	margin-right: 5px !important;
	flex-shrink: 0 !important
}

.table-data,
.tab-container,
.server-content {
	overflow: visible !important
}

.tooltip-content:after,
.tooltip-content:before {
	display: none !important
}

ul#vote-options {
	width: 100%;
	margin: 0;
	padding: 0;
	list-style: none
}

ul#vote-options li {
	display: flex;
	align-items: center;
	padding: 10px;
	border: 1px solid rgb(0 0 0 / .15);
	border-radius: 5px;
	background: rgb(0 0 0 / 35%)
}

ul#vote-options li img {
	width: 75px;
	height: 45px;
	margin-right: 15px
}

ul#vote-options li .text-container {
	position: relative;
	display: flex;
	flex-direction: column;
	padding-left: 15px;
	min-width: 150px
}

ul#vote-options li .text-container::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 3px;
	height: 100%;
	background-color: #b0aea3
}

ul#vote-options li .text-container h5 {
	margin: 0;
	color: #b0aea3;
	font-size: 18px;
	font-weight: 700
}

ul#vote-options li .text-container .reward-text {
	color: #b0aea3;
	font-size: 11px
}

ul#vote-options li .text-container .reward {
	margin-top: 3px;
	color: #ffbb38;
	font-size: 11px
}

ul#vote-options li .button-container {
	display: flex;
	flex-direction: row;
	align-items: center;
	margin-left: auto;
	gap: 10px
}

ul#vote-options li .button-container button {
	padding: 5px 15px;
	font-size: 14px;
	white-space: nowrap
}

ul#vote-options li .button-container .countdown-timer {
	order: -1;
	margin-top: 0;
	min-width: 50px
}

ul#vote-options li .button-container button[disabled] {
	opacity: .7;
	color: #888 !important;
	background: rgb(50 50 50 / .7) !important;
	border: 1px solid rgb(128 128 128 / .3);
	filter: grayscale(40%);
	cursor: not-allowed;
	position: relative;
	text-decoration-color: rgb(255 255 255 / .3);
	text-decoration-thickness: 1px;
	box-shadow: none !important;
	transition: all 0.3s ease;
	text-shadow: none
}

.currency-icon {
	width: 22px;
	height: 22px;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	margin-right: 10px;
	flex-shrink: 0
}

.wcoin-icon {
	background-image: url(../img/icon-wcoin.png)
}

.credits-icon {
	background-image: url(../img/icon-credits.png)
}

.currency-display-vertical {
	width: 200px;
	margin: 5px auto 5px auto;
	background: rgb(25 25 25 / .3);
	border-radius: 5px;
	padding: 5px 0;
	border: 1px solid rgb(255 255 255 / .08)
}

.currency-line {
	display: flex;
	align-items: center;
	padding: 5px 15px;
	margin: 0 auto;
	width: 90%
}

.currency-label {
	font-size: 12px;
	color: #b5b5b5;
	margin-right: auto
}

.currency-value {
	font-size: 12px;
	font-weight: 500;
	color: #ffb505
}

.currency-line:hover {
	background: rgb(255 255 255 / .08);
	transform: scale(1.02);
	transition: all 0.2s ease
}

.panel-block {
	background: url(../img/bg-h-content.jpg) no-repeat;
	background-size: cover;
	background-position: center bottom;
	box-shadow: 0 10px 20px -5px #000;
	padding-bottom: 20px
}

.panel-block .button {
	position: relative;
	width: 109px;
	height: 35px;
	text-transform: none;
	left: 50%;
	transform: translateX(-50%);
	text-transform: uppercase
}

.panel-block .button .axe {
	position: absolute;
	display: block;
	top: -5px;
	height: 36px;
	width: 15px;
	background-image: url(../img/axe.png);
	background-repeat: no-repeat;
	background-size: cover
}

.panel-block .button .axe-left {
	left: -5px;
	transform: scaleX(-1)
}

.panel-block .button .axe-right {
	right: -5px
}

.panel-options {
	margin-top: 10px;
	position: relative;
	z-index: 0;
	display: flex;
	flex-direction: column;
	gap: 5px
}

.panel-option {
	position: relative;
	display: flex;
	align-items: center;
	height: 30px;
	text-align: center;
	padding: 5px 20px;
	text-transform: uppercase;
	font-size: 13px;
	background-color: #232323;
	border: 1px solid #333;
	transition: color 0.25s ease, border-color 0.25s ease, background-color 0.25s ease;
	color: #b0aea3;
	width: 200px;
	margin: 0 auto;
	border-radius: 5px;
	overflow: hidden;
	white-space: nowrap;
	margin-bottom: 10px;
}

.panel-option::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	display: block;
	width: 316px;
	height: 74px;
	transition: all 0.3s ease-in-out;
	opacity: 0;
	background: url(../img/panel-hover.png) center/contain no-repeat;
	z-index: -1
}

.panel-option::after {
	content: '';
	position: absolute;
	top: 0;
	left: -100%;
	width: 100%;
	height: 100%;
	background: linear-gradient(to right, transparent, rgb(255 181 5 / .1), transparent);
	transition: left 0.7s ease;
	z-index: 1
}

.panel-option:hover::before {
	opacity: .8
}

.panel-option:hover::after {
	left: 100%
}

.panel-option:hover {
	color: #ffb505;
	border-color: #ffb505;
	border-left: 2px solid #ffb505;
	text-shadow: 0 0 5px rgb(255 181 5 / .3);
	background: linear-gradient(to right, rgb(25 22 18 / .4), rgb(25 22 18 / .1) 85%, transparent)
}

.my-account-block {
	display: flex;
	flex-direction: column;
	background: url(../img/bg-h-content.jpg) no-repeat;
	background-size: cover;
	background-position: center bottom;
	box-shadow: 0 10px 20px -5px #000;
	margin-bottom: 5px;
	border-radius: 3px;
	overflow: hidden
}

.block-title {
	position: relative;
	height: 40px;
	width: 100%;
	background: url(../img/block-title.png) no-repeat;
	background-size: cover;
	background-position: center bottom;
	text-transform: uppercase;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #898888;
	padding-left: 15px
}

.block-title::before {
	content: '';
	position: absolute;
	inset: 0;
	background: #ffe7c2;
	opacity: .6;
	mix-blend-mode: multiply;
	z-index: 1
}

.block-title-text {
	position: relative;
	z-index: 2;
	color: #ff9b00;
	font-weight: 700;
	text-transform: uppercase
}

.mac-table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 3px;
	padding: 5px
}

.mac-cell {
	padding: 0;
	vertical-align: top;
	width: 50%
}

.mac-row {
	position: relative;
	display: flex;
	align-items: center;
	background: rgb(20 20 20 / .4);
	border: 1px solid rgb(70 60 40 / .2);
	border-radius: 3px;
	padding: 6px 8px;
	margin-bottom: 4px;
	transition: all 0.2s ease;
	min-height: 30px
}

.mac-row:hover {
	background: rgb(25 23 20 / .5);
	border-color: rgb(255 155 0 / .2)
}

.mac-icon-container {
	width: 16px;
	height: 16px;
	margin-right: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 2px;
	background: rgb(0 0 0 / .2);
	padding: 2px;
	background-size: 14px;
	background-repeat: no-repeat;
	background-position: center
}

.mac-icon-user {
	background-image: url(../img/user.png)
}

.mac-icon-email {
	background-image: url(../img/email.png)
}

.mac-icon-password {
	background-image: url(../img/padlock.png)
}

.mac-icon-date {
	background-image: url(../img/date.png)
}

.mac-icon-vip {
	background-image: url(../img/star.png)
}

.mac-icon-ip {
	background-image: url(../img/ip.png)
}

.mac-icon-online-status {
	background-image: url(../img/wi-fi.png)
}

.mac-label {
	font-size: 12px;
	color: #b0aea3;
	width: 100px;
	min-width: 100px;
	font-weight: 500;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis
}

.mac-value {
	font-size: 11px;
	color: #d7d6d1;
	flex: 1;
	display: flex;
	justify-content: space-between;
	align-items: center
}

.mac-value.offline,
.mac-value.online {
	color: #ff3030;
	font-weight: 500;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	margin-left: 0;
	width: auto
}

.mac-value.online {
	color: #6bff00
}

.mac-value.offline::before,
.mac-value.online::before {
	content: '';
	display: inline-block;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	margin-right: 3px
}

.mac-value.online::before {
	background: #6bff00;
	box-shadow: 0 0 5px #6bff00
}

.mac-value.offline::before {
	background: #ff3030;
	box-shadow: 0 0 5px #ff3030
}

.mac-value.vip {
	color: #ffb505;
	font-weight: 500
}

.mac-btn {
	font-size: 10px;
	padding: 2px 8px;
	background: linear-gradient(to bottom, rgb(255 155 0 / .2), rgb(100 70 30 / .4));
	color: #ffb505;
	border: 1px solid rgb(255 155 0 / .3);
	border-radius: 3px;
	text-decoration: none;
	margin-left: auto;
	font-weight: 500;
	text-transform: uppercase;
	transition: all 0.2s ease
}

.mac-btn:hover {
	background: linear-gradient(to bottom, rgb(255 155 0 / .3), rgb(100 70 30 / .5));
	transform: translateY(-1px);
	box-shadow: 0 2px 3px rgb(0 0 0 / .2)
}

.character-block {
	display: flex;
	flex-direction: column;
	background: url(../img/bg-h-content.jpg) no-repeat;
	background-size: cover;
	background-position: center bottom;
	box-shadow: 0 10px 20px -5px #000;
	margin-bottom: 5px
}

.characters {
	display: flex;
	flex-direction: column;
	padding: 8px 5px
}

.character {
	position: relative;
	margin-bottom: 10px;
	border-radius: 4px;
	background: rgb(20 20 20 / .4);
	border: 1px solid rgb(70 60 40 / .3);
	transition: all 0.3s ease;
	padding: 12px;
	display: flex
}

.character:hover {
	border-color: rgb(255 155 0 / .2);
	box-shadow: 0 4px 8px rgb(0 0 0 / .3);
	background: rgb(25 23 20 / .5)
}

.character-left {
	width: 100px;
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-right: 15px
}

.char-name {
	text-align: center;
	padding: 0 2px;
	margin-bottom: 5px;
	font-weight: 600;
	font-size: 13px;
	color: #ff9b00;
	text-shadow: 0 1px 2px rgb(0 0 0 / .5)
}

.char-ava {
	width: 80px;
	height: 80px;
	margin-bottom: 2px
}

.char-ava .img-container {
	background: radial-gradient(circle, rgb(80 60 30 / .2), rgb(20 20 20 / .8));
	border-radius: 5px;
	padding: 3px;
	border: 1px solid rgb(255 155 0 / .15)
}

.char-status {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 2px 6px;
	border-radius: 10px;
	font-size: 10px;
	margin-bottom: 6px;
	background: rgb(0 0 0 / .2)
}

.char-status .icon-container {
	width: 8px;
	height: 8px;
	display: inline-block;
	border-radius: 50%;
	margin-right: 4px
}

.char-status .icon-container.online {
	background: #6bff00;
	box-shadow: 0 0 5px #6bff00
}

.char-status .icon-container.offline {
	background: #ff3030;
	box-shadow: 0 0 5px #ff3030
}

.char-level {
	width: 90px;
	background: rgb(0 0 0 / .25);
	border-radius: 3px;
	padding: 3px 0;
	margin-bottom: 5px;
	font-size: 11px;
	text-align: center
}

.char-level span {
	color: #ffb505;
	font-weight: 600
}

.character-right {
	flex: 1;
	display: flex;
	flex-direction: column
}

.char-stats {
	display: flex;
	flex-direction: column;
	background: rgb(0 0 0 / .2);
	border-radius: 4px;
	padding: 8px 12px;
	margin-bottom: 8px;
	height: fit-content
}

.char-stat {
	display: flex;
	align-items: center;
	margin-bottom: 5px;
	position: relative
}

.char-stat-name {
	width: 70px;
	font-size: 11px;
	font-weight: 500;
	display: flex;
	align-items: center
}

.char-stat-name.strength {
	color: #86fb0a
}

.char-stat-name.agility {
	color: #c147f5
}

.char-stat-name.vitality {
	color: #ff2241
}

.char-stat-name.energy {
	color: #fffc00
}

.char-stat-name.command {
	color: #41a7ff
}

.char-bar {
	flex: 1;
	height: 5px;
	background-color: rgb(30 30 30 / .6);
	border-radius: 3px;
	overflow: hidden;
	margin: 0 8px
}

.char-bar span {
	display: block;
	height: 100%;
	border-radius: 3px
}

.char-stat.strength .char-bar span,
.char-stat-name.strength+.char-bar span {
	background: linear-gradient(90deg, #4a8c00, #86fb0a)
}

.char-stat.agility .char-bar span,
.char-stat-name.agility+.char-bar span {
	background: linear-gradient(90deg, #8a11b9, #c147f5)
}

.char-stat.vitality .char-bar span,
.char-stat-name.vitality+.char-bar span {
	background: linear-gradient(90deg, #c20022, #ff2241)
}

.char-stat.energy .char-bar span,
.char-stat-name.energy+.char-bar span {
	background: linear-gradient(90deg, #b3b000, #fffc00)
}

.char-stat.command .char-bar span,
.char-stat-name.command+.char-bar span {
	background: linear-gradient(90deg, #006ec2, #41a7ff)
}

.char-number {
	width: 40px;
	text-align: right;
	font-size: 11px;
	color: #ffb505;
	font-weight: 500
}

.char-map {
	background: rgb(0 0 0 / .2);
	border-radius: 3px;
	padding: 5px 8px;
	font-size: 11px;
	margin-bottom: 8px
}

.char-map span {
	color: #ffb505;
	font-weight: 500;
	margin-right: 4px
}

.char-zen {
	background: rgb(0 0 0 / .25);
	border-radius: 3px;
	padding: 3px 0;
	margin-bottom: 5px;
	font-size: 11px;
	position: relative;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	cursor: help;
	text-align: center;
	width: 90px
}

.char-zen span {
	color: #ffb505;
	font-weight: 500;
	margin-right: 2px
}

.char-zen:hover::after {
	content: attr(title);
	position: absolute;
	background: rgb(0 0 0 / .9);
	padding: 5px 8px;
	border-radius: 3px;
	top: -30px;
	left: 50%;
	transform: translateX(-50%);
	white-space: nowrap;
	z-index: 10;
	box-shadow: 0 2px 5px rgb(0 0 0 / .5);
	color: #ffb505
}

.character-actions {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 6px
}

.character-action-btn {
	text-align: center;
	padding: 5px 4px;
	font-size: 10px;
	background: rgb(35 30 25 / .6);
	border: 1px solid rgb(70 60 40 / .4);
	border-radius: 3px;
	color: #d2bf989c;
	transition: all 0.2s ease;
	text-decoration: none
}

.character-action-btn:hover {
	background: rgb(50 40 30 / .7);
	color: #ffb505;
	transform: translateY(-2px)
}

.charOptions-flex {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	align-items: center;
	gap: 5px;
	padding-top: 20px;
	padding-bottom: 20px;
	background: url(../img/bg-h-content.jpg) no-repeat;
	background-size: cover;
	background-position: center bottom;
	box-shadow: 0 10px 20px -5px #000;
	height: min-content
}

.charOptions-block {
	display: flex;
	align-items: center;
	justify-content: center;
	align-content: center;
	flex-wrap: wrap;
	width: 282px;
	height: 70px;
	background: url(../img/option-bg.jpg) center no-repeat;
	background-size: cover;
	color: #ffb505;
	font-style: italic;
	position: relative;
	text-align: center
}

.charOptions-block span {
	font-size: 11px;
	color: #c1c0b8
}

.charOptions-block:hover {
	filter: brightness(120%)
}

.charOptions-block p {
	width: 100%;
	text-align: center;
	font-weight: 700;
	font-size: 14px;
	margin-bottom: 5px;
	text-transform: uppercase
}

.modal {
	display: none;
	position: fixed;
	z-index: 150;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: rgb(0 0 0 / .95);
	justify-content: center;
	align-items: center
}

.modal-content {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	margin: 0 auto;
	display: flex;
	align-items: center;
	flex-direction: column;
	max-width: 600px;
	min-width: 350px;
	height: auto;
	background: url(../img/bg-h-content.jpg) no-repeat;
	background-size: cover;
	background-position: center bottom;
	box-shadow: 0 10px 20px -5px #000;
	padding: 30px 25px 40px;
	border-radius: 10px
}

.modal-title {
	display: flex;
	width: 100%;
	justify-content: center;
	margin-bottom: 10px;
	font-size: 16px
}

.modal .close-button {
	position: absolute;
	z-index: 150;
	top: 8px;
	right: 8px;
	cursor: pointer;
	display: block;
	font-size: 18px;
	color: #5d5d5d
}

.bottom-form {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: 20px
}

.forgot-link {
	color: #ccc;
	font-size: 12px;
	transition: color 0.3s
}

.forgot-link:hover {
	color: #fff
}

.register-link {
	margin-top: 20px;
	text-align: center;
	font-size: 13px;
	color: #ccc
}

.register-link a {
	color: #ff9b00;
	text-decoration: none;
	transition: color 0.3s
}

.register-link a:hover {
	color: #fff
}

#loading {
	background-image: url(../img/l_bg.png);
	border-radius: 0 0 4px 4px;
	color: #fff;
	display: none;
	position: fixed;
	top: 0;
	left: 48%;
	z-index: 1000;
	padding: 6px
}

.paypal-gateway-container {
	display: block
}

.paypal-gateway-logo {
	width: 100%;
	height: 68px;
	background: #fff9ec url(../img/paypal-logo-200-68.png) no-repeat top center;
	margin-bottom: 10px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px
}

.paypal-gateway-content {
	margin: 5px;
	padding: 10px;
	overflow: auto;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	background: linear-gradient(rgb(0 0 0 / 29%), rgb(0 0 0 / 31%)), url(../img/bg-h-content.jpg) no-repeat center / cover;
	border: 1px solid #b19a7521;
	border-radius: 2px
}

.paypal-gateway-content p {
	padding: 8px;
	color: #aaa;
	line-height: 1;
	vertical-align: top;
	font-size: 14px
}

.paypal-gateway-conversion-rate {
	margin: 0 auto;
	text-align: center;
	color: #000;
	font-size: 18px;
	padding: 10px 0
}

.paypal-gateway-form img { vertical-align: middle;
}

.paypal-gateway-form {
	width: 100%;
	margin: 0 auto;
	text-align: center
}

.paypal-gateway-form div {
	display: inline-block;
	padding: 3px 6px;
	color: #000;
	font-size: 18px
}

.paypal-gateway-continue {
	margin: 0 auto;
	text-align: center;
	margin-top: 5px
}

.package-title {
	background-color: #2E2E2E;
	border-radius: 2px;
	border: 2px solid #454545
}

.package-title span {
	font-size: 13px;
	color: #d2d2d0
}

.package-prices {
	display: flex;
	margin: -10px
}

.package-prices span {
	color: #23c746;
	font-size: 10px;
	width: 100%
}

.package-wcoin-total {
	font-size: 12px !important;
	color: #ffb505 !important
}

.package-prizes-total {
	font-size: 14px !important;
	color: #cdcdcd !important;
	padding: 5px !important
}

.package-prices sup {
	font-size: 8px;
	color: #FFF;
	background-color: #e34d4c;
	border-radius: 2px;
	padding: 1px;
	margin: 2px
}

.package-coin {
	display: flex;
	margin-top: 10px;
	margin: 0 auto;
	justify-content: center
}

.package-coin span {
	font-size: 12px
}

.package-tag {
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 2px 5px rgb(0 0 0 / .3)
}

.package-tag span {
	font-size: 11px;
	padding: 5px 18px;
	border-radius: 15px;
	white-space: nowrap;
	color: #eefdf2;
	background-color: #16752f
}

.paypal-gateway-continue button,
.paypal-gateway-continue a {
	display: inline-block;
	font-weight: 400;
	text-align: center;
	vertical-align: middle;
	user-select: none;
	border: 1px solid #fff0;
	padding: .375rem .75rem;
	font-size: 1rem;
	line-height: 1.5;
	border-radius: .25rem;
	transition: all 0.15s ease-in-out;
	cursor: pointer;
	text-decoration: none
}

.additional-info-container {
	width: 100%;
	padding: 0 10px;
	box-sizing: border-box
}

.medieval-style-panel {
	background: linear-gradient(rgb(0 0 0 / 29%), rgb(0 0 0 / 31%)), url(../img/bg-h-content.jpg) no-repeat center / cover;
	border: 1px solid #b19a7521;
	border-radius: 4px;
	padding: 25px;
	box-shadow: 0 2px 8px rgb(0 0 0 / .15)
}

.disclaimer-title {
	color: #ffb505;
	font-size: 14px;
	margin: 0 0 20px 0;
	padding: 0;
	font-weight: 600;
	display: flex;
	align-items: center
}

.disclaimer-title img {
	margin-right: 8px;
	vertical-align: middle
}

.info-item {
	display: flex;
	align-items: flex-start;
	margin: 10px 0;
	padding: 12px;
	background: #0e0e0e;
	border-radius: 3px;
	gap: 12px
}

.info-text {
	position: relative;
	padding-left: 15px;
	font-size: 12px;
	line-height: 1.5;
	color: #b0aea3
}

.info-text::before {
	content: "•";
	position: absolute;
	left: 0;
	color: #ffb505;
	font-size: inherit
}

.contact-details {
	margin-top: 8px;
	padding-left: 10px;
	font-size: 12px;
	color: #b0aea3
}

.important-note {
	padding: 10px;
	background: rgb(90 70 40 / .2);
	border-left: 3px solid #ffb505;
	display: flex;
	gap: 12px;
	align-items: center;
	font-size: 12px;
	color: #b0aea3
}

.important-note a {
	color: #ffb505;
	text-decoration: none;
	border-bottom: 1px dashed;
	transition: all 0.2s ease
}

.important-note a:hover {
	border-bottom-style: solid
}

.fa-info-circle {
	display: none
}

.col-sm-4 {
	position: relative;
	width: 100%;
	padding-right: 12px;
	padding-left: 12px
}

.col-xs-12 {
	width: 100%
}

.col-xs-1,
.col-xs-10,
.col-xs-11,
.col-xs-12,
.col-xs-2,
.col-xs-3,
.col-xs-4,
.col-xs-5,
.col-xs-6,
.col-xs-7,
.col-xs-8,
.col-xs-9 {
	float: left
}

.col-lg-1,
.col-lg-10,
.col-lg-11,
.col-lg-12,
.col-lg-2,
.col-lg-3,
.col-lg-4,
.col-lg-5,
.col-lg-6,
.col-lg-7,
.col-lg-8,
.col-lg-9,
.col-md-1,
.col-md-10,
.col-md-11,
.col-md-12,
.col-md-2,
.col-md-3,
.col-md-4,
.col-md-5,
.col-md-6,
.col-md-7,
.col-md-8,
.col-md-9,
.col-sm-1,
.col-sm-10,
.col-sm-11,
.col-sm-12,
.col-sm-2,
.col-sm-3,
.col-sm-4,
.col-sm-5,
.col-sm-6,
.col-sm-7,
.col-sm-8,
.col-sm-9,
.col-xs-1,
.col-xs-10,
.col-xs-11,
.col-xs-12,
.col-xs-2,
.col-xs-3,
.col-xs-4,
.col-xs-5,
.col-xs-6,
.col-xs-7,
.col-xs-8,
.col-xs-9 {
	position: relative;
	min-height: 1px;
	padding-right: 15px;
	padding-left: 12px
}

.panel-title {
	color: #666;
	font-size: 15px;
	border-bottom: 1px solid #e3e3e3;
	margin-bottom: 20px !important;
	font-weight: 700
}

.panel-body {
	padding: 15px
}

.row {
	margin-right: -15px;
	margin-left: -15px
}

.table {
	width: 100%;
	max-width: 100%;
	margin-bottom: 20px
}

.table>tbody>tr>td {
	border-top: 1px solid #fff0
}


::-webkit-scrollbar {
	width: 12px
}

::-webkit-scrollbar-track {
	background: #1e1e1e;
	border-radius: 10px
}

::-webkit-scrollbar-thumb {
	background: #ffb505;
	border-radius: 10px;
	border: 2px solid #1e1e1e
}

::-webkit-scrollbar-thumb:hover {
	background: #e6a000
}

html {
	scrollbar-width: thin;
	scrollbar-color: #ffb505 #1e1e1e
}

.f16 .flag {
	display: inline-block;
	height: 16px;
	width: 16px;
	vertical-align: text-top;
	line-height: 16px;
	background: url(../img/flags.png) no-repeat
}

.f16 ._African_Union {
	background-position: 0 -16px
}

.f16 ._Arab_League {
	background-position: 0 -32px
}

.f16 ._ASEAN {
	background-position: 0 -48px
}

.f16 ._CARICOM {
	background-position: 0 -64px
}

.f16 ._CIS {
	background-position: 0 -80px
}

.f16 ._Commonwealth {
	background-position: 0 -96px
}

.f16 ._England {
	background-position: 0 -112px
}

.f16 ._European_Union,
.f16 .eu {
	background-position: 0 -128px
}

.f16 ._Islamic_Conference {
	background-position: 0 -144px
}

.f16 ._Kosovo {
	background-position: 0 -160px
}

.f16 ._NATO {
	background-position: 0 -176px
}

.f16 ._Northern_Cyprus {
	background-position: 0 -192px
}

.f16 ._Northern_Ireland {
	background-position: 0 -208px
}

.f16 ._Olimpic_Movement {
	background-position: 0 -224px
}

.f16 ._OPEC {
	background-position: 0 -240px
}

.f16 ._Red_Cross {
	background-position: 0 -256px
}

.f16 ._Scotland {
	background-position: 0 -272px
}

.f16 ._Somaliland {
	background-position: 0 -288px
}

.f16 ._Tibet {
	background-position: 0 -304px
}

.f16 ._United_Nations {
	background-position: 0 -320px
}

.f16 ._Wales {
	background-position: 0 -336px
}

.f16 .ad {
	background-position: 0 -352px
}

.f16 .ae {
	background-position: 0 -368px
}

.f16 .af {
	background-position: 0 -384px
}

.f16 .ag {
	background-position: 0 -400px
}

.f16 .ai {
	background-position: 0 -416px
}

.f16 .al {
	background-position: 0 -432px
}

.f16 .am {
	background-position: 0 -448px
}

.f16 .ao {
	background-position: 0 -464px
}

.f16 .aq {
	background-position: 0 -480px
}

.f16 .ar {
	background-position: 0 -496px
}

.f16 .as {
	background-position: 0 -512px
}

.f16 .at {
	background-position: 0 -528px
}

.f16 .au {
	background-position: 0 -544px
}

.f16 .aw {
	background-position: 0 -560px
}

.f16 .ax {
	background-position: 0 -576px
}

.f16 .az {
	background-position: 0 -592px
}

.f16 .ba {
	background-position: 0 -608px
}

.f16 .bb {
	background-position: 0 -624px
}

.f16 .bd {
	background-position: 0 -640px
}

.f16 .be {
	background-position: 0 -656px
}

.f16 .bf {
	background-position: 0 -672px
}

.f16 .bg {
	background-position: 0 -688px
}

.f16 .bh {
	background-position: 0 -704px
}

.f16 .bi {
	background-position: 0 -720px
}

.f16 .bj {
	background-position: 0 -736px
}

.f16 .bm {
	background-position: 0 -752px
}

.f16 .bn {
	background-position: 0 -768px
}

.f16 .bo {
	background-position: 0 -784px
}

.f16 .br {
	background-position: 0 -800px
}

.f16 .bs {
	background-position: 0 -816px
}

.f16 .bt {
	background-position: 0 -832px
}

.f16 .bw {
	background-position: 0 -848px
}

.f16 .by {
	background-position: 0 -864px
}

.f16 .bz {
	background-position: 0 -880px
}

.f16 .ca {
	background-position: 0 -896px
}

.f16 .cg {
	background-position: 0 -912px
}

.f16 .cf {
	background-position: 0 -928px
}

.f16 .cd {
	background-position: 0 -944px
}

.f16 .ch {
	background-position: 0 -960px
}

.f16 .ci {
	background-position: 0 -976px
}

.f16 .ck {
	background-position: 0 -992px
}

.f16 .cl {
	background-position: 0 -1008px
}

.f16 .cm {
	background-position: 0 -1024px
}

.f16 .cn {
	background-position: 0 -1040px
}

.f16 .zh {
	background-position: 0 -1040px
}

.f16 .co {
	background-position: 0 -1056px
}

.f16 .cr {
	background-position: 0 -1072px
}

.f16 .cu {
	background-position: 0 -1088px
}

.f16 .cv {
	background-position: 0 -1104px
}

.f16 .cy {
	background-position: 0 -1120px
}

.f16 .cz {
	background-position: 0 -1136px
}

.f16 .de {
	background-position: 0 -1152px
}

.f16 .dj {
	background-position: 0 -1168px
}

.f16 .dk {
	background-position: 0 -1184px
}

.f16 .dm {
	background-position: 0 -1200px
}

.f16 .do {
	background-position: 0 -1216px
}

.f16 .dz {
	background-position: 0 -1232px
}

.f16 .ec {
	background-position: 0 -1248px
}

.f16 .ee {
	background-position: 0 -1264px
}

.f16 .eg {
	background-position: 0 -1280px
}

.f16 .eh {
	background-position: 0 -1296px
}

.f16 .er {
	background-position: 0 -1312px
}

.f16 .es {
	background-position: 0 -1328px
}

.f16 .et {
	background-position: 0 -1344px
}

.f16 .fi {
	background-position: 0 -1360px
}

.f16 .fj {
	background-position: 0 -1376px
}

.f16 .fm {
	background-position: 0 -1392px
}

.f16 .fo {
	background-position: 0 -1408px
}

.f16 .fr {
	background-position: 0 -1424px
}

.f16 .bl,
.f16 .cp,
.f16 .mf,
.f16 .yt {
	background-position: 0 -1424px
}

.f16 .ga {
	background-position: 0 -1440px
}

.f16 .gb {
	background-position: 0 -1456px
}

.f16 .sh {
	background-position: 0 -1456px
}

.f16 .gd {
	background-position: 0 -1472px
}

.f16 .ge {
	background-position: 0 -1488px
}

.f16 .gg {
	background-position: 0 -1504px
}

.f16 .gh {
	background-position: 0 -1520px
}

.f16 .gi {
	background-position: 0 -1536px
}

.f16 .gl {
	background-position: 0 -1552px
}

.f16 .gm {
	background-position: 0 -1568px
}

.f16 .gn {
	background-position: 0 -1584px
}

.f16 .gp {
	background-position: 0 -1600px
}

.f16 .gq {
	background-position: 0 -1616px
}

.f16 .gr {
	background-position: 0 -1632px
}

.f16 .gt {
	background-position: 0 -1648px
}

.f16 .gu {
	background-position: 0 -1664px
}

.f16 .gw {
	background-position: 0 -1680px
}

.f16 .gy {
	background-position: 0 -1696px
}

.f16 .hk {
	background-position: 0 -1712px
}

.f16 .hn {
	background-position: 0 -1728px
}

.f16 .hr {
	background-position: 0 -1744px
}

.f16 .ht {
	background-position: 0 -1760px
}

.f16 .hu {
	background-position: 0 -1776px
}

.f16 .id {
	background-position: 0 -1792px
}

.f16 .mc {
	background-position: 0 -1792px
}

.f16 .ie {
	background-position: 0 -1808px
}

.f16 .il {
	background-position: 0 -1824px
}

.f16 .im {
	background-position: 0 -1840px
}

.f16 .in {
	background-position: 0 -1856px
}

.f16 .iq {
	background-position: 0 -1872px
}

.f16 .ir {
	background-position: 0 -1888px
}

.f16 .is {
	background-position: 0 -1904px
}

.f16 .it {
	background-position: 0 -1920px
}

.f16 .je {
	background-position: 0 -1936px
}

.f16 .jm {
	background-position: 0 -1952px
}

.f16 .jo {
	background-position: 0 -1968px
}

.f16 .jp {
	background-position: 0 -1984px
}

.f16 .ke {
	background-position: 0 -2000px
}

.f16 .kg {
	background-position: 0 -2016px
}

.f16 .kh {
	background-position: 0 -2032px
}

.f16 .ki {
	background-position: 0 -2048px
}

.f16 .km {
	background-position: 0 -2064px
}

.f16 .kn {
	background-position: 0 -2080px
}

.f16 .kp {
	background-position: 0 -2096px
}

.f16 .kr {
	background-position: 0 -2112px
}

.f16 .kw {
	background-position: 0 -2128px
}

.f16 .ky {
	background-position: 0 -2144px
}

.f16 .kz {
	background-position: 0 -2160px
}

.f16 .la {
	background-position: 0 -2176px
}

.f16 .lb {
	background-position: 0 -2192px
}

.f16 .lc {
	background-position: 0 -2208px
}

.f16 .li {
	background-position: 0 -2224px
}

.f16 .lk {
	background-position: 0 -2240px
}

.f16 .lr {
	background-position: 0 -2256px
}

.f16 .ls {
	background-position: 0 -2272px
}

.f16 .lt {
	background-position: 0 -2288px
}

.f16 .lu {
	background-position: 0 -2304px
}

.f16 .lv {
	background-position: 0 -2320px
}

.f16 .ly {
	background-position: 0 -2336px
}

.f16 .ma {
	background-position: 0 -2352px
}

.f16 .md {
	background-position: 0 -2368px
}

.f16 .me {
	background-position: 0 -2384px
}

.f16 .mg {
	background-position: 0 -2400px
}

.f16 .mh {
	background-position: 0 -2416px
}

.f16 .mk {
	background-position: 0 -2432px
}

.f16 .ml {
	background-position: 0 -2448px
}

.f16 .mm {
	background-position: 0 -2464px
}

.f16 .mn {
	background-position: 0 -2480px
}

.f16 .mo {
	background-position: 0 -2496px
}

.f16 .mq {
	background-position: 0 -2512px
}

.f16 .mr {
	background-position: 0 -2528px
}

.f16 .ms {
	background-position: 0 -2544px
}

.f16 .mt {
	background-position: 0 -2560px
}

.f16 .mu {
	background-position: 0 -2576px
}

.f16 .mv {
	background-position: 0 -2592px
}

.f16 .mw {
	background-position: 0 -2608px
}

.f16 .mx {
	background-position: 0 -2624px
}

.f16 .my {
	background-position: 0 -2640px
}

.f16 .mz {
	background-position: 0 -2656px
}

.f16 .na {
	background-position: 0 -2672px
}

.f16 .nc {
	background-position: 0 -2688px
}

.f16 .ne {
	background-position: 0 -2704px
}

.f16 .ng {
	background-position: 0 -2720px
}

.f16 .ni {
	background-position: 0 -2736px
}

.f16 .nl {
	background-position: 0 -2752px
}

.f16 .bq {
	background-position: 0 -2752px
}

.f16 .no {
	background-position: 0 -2768px
}

.f16 .bv,
.f16 .nq,
.f16 .sj {
	background-position: 0 -2768px
}

.f16 .np {
	background-position: 0 -2784px
}

.f16 .nr {
	background-position: 0 -2800px
}

.f16 .nz {
	background-position: 0 -2816px
}

.f16 .om {
	background-position: 0 -2832px
}

.f16 .pa {
	background-position: 0 -2848px
}

.f16 .pe {
	background-position: 0 -2864px
}

.f16 .pf {
	background-position: 0 -2880px
}

.f16 .pg {
	background-position: 0 -2896px
}

.f16 .ph {
	background-position: 0 -2912px
}

.f16 .pk {
	background-position: 0 -2928px
}

.f16 .pl {
	background-position: 0 -2944px
}

.f16 .pr {
	background-position: 0 -2960px
}

.f16 .ps {
	background-position: 0 -2976px
}

.f16 .pt {
	background-position: 0 -2992px
}

.f16 .pw {
	background-position: 0 -3008px
}

.f16 .py {
	background-position: 0 -3024px
}

.f16 .qa {
	background-position: 0 -3040px
}

.f16 .re {
	background-position: 0 -3056px
}

.f16 .ro {
	background-position: 0 -3072px
}

.f16 .rs {
	background-position: 0 -3088px
}

.f16 .ru {
	background-position: 0 -3104px
}

.f16 .rw {
	background-position: 0 -3120px
}

.f16 .sa {
	background-position: 0 -3136px
}

.f16 .sb {
	background-position: 0 -3152px
}

.f16 .sc {
	background-position: 0 -3168px
}

.f16 .sd {
	background-position: 0 -3184px
}

.f16 .se {
	background-position: 0 -3200px
}

.f16 .sg {
	background-position: 0 -3216px
}

.f16 .si {
	background-position: 0 -3232px
}

.f16 .sk {
	background-position: 0 -3248px
}

.f16 .sl {
	background-position: 0 -3264px
}

.f16 .sm {
	background-position: 0 -3280px
}

.f16 .sn {
	background-position: 0 -3296px
}

.f16 .so {
	background-position: 0 -3312px
}

.f16 .sr {
	background-position: 0 -3328px
}

.f16 .st {
	background-position: 0 -3344px
}

.f16 .sv {
	background-position: 0 -3360px
}

.f16 .sy {
	background-position: 0 -3376px
}

.f16 .sz {
	background-position: 0 -3392px
}

.f16 .tc {
	background-position: 0 -3408px
}

.f16 .td {
	background-position: 0 -3424px
}

.f16 .tg {
	background-position: 0 -3440px
}

.f16 .th {
	background-position: 0 -3456px
}

.f16 .tj {
	background-position: 0 -3472px
}

.f16 .tl {
	background-position: 0 -3488px
}

.f16 .tm {
	background-position: 0 -3504px
}

.f16 .tl {
	background-position: 0 -3488px
}

.f16 .tm {
	background-position: 0 -3504px
}

.f16 .tn {
	background-position: 0 -3520px
}

.f16 .to {
	background-position: 0 -3536px
}

.f16 .tr {
	background-position: 0 -3552px
}

.f16 .tt {
	background-position: 0 -3568px
}

.f16 .tv {
	background-position: 0 -3584px
}

.f16 .tw {
	background-position: 0 -3600px
}

.f16 .tz {
	background-position: 0 -3616px
}

.f16 .ua {
	background-position: 0 -3632px;
	background-position: 0 -3664px
}

.f16 .us {
	background-position: 0 -3648px
}

.f16 .uy {
	background-position: 0 -3680px
}

.f16 .uz {
	background-position: 0 -3696px
}

.f16 .va {
	background-position: 0 -3712px
}

.f16 .vc {
	background-position: 0 -3728px
}

.f16 .ve {
	background-position: 0 -3744px
}

.f16 .vg {
	background-position: 0 -3760px
}

.f16 .vn {
	background-position: 0 -3776px
}

.f16 .vi {
	background-position: 0 -3792px
}

.f16 .vu {
	background-position: 0 -3808px
}

.f16 .ws {
	background-position: 0 -3824px
}

.f16 .ye {
	background-position: 0 -3840px
}

.f16 .za {
	background-position: 0 -3856px
}

.f16 .zm {
	background-position: 0 -3872px
}

.f16 .zw {
	background-position: 0 -3888px
}

.f16 .sx {
	background-position: 0 -3904px
}

.f16 .cw {
	background-position: 0 -3920px
}

.f16 .ss {
	background-position: 0 -3936px
}

.f16 .nu {
	background-position: 0 -3952px
}

.item_size_12 {
	font-size: 12px
}

.item_font_family {
	font-family: tahoma
}

.item_white {
	color: #FFF
}

.item_light_green {
	color: lime
}

.item_light_blue {
	color: #80B2FF
}

.item_light_blue_2 {
	color: #36F
}

.item_blue {
	color: #06F
}

.item_pink {
	color: #FF1493
}

.item_yellow {
	color: #FADE09
}

.item_yellow_2 {
	color: #FC0
}

.item_red {
	color: red
}

.item_dark_red {
	color: maroon
}

.item_dark_red_background {
	background-color: maroon
}

.item_purple {
	color: purple
}

.item_socket {
	color: #B266FF
}

.item_grey {
	color: gray
}

.item_yellow_title {
	color: #FFCC19
}

.item_luck {
	color: #80B2FF
}

.item_exe_title {
	color: green
}

.item_socket_title {
	color: #B266FF
}

.item_socket_exe_title {
	color: #7401DF
}

.item_ancient_title {
	color: #01DF01
}

.item_ancient_background {
	background-color: blue
}

#inventoryc {
	background-image: url(../img/inventoryc_black.png);
	width: 395px;
	height: 319px;
	text-align: center;
	display: inline-block;
	position: relative
}

#inventoryc>img {
	position: absolute;
	top: 90px;
	left: 145px;
	border-radius: 50%;
	border: 3px solid #24314e;
	width: 110px;
	height: 110px
}

#inventoryc>div {
	position: absolute;
	background-repeat: no-repeat;
	background-position: center center
}

#in_weapon {
	width: 90px;
	height: 136px;
	bottom: 0;
	left: -6px;
	background-size: contain !important
}

#in_shield {
	width: 60px;
	height: 136px;
	bottom: 0;
	right: 8px;
	background-size: contain !important
}

#in_helm {
	width: 68px;
	height: 68px;
	top: 2px;
	left: 66px
}

#in_armor {
	width: 72px;
	height: 110px;
	top: 72px;
	left: 40px;
	background-size: contain !important
}

#in_pants {
	width: 68px;
	height: 68px;
	bottom: 8px;
	left: 82px;
	background-size: contain !important
}

#in_gloves {
	width: 68px;
	height: 68px;
	top: 116px;
	right: 54px;
	background-size: contain !important
}

#in_boots {
	width: 68px;
	height: 68px;
	bottom: 8px;
	right: 82px;
	background-size: contain !important
}

#in_wings {
	width: 138px;
	height: 102px;
	top: 8px;
	right: -2px;
	background-size: contain !important
}

#in_zoo {
	width: 42px;
	height: 42px;
	top: 15px;
	left: 10px;
	background-size: contain !important
}

#in_pendant {
	width: 38px;
	height: 38px;
	top: 20px;
	right: 136px;
	background-size: contain !important
}

#in_ring1 {
	width: 38px;
	height: 38px;
	bottom: 92px;
	left: 96px;
	background-size: contain !important
}

#in_ring2 {
	width: 38px;
	height: 38px;
	bottom: 92px;
	right: 96px;
	background-size: contain !important
}

#in_pentagram {
	width: 64px;
	height: 64px;
	bottom: 8px;
	right: 169px;
	background-size: contain !important
}

#in_ear1 {
	width: 32px;
	height: 32px;
	top: 72px;
	left: 0;
	background-size: contain !important
}

#in_ear2 {
	width: 32px;
	height: 32px;
	top: 72px;
	left: 115px;
	background-size: contain !important
}

.cworkshop {
	display: table;
	margin: 50px auto
}

.cworkshop .inventoryy {
	background-image: url(../img/inv.png);
	height: 610px;
	width: 311px;
	display: block
}

.cworkshop .item {
	position: absolute;
	margin-top: 10px;
	margin-left: 3px
}

.cworkshop .item>div {
	cursor: pointer;
	border: solid 2px #fff0
}

div[id*="item-slot-occupied-"] img {
	background-color: rgb(31 31 31 / .73)
}

div[id*="item-slot-occupied-"] img:hover {
	background-color: rgb(154 60 45 / .43)
}

.cworkshop .item>div.selected {
	background-color: rgb(154 60 45 / .43);
	border: solid 2px rgb(154 60 45 / .44)
}

.cworkshop .item .hover_inv:hover {
	background-color: rgb(154 60 45 / .43);
	border: solid 2px rgb(154 60 45 / .44)
}

.cworkshop .title {
	margin-top: 13px;
	text-align: center;
	margin-bottom: 30px
}

#tooltip {
	position: absolute;
	z-index: 11001;
	border: 1px solid #111;
	background-color: #221f28;
	padding: 5px;
	opacity: .9;
	font: normal 10px Tahoma, Helvetica, sans-serif;
	text-align: center;
	color: #fff
}

#tooltip h3,
#tooltip div {
	margin: 0
}

.waretitle {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	background: #610000;
	font-style: oblique;
	font-weight: 700;
	color: #fff
}

.ticket-header-container {
	display: flex;
	justify-content: space-between;
	align-items: center;
	background-color: rgb(18 18 18 / .8);
	padding: 15px;
	border-radius: 3px;
	border: 1px solid rgb(31 31 31 / 60%)
}

.ticket-header-info {
	flex: 1
}

.ticket-header-description {
	font-size: 12px;
	color: #b0aea3;
	margin: 0
}

.ticket-header-actions {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	margin-left: 20px
}

.ticket {
	font-size: 12px;
	background: #fff0;
	border: none;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	width: 90%;
	margin: 10px
}

.ticket th {
	padding: 12px 10px 12px 0;
	background: #352d1f26
}

.ticket th:first-child {
	text-align: left;
	padding-left: 10px
}

.ticket tr:first-child th:first-child {
	-moz-border-radius-topleft: 3px;
	-webkit-border-top-left-radius: 3px;
	border-top-left-radius: 3px
}

.ticket tr:first-child th:last-child {
	-moz-border-radius-topright: 3px;
	-webkit-border-top-right-radius: 3px;
	border-top-right-radius: 3px
}

.ticket tr {
	text-align: center;
	padding-left: 20px
}

.ticket td:first-child {
	text-align: left;
	padding-left: 20px;
	border-left: 0
}

.ticket td {
	padding: 10px;
	background: #f0f0f00d;
	transition: all 0.3s
}

.ticket tr.even td {
	background: #f6f6f6;
	background: -webkit-gradient(linear, left top, left bottom, from(#f8f8f8), to(#f6f6f6));
	background: -moz-linear-gradient(top, #f8f8f8, #f6f6f6)
}

.ticket tr:last-child td {
	border-bottom: 0
}

.ticket tr:last-child td:first-child {
	-moz-border-radius-bottomleft: 3px;
	-webkit-border-bottom-left-radius: 3px;
	border-bottom-left-radius: 3px
}

.ticket tr:last-child td:last-child {
	-moz-border-radius-bottomright: 3px;
	-webkit-border-bottom-right-radius: 3px;
	border-bottom-right-radius: 3px
}

.ticket tr:hover td {
	background: #121212
}

.btn-base {
	display: flex;
	align-items: center;
	justify-content: center;
	background-image: url(../img/button.png);
	background-repeat: no-repeat;
	background-size: cover;
	color: #facf96e3;
	text-transform: uppercase;
	position: relative;
	border-radius: 3px;
	text-shadow: 1px 1px 1px rgb(255 165 0 / 60%), -1px -1px 1px rgb(0 0 0 / 60%)
}


.logout {
	display: inline-block !important;
	align-items: center;
	justify-content: center;
	background-image: url(../img/button.png);
	background-repeat: no-repeat;
	background-size: cover;
	color: #facf96e3;
	text-transform: uppercase;
	position: relative;
	border-radius: 3px;
	margin-top: 15px;
	text-shadow: 1px 1px 1px rgb(255 165 0 / 60%), -1px -1px 1px rgb(0 0 0 / 60%)
}



.btn-small {
	display: flex;
	align-items: center;
	justify-content: center;
	background-image: url(../img/button-small.png);
	background-repeat: no-repeat;
	background-size: cover;
	color: #dba583;
	font-size: 10px;
	text-transform: uppercase;
	box-shadow: 0 5px 18px 0 #ff7f0059;
	padding: 5px 15px;
	border-radius: 3px;
	text-shadow: 1px 1px 1px rgb(255 165 0 / 60%), -1px -1px 1px rgb(0 0 0 / 60%)
}

.btn-base .axe {
	position: absolute;
	display: block;
	top: -5px;
	height: 36px;
	width: 15px;
	background-image: url(../img/axe.png);
	background-repeat: no-repeat;
	background-size: cover
}

.btn-base .axe-left {
	left: -5px;
	transform: scaleX(-1)
}

.btn-base .axe-right {
	right: -5px
}

.btn-base .text-styled {
	color: #facf96e3;
	-webkit-background-clip: text;
	background-clip: text;
	text-shadow: 1px 1px 1px rgb(255 165 0 / 60%), -1px -1px 1px rgb(0 0 0 / 60%);
	font-weight: 700;
	letter-spacing: 1px
}

.btn-xxs {
	width: 70px;
	height: 20px;
	padding: 5px;
	font-size: 11px;
	box-shadow: 0 3px 12px 0 #ff7f0033
}

.btn-xs {
	width: 86px;
	height: 28px;
	padding: 10px;
	font-size: 12px;
	box-shadow: 0 3px 12px 0 #ff7f0033
}

.btn-sm {
	width: 92px;
	height: 30px;
	padding: 12px;
	font-size: 12px;
	box-shadow: 0 3px 12px 0 #ff7f0033
}

.btn-md {
	height: 35px;
	padding: 14px;
	font-size: 12px;
	box-shadow: 0 4px 15px 0 #ff7f0040;
	letter-spacing: 1px
}

.btn-lg {
	width: 120px;
	height: 35px;
	padding: 15px;
	font-size: 13px;
	box-shadow: 0 4px 16px 0 #ff7f0045;
	letter-spacing: 1px
}

.btn-xl {
	width: 145px;
	height: 35px;
	padding: 16px;
	font-size: 13px;
	box-shadow: 0 5px 18px 0 #ff7f0059
}

.btn-xxl {
	width: 170px;
	height: 35px;
	padding: 16px;
	font-size: 13px;
	box-shadow: 0 5px 18px 0 #ff7f0059
}

.btn-base .active,
.btn-base:hover {
	box-shadow: 0 5px 18px 0 #ff7f0059
}

.btn-brightness:hover {
	filter: brightness(120%)
}

.table-data {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0 1px;
	border: 1px solid rgb(60 60 60 / .2);
	border-radius: 4px;
	overflow: hidden;
	box-shadow: 0 2px 8px rgb(0 0 0 / .15);
	table-layout: fixed;
	margin: 5px
}


.table-data th {
	background-color: rgb(20 20 20 / .95);
	color: #8c8580;
	font-weight: 400;
	padding: 10px 10px;
	font-size: 12px;
	vertical-align: middle;
	text-align: center
}

.table-data td {
	padding: 8px 3px;
	background-color: #352d1f26;
	font-size: 12px;
	vertical-align: middle;
	white-space: normal;
	word-wrap: break-word
}

.table-data td:first-child {
	text-align: left
}

.table-data.dual-column td {
	text-align: left
}

.table-data:not(.dual-column) td:not(:first-child) {
	text-align: center
}

.table-data tr:nth-child(even) td {
	background-color: #f0f0f00d
}

.table-data .header-primary th {
	background-color: rgb(20 20 20 / .95)
}

.table-data .header-secondary th {
	background-color: rgb(30 30 30 / .95)
}

.td-col-auto {
	width: auto
}

.td-col-80 {
	width: 80%
}

.td-col-60 {
	width: 60%
}

.td-col-40 {
	width: 40%
}

.td-col-30 {
	width: 30%
}

.td-col-25 {
	width: 25%
}

.td-col-20 {
	width: 20%
}

.td-col-15 {
	width: 15%
}

.td-col-10 {
	width: 10%
}

.td-col-5 {
	width: 8%;
	min-width: 50px
}

.table-data tr {
	transition: all 0.3s ease;
	position: relative
}

.table-data tr:hover td {
	background-color: rgb(22 22 22 / .95) !important
}

.table-data tr:hover td:first-child {
	box-shadow: inset 3px 0 0 rgb(255 155 0 / .6)
}

.table-data a,
.highlight-link a {
	color: #ffb505 !important;
	text-decoration: none;
	position: relative;
	transition: all 0.2s ease;
	padding-bottom: 2px
}

.table-data a:hover,
.highlight-link a:hover {
	color: #ffb505 !important
}

.table-data a::after,
.highlight-link a::after {
	content: '';
	position: absolute;
	width: 0;
	height: 1px;
	bottom: 0;
	left: 0;
	background-color: #ffb505;
	transition: width 0.3s ease
}

.table-data a:hover::after,
.highlight-link a:hover::after {
	width: 100%
}

.cell-left {
	text-align: left !important
}

.table-data td .img-container {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%
}

.stats-table td:first-child {
	text-align: center
}

.stats-table a {
	color: #ffb505 !important
}

.stats-table a:hover {
	color: #ffd280 !important
}

.logs-page-table {
	font-size: 11px
}

.logs-page-table td,
.logs-page-table th,
.logs-page-table a {
	font-size: 11px
}

.wh_items {
	width: 261px;
	margin: 2px auto;
	padding-top: 6px;
	padding-left: 3px;
	height: 490px
}

.warehouse-container {
	display: flex;
	justify-content: center;
	gap: 20px;
	margin: 0 auto
}

.warehouse-container .wh_items {
	width: 261px;
	margin: 0;
	padding-top: 6px;
	padding-left: 3px;
	height: 490px;
	float: none
}

.warehouse-buttons-container {
	display: flex;
	justify-content: center;
	gap: 20px;
	width: 100%
}

.warehouse-left-buttons,
.warehouse-right-buttons {
	display: flex;
	justify-content: center;
	width: 261px
}

.square {
	cursor: pointer;
	position: absolute;
	opacity: .8
}

.square:hover {
	padding: 1px;
	opacity: 1
}

.square img {
	width: 100%;
	height: 100%
}

#price_with_tax {
	display: contents
}

#price_with_tax[style*="display: block"] {
	display: contents !important
}

.table-data td span a {
	position: relative;
	display: inline;
	text-decoration: none
}

.table-data td span a::after {
	content: none
}

.table-data td span a:hover::after {
	transform: none
}

#item_filter_overlay {
	position: absolute;
	height: 400px;
	width: 300px;
	display: none;
	z-index: 9999
}

#item_filter {
	width: 300px;
	height: auto;
	max-height: 710px;
	padding-bottom: 2px;
	background: #161616;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	box-shadow: 0 0 4px rgb(0 0 0 / .7);
	-webkit-box-shadow: 0 0 4px rgb(0 0 0 / .7);
	-moz-box-shadow: 0 0 4px rgb(0 0 0 / .7)
}

.item_filter_content {
	height: auto;
	max-height: 600px;
	width: 285px;
	margin: 15px;
	overflow: auto;
	padding: 5px
}

.modal-header2 {
	background: url(../img/hd-bg.png);
	padding: 18px 18px 14px 18px;
	border-bottom: 1px solid #CCC;
	border-top-left-radius: 5px;
	-moz-border-radius-topleft: 5px;
	-webkit-border-top-left-radius: 5px;
	border-top-right-radius: 5px;
	-moz-border-radius-topright: 5px;
	-webkit-border-top-right-radius: 5px;
	cursor: move
}

.modal-header2 h2 {
	color: #444;
	font-size: 2em;
	font-weight: 700;
	margin-bottom: 3px;
	text-shadow: 1px 1px 0 rgb(255 255 255 / .5)
}

.close {
	position: absolute;
	top: 12px;
	right: 12px;
	display: block;
	width: 14px;
	height: 14px;
	background: url(../img/close.png);
	z-index: 2;
	cursor: pointer
}

.item_filter_content .search-query {
	display: flex;
	align-items: center;
	width: 100%;
	gap: 8px
}

.item_filter_content .search-input {
	flex-grow: 1;
	height: 28px;
	background-color: #00000080;
	border: 1px solid #fff0;
	border-radius: 2px;
	color: #989690;
	padding: 0 10px
}

.item_filter_content .search-btn {
	padding: 5px 15px;
	height: 28px;
	white-space: nowrap
}

.filter-actions {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 10px;
	margin-top: 20px
}

.filter-actions button {
	flex: 1
}

#helm {
	position: absolute;
	left: 73px;
	top: 58px;
	width: 56px;
	height: 66px
}

#wings {
	position: absolute;
	left: 272px;
	top: 59px;
	width: 127px;
	height: 110px
}

#pendant {
	position: absolute;
	left: 233px;
	top: 80px;
	width: 29px;
	height: 29px
}

#sword {
	position: absolute;
	left: 6px;
	top: 242px;
	width: 69px;
	height: 129px
}

#armor {
	position: absolute;
	left: 40px;
	top: 138px;
	width: 82px;
	height: 98px
}

#shield {
	position: absolute;
	left: 330px;
	top: 242px;
	width: 69px;
	height: 129px
}

#gloves {
	position: absolute;
	left: 271px;
	top: 178px;
	width: 85px;
	height: 55px
}

#pants {
	position: absolute;
	left: 89px;
	top: 297px;
	width: 58px;
	height: 74px
}

#ring_left {
	position: absolute;
	left: 102px;
	top: 252px;
	width: 29px;
	height: 29px
}

#ring_right {
	position: absolute;
	left: 272px;
	top: 252px;
	width: 29px;
	height: 29px
}

#boots {
	position: absolute;
	left: 258px;
	top: 297px;
	width: 58px;
	height: 74px
}

.price-limits-info {
	font-size: 10px;
	margin-top: 3px;
	margin-left: 0;
	padding: 3px 2px;
	background-color: rgb(0 0 0 / 20%);
	border-radius: 3px;
	display: inline-block
}

.price-label {
	color: #b0aea3
}

#min_price_display {
	color: #ffb505
}

.price-invalid {
	border-color: #800c0c !important;
	box-shadow: 0 0 5px rgb(243 18 18 / 50%)
}

.tax-hidden-row {
	display: none
}

.tax-table-toggle {
	text-align: center;
	margin-top: 8px;
	padding-top: 6px;
	border-top: 1px solid rgb(255 255 255 / .08)
}

.tax-toggle-btn {
	display: inline-block;
	color: #b0aea3;
	font-size: 11px;
	padding: 3px 8px;
	border-radius: 3px;
	background-color: rgb(0 0 0 / .15);
	text-decoration: none;
	transition: all 0.2s
}

.tax-toggle-btn:hover {
	color: #ffb505;
	background-color: rgb(0 0 0 / .3)
}

.tax-toggle-btn.active .toggle-more {
	display: none
}

.tax-toggle-btn:not(.active) .toggle-less {
	display: none
}

.title-main {
	position: relative;
	color: #b0aea3;
	font-size: 13px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 1px;
	padding-bottom: 10px;
	text-align: center;
	display: inline-block
}

.title-main::after {
	content: '';
	position: absolute;
	bottom: 3px;
	left: 0;
	width: 100%;
	height: 1px;
	background: linear-gradient(90deg, transparent 0%, rgb(255 181 5 / .3) 10%, rgb(255 181 5 / .8) 50%, rgb(255 181 5 / .3) 90%, transparent 100%)
}

.title-wrapper {
	text-align: center;
	width: 100%
}

.title-main.title-left {
	text-align: left;
	display: inline-block;
	align-self: flex-start
}

.title-main.title-left::after {
	background: linear-gradient(90deg, rgb(255 181 5 / .8) 0%, rgb(255 181 5 / .4) 70%, transparent 100%)
}

.section-header {
	display: flex;
	align-items: center;
	padding-bottom: 8px;
	margin-bottom: 10px;
	border-bottom: 1px solid rgb(255 181 5 / .4)
}

.section-header .icon {
	width: 16px;
	height: 16px;
	margin-right: 8px;
	background-color: currentColor;
	mask-repeat: no-repeat;
	mask-position: center;
	mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: center;
	-webkit-mask-size: contain
}

.section-header span {
	font-size: 13px;
	font-weight: 500
}

.section-header.info-header {
	color: #5aabff;
	border-bottom-color: rgb(90 171 255 / .4)
}

.section-header.warning-header {
	color: #f39c12;
	border-bottom-color: rgb(243 156 18 / .4)
}

.section-header.danger-header {
	color: #e74c3c;
	border-bottom-color: rgb(231 76 60 / .4)
}

.section-header.success-header {
	color: #2ecc71;
	border-bottom-color: rgb(46 204 113 / .4)
}

.info-header .icon {
	mask-image: url(../img/exclamation-circle.svg);
	-webkit-mask-image: url(../img/exclamation-circle.svg)
}

.warning-header .icon {
	mask-image: url(../img/exclamation-triangle.svg);
	-webkit-mask-image: url(../img/exclamation-triangle.svg)
}

.success-header .icon {
	mask-image: url(../img/exclamation-circle.svg);
	-webkit-mask-image: url(../img/exclamation-circle.svg)
}

.danger-header .icon {
	mask-image: url(../img/exclamation-triangle.svg);
	-webkit-mask-image: url(../img/exclamation-triangle.svg)
}

.align-self-start {
	align-self: flex-start;
	width: 100%
}

.ref-reward-dropdown {
	position: relative;
	display: inline-block
}

.ref-reward-dropdown-content {
	display: none;
	position: relative;
	background-color: #1d1d1d;
	min-width: 150px;
	overflow: hidden;
	box-shadow: 0 8px 16px 0 rgb(0 0 0 / .2);
	z-index: 2500;
	overflow-y: auto;
	max-height: 500px;
	border: 1px solid #ffb505;
	margin-top: 10px
}

.ref-reward-dropdown-content a.dropdown-link {
	color: #ffb505;
	padding: 6px 8px;
	text-decoration: none;
	display: block;
	border-bottom: 1px solid #333;
	background: none;
	font-weight: 400;
	transition: none;
	box-shadow: none;
	border-radius: 0;
	text-shadow: none;
	outline: none
}

.ref-reward-dropdown-content a.simple-hover:hover {
	background-color: #2a2a2a;
	color: #b0aea3;
	border-bottom: 1px solid #333;
	text-decoration: none;
	transform: none;
	box-shadow: none;
	text-shadow: none
}

.ref-reward-dropdown-content a.simple-hover:hover::before,
.ref-reward-dropdown-content a.simple-hover:hover::after {
	display: none;
	content: none;
	opacity: 0
}

.ref-reward-dropdown:hover .ref-reward-dropdown-content {
	display: block
}

.reward-row {
	min-height: 100px
}

.reward-status {
	color: #7cfc00
}

.claimed-status {
	color: tomato
}

.no-rewards {
	color: #b0aea3;
	font-style: italic
}

.text-center {
	text-align: center !important
}

.chance-badge {
	display: inline-block;
	background: linear-gradient(to right, rgb(23 205 40 / .15) 0%, rgb(23 205 40 / .15) 50%, rgb(205 23 23 / .15) 50%, rgb(205 23 23 / .15) 100%);
	color: rgb(176 174 163 / .9);
	padding: 2px 6px;
	border-radius: 2px;
	font-size: 10px;
	font-weight: 500;
	border-left: 1px solid rgb(23 205 40 / .3);
	border-right: 1px solid rgb(205 23 23 / .3);
	letter-spacing: .3px
}

.chance-badge:hover {
	color: rgb(255 181 5 / .9)
}

.droplist-container {
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 20px
}

.droplist-header-controls {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 30px;
	width: 100%
}

.droplist-select-wrapper {
	flex: 0 0 auto;
	width: 60%
}

.search-wrapper {
	flex: 0 0 auto;
	width: 35%
}

.droplist-select {
	position: relative;
	width: 100%;
	z-index: 100
}

.droplist-btn {
	width: 100%;
	padding: 0 15px;
	background-color: rgb(18 18 18 / .75);
	color: #b0aea3;
	border: 1px solid rgb(70 70 70 / .4);
	border-radius: 3px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	cursor: pointer;
	transition: all 0.25s ease;
	box-shadow: 0 2px 4px rgb(0 0 0 / .15);
	font-size: 12px;
	font-weight: 500;
	height: 35px
}

.droplist-btn:hover {
	background-color: rgb(25 25 25 / .85);
	border-color: rgb(80 80 80 / .6);
	box-shadow: 0 3px 6px rgb(0 0 0 / .2)
}

.droplist-btn:focus {
	outline: none;
	box-shadow: 0 0 0 2px rgb(255 181 5 / .2)
}

.droplist-btn i {
	transition: transform 0.3s ease, color 0.2s;
	font-size: 10px;
	color: rgb(124 118 113 / .8);
	margin-left: 8px
}

.droplist-select.active .droplist-btn i {
	transform: rotate(180deg);
	color: rgb(255 181 5 / .8)
}

.droplist-content {
	position: absolute;
	top: 110%;
	left: 0;
	width: 100%;
	max-height: 500px;
	overflow-y: scroll !important;
	background-color: rgb(18 18 18 / .95);
	border: 1px solid rgb(70 70 70 / .4);
	border-radius: 3px;
	box-shadow: 0 4px 12px rgb(0 0 0 / .25);
	z-index: 1000;
	display: none;
	opacity: 0;
	transform: translateY(-5px);
	transition: opacity 0.25s, transform 0.25s
}

.droplist-select.active .droplist-content {
	display: block;
	opacity: 1;
	transform: translateY(0)
}

.drop-category-header {
	background: linear-gradient(to right, rgb(40 40 40 / .7), rgb(30 30 30 / .7));
	padding: 9px 14px;
	cursor: pointer;
	font-size: 11px;
	font-weight: 600;
	color: rgb(160 160 160 / .9);
	border-bottom: 1px solid rgb(60 60 60 / .4);
	transition: all 0.2s;
	text-transform: uppercase;
	letter-spacing: .5px;
	display: flex;
	align-items: center;
	justify-content: space-between
}

.drop-category-header::after {
	content: '\f107';
	font-family: 'FontAwesome';
	font-size: 10px;
	color: rgb(124 118 113 / .7);
	transform: rotate(-90deg);
	transition: transform 0.3s ease, color 0.2s
}

.drop-category-header:hover {
	color: #fff;
	background: linear-gradient(to right, rgb(45 45 45 / .8), rgb(35 35 35 / .8))
}

.drop-category-header.active::after {
	transform: rotate(0deg);
	color: rgb(255 181 5 / .6)
}

.drop-item-list {
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.3s ease-out
}

.drop-item-list .drop-item {
	opacity: 1 !important;
	visibility: visible !important
}

.drop-item-list::-webkit-scrollbar {
	width: 5px
}

.drop-item-list::-webkit-scrollbar-track {
	background: rgb(18 18 18 / .3)
}

.drop-item-list::-webkit-scrollbar-thumb {
	background-color: rgb(255 155 0 / .3);
	border-radius: 3px
}

.drop-item-list::-webkit-scrollbar-thumb:hover {
	background-color: rgb(255 155 0 / .5)
}

.drop-category-header.active+.drop-item-list {
	max-height: 1000px;
	overflow-y: auto
}

.drop-item {
	padding: 8px 15px 8px 20px;
	cursor: pointer;
	font-size: 11px;
	color: rgb(176 174 163 / .9);
	background-color: rgb(22 22 22 / .7);
	border-bottom: 1px solid rgb(40 40 40 / .3);
	transition: all 0.2s;
	position: relative
}

.drop-item:hover {
	background-color: rgb(30 30 30 / .85);
	color: rgb(255 181 5 / .9);
	padding-left: 24px
}

.drop-item:hover::before {
	content: '';
	position: absolute;
	left: 10px;
	top: 50%;
	transform: translateY(-50%);
	width: 3px;
	height: 3px;
	border-radius: 50%;
	background-color: rgb(255 181 5 / .7)
}

.drop-result {
	width: 100%;
	background-color: rgb(22 22 22 / .6);
	border: 1px solid rgb(50 50 50 / .4);
	border-radius: 3px;
	overflow: hidden;
	box-shadow: 0 3px 8px rgb(0 0 0 / .2);
	opacity: 0;
	transform: translateY(10px);
	transition: opacity 0.3s, transform 0.3s;
	backdrop-filter: blur(5px);
	-webkit-backdrop-filter: blur(5px)
}

.drop-result.visible {
	opacity: 1;
	transform: translateY(0)
}

.drop-details-header {
	margin: 18px 15px 16px;
	padding-bottom: 10px;
	border-bottom: 1px solid rgb(40 40 40 / .5);
	position: relative
}

.drop-details-header::after {
	content: '';
	position: absolute;
	bottom: -1px;
	left: 0;
	width: 40px;
	height: 2px;
	background: rgb(255 181 5 / .7)
}

.drop-details-header h3 {
	margin: 0;
	padding: 0;
	color: #ffb505;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: .3px;
	display: flex;
	align-items: baseline
}

.drop-details-header h3 span {
	color: rgb(176 174 163 / .7);
	font-size: 11px;
	font-weight: 400;
	margin-left: 8px;
	background: rgb(40 40 40 / .3);
	padding: 2px 6px;
	border-radius: 2px
}

.drop-quantity {
	margin-top: 10px;
	font-size: 10px;
	color: rgb(176 174 163 / .75);
	display: inline-flex;
	align-items: center;
	letter-spacing: .3px;
	position: relative;
	padding-left: 12px;
	transition: all 0.2s ease
}

.drop-quantity::before {
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 4px;
	height: 4px;
	background-color: rgb(255 181 5 / .6);
	border-radius: 50%
}

.drop-item-detail {
	opacity: 0;
	transition: opacity 0.3s ease
}

.drop-item-detail[style*="display: block"] {
	opacity: 1
}

.drop-table-container {
	margin-top: 5px;
	padding: 0 15px 15px;
	background: #fff0
}

.droplist-content::-webkit-scrollbar {
	width: 4px
}

.droplist-content::-webkit-scrollbar-track {
	background: rgb(18 18 18 / .3)
}

.droplist-content::-webkit-scrollbar-thumb {
	background-color: rgb(70 70 70 / .7);
	border-radius: 2px
}

.droplist-content::-webkit-scrollbar-thumb:hover {
	background-color: rgb(90 90 90 / .8)
}

.option-yes {
	color: rgb(23 205 40 / .9)
}

.option-no {
	color: rgb(205 23 23 / .9)
}

.drop-detail-notice {
	padding: 10px 15px;
	margin: 10px 0;
	background-color: rgb(40 40 40 / .5);
	color: rgb(200 200 200 / .8);
	border-left: 3px solid rgb(255 181 5 / .7);
	font-size: 11px;
	text-align: center;
	border-radius: 3px
}

.search-minimal {
	display: flex;
	align-items: center;
	background-color: rgb(18 18 18 / .75);
	border: 1px solid rgb(70 70 70 / .4);
	border-radius: 3px;
	height: 35px;
	width: 100%;
	box-shadow: 0 2px 4px rgb(0 0 0 / .15);
	transition: all 0.25s ease
}

.search-minimal:hover {
	background-color: rgb(25 25 25 / .85);
	border-color: rgb(80 80 80 / .6);
	box-shadow: 0 3px 6px rgb(0 0 0 / .2)
}

.search-minimal input {
	border: none;
	background: #fff0;
	height: 100%;
	padding: 0 10px;
	color: #b0aea3;
	font-size: 12px;
	width: calc(100% - 40px);
	outline: none;
	font-weight: 500
}

.search-minimal input::placeholder {
	color: #666;
	font-size: 11px
}

.search-separator {
	width: 1px;
	height: 16px;
	background-color: #333
}

.search-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 100%;
	color: #888;
	font-size: 12px;
	cursor: pointer
}

.search-icon:hover {
	color: #ffb505
}

.search-and-results-container {
	position: relative;
	width: 100%;
	margin-bottom: 15px
}

.search-results {
	width: 80%;
	margin: 0 auto 15px;
	background: rgb(19 19 20 / 50%);
	border: 1px solid #1f1f1f;
	border-radius: 3px
}

.search-results-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 8px 12px;
	border-bottom: 1px solid #232323fc;
	background: rgb(19 19 20 / 49%)
}

.search-results-header h3 {
	color: #ffb505;
	font-size: 14px;
	margin: 0;
	font-weight: 500
}

.search-results-close {
	color: #ffb505;
	cursor: pointer;
	transition: color 0.2s
}

.search-results-close:hover {
	color: #ffc233
}

#search-results-container {
	max-height: 350px;
	overflow-y: auto
}

.search-result-item {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 8px 10px;
	background-color: rgb(18 18 18 / .7);
	border: 1px solid rgb(40 40 40 / .3);
	border-radius: 3px;
	margin: 5px 10px;
	transition: all 0.2s ease
}

.search-result-item:hover {
	background-color: rgb(30 30 30 / .9);
	border-color: rgb(255 181 5 / .3)
}

.search-item-info {
	display: flex;
	flex-direction: column
}

.search-item-name {
	font-weight: 500;
	color: #ffb505;
	font-size: 13px;
	margin-bottom: 2px
}

.search-item-location {
	color: #b0aea3;
	font-size: 11px
}

.search-item-view-btn {
	padding: 3px 8px;
	font-size: 11px;
	color: #ffb505;
	background-color: rgb(20 20 20 / .5);
	border: 1px solid rgb(255 181 5 / .2);
	border-radius: 3px;
	transition: all 0.2s ease
}

.search-item-view-btn:hover {
	background-color: rgb(255 181 5 / .2)
}

.no-results {
	text-align: center;
	padding: 15px;
	color: #b0aea3;
	font-size: 12px;
	background-color: rgb(20 20 20 / .5);
	border-radius: 3px;
	margin: 5px 10px
}

.bonus {
	color: #ffb505;
	font-size: 10px;
	vertical-align: super;
	margin-left: 2px
}

#loading {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 9999;
	backdrop-filter: blur(3px)
}

.loading-content {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center
}

.loading-knight {
	width: 70px;
	height: auto;
	image-rendering: pixelated;
	filter: drop-shadow(0 0 10px rgb(255 0 0 / .5))
}

.loading-text {
	margin-top: 15px;
	display: flex;
	flex-direction: column;
	align-items: center
}

.loading-label {
	color: #ffb505;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 1px;
	text-shadow: 0 0 8px rgb(255 181 5 / .7)
}

.loading-dots {
	display: flex;
	margin-top: 5px
}

.loading-dots span {
	color: #ffb505;
	font-size: 24px;
	line-height: 10px;
	animation: dotsAnimation 1.2s infinite;
	text-shadow: 0 0 10px rgb(255 181 5 / .8)
}

.loading-dots span:nth-child(2) {
	animation-delay: 0.4s
}

.loading-dots span:nth-child(3) {
	animation-delay: 0.8s
}

@keyframes dotsAnimation {
	0% {
		opacity: 0
	}

	50% {
		opacity: 1
	}

	100% {
		opacity: 0
	}
}

#ajax-loading {
	display: none;
	position: absolute;
	background-color: rgb(0 0 0 / .6);
	padding: 8px;
	border-radius: 4px;
	z-index: 9990;
	text-align: center
}

#ajax-loading img {
	width: 20px;
	height: 20px;
	vertical-align: middle
}

.rules-container {
	font-family: 'Lunasima', sans-serif;
	color: #b0aea3;
	line-height: 1.5;
	max-width: 100%;
	margin: 0;
	padding: 0
}

.rules-header {
	margin-bottom: 20px;
	border-bottom: 1px solid #282828;
	padding-bottom: 15px;
	text-align: center
}

.rules-intro {
	font-size: 12px;
	line-height: 1.5;
	margin-bottom: 15px;
	text-align: justify
}

.rules-section {
	margin-bottom: 15px;
	padding-bottom: 10px;
	border-bottom: 1px solid #282828
}

.rules-section h2 {
	color: #ff9b00;
	font-size: 14px;
	margin-bottom: 10px;
	padding-bottom: 5px;
	text-transform: uppercase;
	letter-spacing: .5px;
	font-weight: 500
}

.rule-item {
	margin-bottom: 8px;
	padding-left: 10px;
	border-left: 2px solid #282828
}

.rule-item p {
	margin: 0;
	padding: 3px 0;
	font-size: 12px;
	text-align: justify
}

.item_yellow_2 {
	color: #ff9b00
}

.rules-header h1 {
	color: #ff9b00;
	font-size: 16px;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: .5px;
	margin-bottom: 10px
}

.page-title-glow {
	color: #ff9b00;
	text-shadow: 0 0 5px rgb(255 155 0 / .5)
}

.tab-cards {
	display: flex;
	justify-content: center;
	gap: 15px;
	margin-bottom: 20px
}

.tab-card {
	position: relative;
	width: 140px;
	height: 90px;
	border-radius: 6px;
	overflow: hidden;
	cursor: pointer;
	box-shadow: 0 2px 5px rgb(0 0 0 / .4);
	transition: all 0.2s ease
}

.tab-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 5px 12px rgb(0 0 0 / .5)
}

.tab-card.active {
	box-shadow: 0 0 0 2px rgb(255 155 0 / .5), 0 4px 10px rgb(0 0 0 / .4)
}

.card-image {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-size: cover;
	background-position: center;
	transition: all 0.3s ease
}

.tab-card:hover .card-image {
	transform: scale(1.08)
}

.card-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(to bottom, rgb(10 10 10 / .3) 0%, rgb(10 10 10 / .6) 50%, rgb(0 0 0 / .85) 100%);
	z-index: 1;
	transition: all 0.3s ease
}

.tab-card.active .card-overlay {
	background: linear-gradient(to bottom, rgb(30 20 10 / .4) 0%, rgb(40 25 10 / .7) 50%, rgb(50 30 10 / .9) 100%)
}

.tab-card:hover .card-overlay {
	background: linear-gradient(to bottom, rgb(20 20 20 / .4) 0%, rgb(20 20 20 / .7) 50%, rgb(10 10 10 / .9) 100%)
}

.card-content {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	padding: 10px 8px;
	z-index: 2;
	text-align: center;
	transform: translateY(0);
	transition: all 0.3s ease
}

.tab-card:hover .card-content {
	transform: translateY(-2px)
}

.card-content span {
	color: #c07204;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .5px;
	text-transform: uppercase;
	text-shadow: 0 1px 2px rgb(0 0 0 / .8);
	transition: all 0.3s ease;
	display: block
}

.tab-card.active .card-content span {
	color: #ffb54d
}

.tab-card:hover .card-content span {
	color: #ffb54d
}

.tab-content {
	display: none;
	animation-name: fadeIn;
	animation-duration: 0.3s;
	animation-fill-mode: both
}

.tab-content.active {
	display: block
}

@keyframes fadeIn {
	0% {
		opacity: 0;
		transform: translateY(5px)
	}

	100% {
		opacity: 1;
		transform: translateY(0)
	}
}

.tab-container {
	background: rgb(18 18 18 / .6);
	padding: 15px;
	box-shadow: 0 3px 10px rgb(0 0 0 / .3);
	border: 1px solid rgb(50 50 50 / .3);
	margin-top: 5px
}

.tab-container .table-data {
	margin: 10px 0;
	width: 100%
}

.tab-container .title-main {
	margin-bottom: 12px;
	margin-top: 20px !important
}

.tab-container .title-main:first-child {
	margin-top: 0 !important
}

.ms-container {
	width: 100%;
	max-width: 360px;
	margin: 10px;
	padding: 20px;
	background: linear-gradient(#111112, #111112), url(../img/bg-h-content.jpg) no-repeat center / cover;
	border-radius: 10px;
	box-shadow: 0 6px 18px rgb(0 0 0 / .4)
}

.ms-header {
	text-align: center;
	margin-bottom: 20px
}

.ms-header h2 {
	font-size: 20px;
	font-weight: 700;
	color: #f39c12;
	text-transform: uppercase
}

.ms-header p {
	font-size: 13px;
	color: #aaa;
	margin-top: 10px
}

.delivery-time {
	background-color: #333;
	color: #dfded8;
	font-size: 12px;
	padding: 8px;
	margin-top: 15px;
	border-radius: 5px;
	text-align: center;
	width: 70%;
	margin-left: auto;
	margin-right: auto
}

.ms-package {
	display: flex;
	flex-direction: column;
	gap: 8px
}

.ms-platform-button {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	padding: 10px 20px;
	background: #33333370;
	border-radius: 5px;
	color: #cfcfcb;
	font-size: 14px;
	font-weight: 700;
	border: none;
	cursor: pointer;
	transition: background 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease
}

.ms-platform-button img {
	height: 24px;
	width: 24px;
	margin-right: 15px
}

.ms-platform-button:hover {
	background: #252525;
	transform: scale(1.05);
	box-shadow: 0 4px 10px rgb(0 0 0 / .2)
}

.ms-platform-button:active {
	background: rgb(100 100 100 / .9);
	transform: scale(.98);
	box-shadow: 0 2px 5px rgb(0 0 0 / .15)
}

.ms-platform-image-container {
	width: 100%;
	margin-top: 15px;
	display: none;
	text-align: center
}

.ms-platform-image {
	height: auto;
	border-radius: 8px;
	box-shadow: 0 4px 15px rgb(0 0 0 / .3);
	background: #00000057;
	width: 180px
}

.ms-platform-scope {
	margin-top: 8px;
	padding: 6px 12px;
	border-radius: 30px;
	display: inline-block;
	font-size: 11px;
	color: #fff
}

.brazil {
	background: rgb(46 204 113 / .8)
}

.international {
	background: rgb(52 152 219 / .8)
}

.highlighted-item {
	position: relative;
	background: linear-gradient(135deg, rgb(60 30 100 / .7) 0%, rgb(90 40 150 / .7) 40%, rgb(150 100 255 / .9) 50%, rgb(90 40 150 / .7) 60%, rgb(60 30 100 / .7) 100%);
	background-size: 200% 100%;
	animation: highlight-shine 3s infinite linear;
	box-shadow: inset 0 0 15px rgb(150 100 255 / .3), 0 0 3px rgb(150 100 255 / .2);
	transition: all 0.3s ease;
	border-left: 2px solid rgb(150 100 255 / .5);
	border-right: 2px solid rgb(150 100 255 / .5)
}

@keyframes highlight-shine {
	0% {
		background-position: -200% 0
	}

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

.highlighted-item:hover {
	background: linear-gradient(135deg, rgb(70 40 120 / .8) 0%, rgb(100 50 170 / .8) 100%);
	background-size: 100% 100%;
	box-shadow: inset 0 0 30px rgb(160 110 255 / .5), 0 0 8px rgb(160 110 255 / .4)
}

.highlighted-item td:last-child {
	color: #d4baff;
	font-weight: 700;
	text-shadow: 0 0 4px rgb(150 100 255 / .5);
	transition: all 0.3s ease
}

.highlighted-item:hover td:last-child {
	color: #e5d4ff;
	text-shadow: 0 0 6px rgb(150 100 255 / .7)
}

.highlighted-item td:nth-child(2) a {
	color: #d4baff !important;
	font-weight: 700;
	transition: all 0.3s ease
}

.highlighted-item:hover td:nth-child(2) a {
	color: #e5d4ff !important
}

.nav-arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	cursor: pointer;
	color: #b0aea3;
	font-size: 14px;
	font-weight: 400;
	opacity: .7;
	transition: all 0.3s ease;
	z-index: 10
}

.nav-arrow:hover {
	color: #ff9b00;
	opacity: 1;
	transform: translateY(-50%) scale(1.05)
}

.ranking-nav-prev,
.events-nav-prev {
	left: 25px
}

.ranking-nav-next,
.events-nav-next {
	right: 25px
}

.ranking-container {
	position: relative;
	overflow: hidden
}

.ranking-slides {
	display: flex;
	transition: transform 0.3s ease
}

.ranking-slide {
	min-width: 100%;
	flex-shrink: 0
}

.events-container {
	position: relative;
	overflow: hidden
}

.events-slides {
	display: flex;
	transition: transform 0.3s ease
}

.events-slide {
	min-width: 100%;
	flex-shrink: 0
}

#lattest_items {
	padding: 15px 15px 10px 15px;
	background: #fff0;
	border-radius: 0;
	border: none;
	box-shadow: none;
	margin-top: 0
}

#lattest_items .market-list,
#lattest_items .market-items-container {
	margin: 0;
	padding: 0;
	max-width: 290px;
	width: 100%
}

#lattest_items .market-header-text {
	display: block;
	font-size: 10px;
	color: rgb(176 174 163 / .7);
	text-align: center;
	font-weight: 400;
	letter-spacing: .3px;
	margin-bottom: 15px;
	opacity: .8
}

#lattest_items .i_entry,
#lattest_items .market-items-container .i_entry {
	display: block;
	padding: 0;
	margin: 0 0 6px 0;
	background: #fff0;
	border: none;
	border-radius: 0;
	transition: none;
	cursor: default;
	min-height: auto;
	position: relative
}

#lattest_items .i_entry:last-child,
#lattest_items .market-items-container .i_entry:last-child {
	margin-bottom: 8px
}

#lattest_items .i_entry .i_name,
#lattest_items .market-items-container .i_entry .i_name {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 8px 12px;
	margin: 0;
	background: rgb(0 0 0 / .2);
	border: none;
	border-radius: 4px;
	transition: all 0.2s ease;
	cursor: pointer;
	min-height: 26px;
	text-decoration: none;
	color: #e0e0e0;
	max-width: 100%;
	width: 100%;
	box-sizing: border-box
}

#lattest_items .i_entry .i_name:hover,
#lattest_items .market-items-container .i_entry .i_name:hover {
	background: rgb(0 0 0 / .35);
	transform: translateX(2px);
	color: #fff
}

#lattest_items .i_entry .i_name .item-name,
#lattest_items .market-items-container .i_entry .i_name .item-name {
	flex: 1;
	font-size: 11px;
	font-weight: 400;
	color: inherit;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	line-height: 1.3;
	letter-spacing: .1px;
	margin-right: 10px;
	max-width: 170px;
	min-width: 0
}

#lattest_items .i_entry .i_price,
#lattest_items .market-items-container .i_entry .i_price {
	font-size: 9px;
	font-weight: 600;
	color: #ffb505;
	white-space: nowrap;
	background: linear-gradient(135deg, rgb(255 181 5 / .12) 0%, rgb(255 181 5 / .08) 100%);
	padding: 3px 8px;
	border-radius: 9px;
	border: 1px solid rgb(255 181 5 / .25);
	min-width: 70px;
	max-width: 95px;
	text-align: center;
	text-shadow: 0 1px 2px rgb(0 0 0 / .3);
	transition: all 0.2s ease;
	flex-shrink: 0;
	overflow: hidden;
	text-overflow: ellipsis
}

#lattest_items .i_entry .i_name:hover .i_price,
#lattest_items .market-items-container .i_entry .i_name:hover .i_price {
	background: linear-gradient(135deg, rgb(255 181 5 / .18) 0%, rgb(255 181 5 / .12) 100%);
	border-color: rgb(255 181 5 / .35);
	color: #ffcd33
}

#lattest_items .view-more-container {
	margin: 8px 0 0 0;
	padding: 8px 0 5px;
	border-top: 1px solid rgb(255 255 255 / .08);
	text-align: center
}

#lattest_items .view-more-link {
	color: #b0aea3;
	font-size: 11px;
	text-decoration: none;
	cursor: pointer;
	display: inline-block;
	padding: 4px 10px;
	border-radius: 3px;
	background: rgb(0 0 0 / .15);
	border: none;
	transition: all 0.2s ease
}

#lattest_items .view-more-link:hover {
	background: rgb(0 0 0 / .25)
}

#lattest_items .i_entry.highlighted-item .i_name,
#lattest_items .market-items-container .i_entry.highlighted-item .i_name {
	position: relative;
	background: linear-gradient(135deg, rgb(60 30 100 / .85) 0%, rgb(90 40 150 / .85) 40%, rgb(150 100 255 / .95) 50%, rgb(90 40 150 / .85) 60%, rgb(60 30 100 / .85) 100%);
	background-size: 200% 100%;
	animation: sidebar-highlight-shine 3s infinite linear;
	box-shadow: inset 0 0 15px rgb(150 100 255 / .4), 0 0 6px rgb(150 100 255 / .3);
	border: 1px solid rgb(150 100 255 / .6);
	color: #fff
}

#lattest_items .i_entry.highlighted-item .i_name .item-name {
	text-shadow: 2px 2px 4px rgb(0 0 0 / .8), 1px 1px 2px rgb(0 0 0 / .9), 0 0 3px rgb(0 0 0 / .7);
	font-weight: 600 !important;
	color: #ffffff !important
}

#lattest_items .i_entry.highlighted-item .i_name .item-exc {
	text-shadow: 2px 2px 4px rgb(0 0 0 / .8), 1px 1px 2px rgb(0 0 0 / .9), 0 0 3px rgb(0 0 0 / .7);
	font-weight: 500 !important;
	color: #ffeb3b !important
}

#lattest_items .i_entry.highlighted-item .i_name .item-level,
#lattest_items .i_entry.highlighted-item .i_name .item-ancient,
#lattest_items .i_entry.highlighted-item .i_name .item-socket {
	text-shadow: 2px 2px 4px rgb(0 0 0 / .8), 1px 1px 2px rgb(0 0 0 / .9), 0 0 3px rgb(0 0 0 / .7);
	font-weight: 500 !important;
	color: #e0e0e0 !important
}

@keyframes sidebar-highlight-shine {
	0% {
		background-position: -200% 0
	}

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

#lattest_items .i_entry.highlighted-item .i_name:hover,
#lattest_items .market-items-container .i_entry.highlighted-item .i_name:hover {
	background: linear-gradient(135deg, rgb(70 40 120 / .95) 0%, rgb(100 50 170 / .95) 100%);
	background-size: 100% 100%;
	box-shadow: inset 0 0 25px rgb(160 110 255 / .6), 0 0 10px rgb(160 110 255 / .5);
	transform: translateX(3px);
	color: #fff
}

#lattest_items .i_entry.highlighted-item .i_name .item-name,
#lattest_items .market-items-container .i_entry.highlighted-item .i_name .item-name {
	color: #fff;
	font-weight: 600;
	text-shadow: 1px 1px 2px rgb(0 0 0 / .8), 0 0 3px rgb(0 0 0 / .6), 0 0 6px rgb(150 100 255 / .4)
}

#lattest_items .i_entry.highlighted-item .i_name:hover .item-name,
#lattest_items .market-items-container .i_entry.highlighted-item .i_name:hover .item-name {
	color: #fff;
	text-shadow: 1px 1px 3px rgb(0 0 0 / .9), 0 0 4px rgb(0 0 0 / .7), 0 0 8px rgb(150 100 255 / .5)
}

#lattest_items .i_entry.highlighted-item .i_price,
#lattest_items .market-items-container .i_entry.highlighted-item .i_price {
	color: #f0e7ff;
	background: linear-gradient(135deg, rgb(150 100 255 / .25) 0%, rgb(120 80 200 / .25) 100%);
	border: 1px solid rgb(150 100 255 / .5);
	text-shadow: 0 0 4px rgb(150 100 255 / .6);
	font-weight: 700
}

#lattest_items .i_entry.highlighted-item .i_name:hover .i_price,
#lattest_items .market-items-container .i_entry.highlighted-item .i_name:hover .i_price {
	color: #fff;
	background: linear-gradient(135deg, rgb(160 110 255 / .35) 0%, rgb(130 90 210 / .35) 100%);
	border-color: rgb(160 110 255 / .7);
	text-shadow: 0 0 6px rgb(150 100 255 / .8)
}

#pagination ul,
.pagination-list {
	list-style: none;
	padding: 0;
	margin: 0
}

#pagination {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 10px;
	margin-top: 10px
}

#pagination li,
#pagination ul {
	align-items: center;
	display: flex;
	gap: 10px
}

#pagination ul {
	justify-content: center
}

#pagination a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	background: 0 0;
	color: #7c7671;
	font-size: 12px;
	text-decoration: none
}

#pagination a:hover {
	color: #b7b6b6;
	box-shadow: 0 10px 10px 0 #fff0
}

#pagination a.on {
	background: #1c1b1b;
	color: #fff;
	border-radius: 3px
}

#pagination a#back,
#pagination a#forward,
#pagination a#next,
#pagination a#prev {
	position: relative;
	font-size: 0
}

#pagination a#back,
#pagination a#forward {
	display: none !important
}

#pagination a#back::before,
#pagination a#forward::before,
#pagination a#next::before,
#pagination a#prev::before {
	content: "";
	display: block;
	width: 6px;
	height: 10px;
	background-image: url(../img/arrow_1.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	opacity: .35
}

#pagination a#back::before,
#pagination a#prev::before {
	transform: scaleX(-1)
}

#pagination a#back:hover::before,
#pagination a#forward:hover::before,
#pagination a#next:hover::before,
#pagination a#prev:hover::before {
	opacity: 1
}

#pagination a:not(#back):not(#prev):not(#next):not(#forward) {
	min-width: 24px
}

.pagination-list {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	gap: 10px
}