/* montserrat-300 - cyrillic_cyrillic-ext_latin_latin-ext_vietnamese */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 300;
  src: url('https://cdn.tibiascape.com/fonts/montserrat-v31-cyrillic_cyrillic-ext_latin_latin-ext_vietnamese-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* montserrat-regular - cyrillic_cyrillic-ext_latin_latin-ext_vietnamese */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  src: url('https://cdn.tibiascape.com/fonts/montserrat-v31-cyrillic_cyrillic-ext_latin_latin-ext_vietnamese-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* montserrat-italic - cyrillic_cyrillic-ext_latin_latin-ext_vietnamese */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: italic;
  font-weight: 400;
  src: url('https://cdn.tibiascape.com/fonts/montserrat-v31-cyrillic_cyrillic-ext_latin_latin-ext_vietnamese-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* montserrat-500 - cyrillic_cyrillic-ext_latin_latin-ext_vietnamese */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 500;
  src: url('https://cdn.tibiascape.com/fonts/montserrat-v31-cyrillic_cyrillic-ext_latin_latin-ext_vietnamese-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* montserrat-600 - cyrillic_cyrillic-ext_latin_latin-ext_vietnamese */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 600;
  src: url('https://cdn.tibiascape.com/fonts/montserrat-v31-cyrillic_cyrillic-ext_latin_latin-ext_vietnamese-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* montserrat-700 - cyrillic_cyrillic-ext_latin_latin-ext_vietnamese */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 700;
  src: url('https://cdn.tibiascape.com/fonts/montserrat-v31-cyrillic_cyrillic-ext_latin_latin-ext_vietnamese-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* montserrat-800 - cyrillic_cyrillic-ext_latin_latin-ext_vietnamese */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 800;
  src: url('https://cdn.tibiascape.com/fonts/montserrat-v31-cyrillic_cyrillic-ext_latin_latin-ext_vietnamese-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

html {
	width: 100%;
	margin: 0px !important;
	padding: 0px !important;
	
}

@media only screen and (max-width: 1126px) {
	html {
		width: 100vw;
		/* width: 1226px; */
	}
}

body {
	margin: 0px;
	padding: 0px;
	background-color: #040b1f;
	font-size: 13px;
	font-family: "Montserrat";
	color: #bfbfbf;
  /* background-image: url("https://cdn.tibiascape.com/images/backgrounds/artwork.jpg"); */
	/* background-repeat: no-repeat; */
	/* background-position-x: center; */
	width: 100%;
	overflow-x: hidden;
}

a {
	color: #6bb2b2;
}

a:hover {
	color: #99ffff;
}

* {
	box-sizing: border-box;
}

h1 {
	color: #ffd919;
	font-weight: bold;
	font-size: 24px;
	text-transform: uppercase;
}

.wrapper {
	width: 1126px;
	margin: 0 auto;
	overflow-x: auto;
}

@media only screen and (max-width: 1126px) {
	.wrapper {
		width: 100%;
		padding: 48px 16px !important;
		overflow-x: auto;
	}
}

header {
	height: 108px;
	background-image: url("https://cdn.tibiascape.com/images/backgrounds/1-top-menu.png");
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 42px;
}

/* @media only screen and (max-width: 1126px) {
	header {
		display: none;
	}
} */

.mobile-only {
	display: none;
}

@media only screen and (max-width: 1126px) {
	.mobile-only {
		display: block;
	}

	.mobile-header {
		width: 100%;
		padding: 0 28px;
		display: flex;
		justify-content: end;
	}
}

.mobile-opened-menu {
	display: none;
	flex-direction: column;
	align-items: center;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: auto;
	padding: 24px 16px;
	background: black;
	text-align: center;
}

header button, header .header-link {
	background: transparent;
	border: 0;
	color: #fff;
	font-size: 18px;
	font-weight: bold;
	text-transform: uppercase;
	display: flex;
	align-items: center;
	gap: 8px;
	font-family: "Montserrat";
}

header .header-link {
    padding-block: 1px;
    padding-inline: 6px;
	text-decoration: none !important;
}

.mobile-header .header-link {
	margin-bottom: 18px;
	display: block;
	gap: normal;
}

.header-button-arrow {
	width: 22px;
	color: #808080;
}

.logo {
	user-select: none;
	transition-duration: 100ms;
}

.logo:hover {
	scale: 1.1;
}

#BackgroundArtwork {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 20px;
	height: 460px;
	background-image: url("https://cdn.tibiascape.com/images/backgrounds/2-header-background.jpg");
	background-size: 100%;
	background-position-x: center;
	background-repeat: no-repeat;
	background-attachment: fixed;
}

#ServerStatus {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 52px;
	background-image: url("https://cdn.tibiascape.com/images/backgrounds/3-header-background.jpg");
}


@media only screen and (max-width: 1126px) {
	.mobile-hide {
		display: none !important;
	}
}

.button-download-now {
	width: 170px;
	height: 49px;
	background-image: url("https://cdn.tibiascape.com/images/buttons/download-now.png");
	transition: 200ms;
}

.button-download-now:hover {
	background-image: url("https://cdn.tibiascape.com/images/buttons/download-now-hover.png");
}

.button-download {
	width: 142px;
	height: 26px;
	background-image: url("https://cdn.tibiascape.com/images/server-status/download.png");
	transition: 200ms;
}

.button-download:hover {
	background-image: url("https://cdn.tibiascape.com/images/server-status/download-hover.png");
}

.dropdown {
	position: relative;
}

.dropdown-content {
	visibility: hidden;
	position: absolute;
	/* background-color: #020714; */
	border: 1px solid #312e07;
	background-image: url("https://cdn.tibiascape.com/images/backgrounds/top-menu-dropdown.png");
	padding: 16px;
	min-width: 160px;
	top: 24px;
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.8);
	border-radius: 5px;
	z-index: 1;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.dropdown:hover button, .dropdown:hover .header-link {
	color:#ffd919;
}

.dropdown:hover .dropdown-content {
	visibility: visible;
}

.server-status-1 {
	margin-top: -80px;
	width: 293px;
	height: 85px;
	background-image: url("https://cdn.tibiascape.com/images/server-status/1.png");
	display: flex;
	align-items: center;
	gap: 6px;
}

@media only screen and (max-width: 1126px) {
	.server-status-1 {
		width: 307px;
		background-image: url("https://cdn.tibiascape.com/images/server-status/mobile.png") !important;
	}
}

.server-status-2 {
	margin-top: -80px;
	width: 292px;
	height: 85px;
	background-image: url("https://cdn.tibiascape.com/images/server-status/2.png");
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 4px;
}

.server-status-3 {
	margin-top: -80px;
	width: 292px;
	height: 85px;
	background-image: url("https://cdn.tibiascape.com/images/server-status/3.png");
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 4px;
}

.server-status-4 {
	margin-top: -80px;
	width: 295px;
	height: 85px;
	background-image: url("https://cdn.tibiascape.com/images/server-status/4.png");
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 4px;
}

.server-status-content {
	padding: 12px 26px;
}

.server-status-content-title {
	text-transform: uppercase;
	color: yellow;
	font-size: 16px;
	font-weight: bold;
}

.server-status-content-description {
	font-size: 13px;
	font-weight: bold;
	color: #e0e0e0;
}

.small-description {
	color: #bfbfbf;
}

footer {
	background-color: #050e29;
}

.footer-logos {
	padding: 48px 0;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 32px;
}

.footer-copryight {
	display: flex;
	align-items: center;
	justify-content: center;
	background-image: url("https://cdn.tibiascape.com/images/footer/5-footer.jpg");
	padding-top: 16px;
	height: 112px;
}

/* Homepage */
.vocations-wrapper {
	width: 100%;
	padding: 68px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 24px;
	overflow-x: auto;
}

@media only screen and (max-width: 1126px) {
	.vocations-wrapper {
		justify-content: center;
	}
}

.vocation-card {
	/* padding: 26px 42px; */
	background: rgb(2,0,36);
	background: linear-gradient(180deg, rgba(2,0,36,0) 0%, rgba(2,7,20,1) 100%);
	transition-duration: 666ms;
}

.vocation-card-sorcerer:hover {
	-webkit-box-shadow: 0px 0px 54px 3px rgba(76, 182, 255, 1);
	-moz-box-shadow: 0px 0px 54px 3px rgba(76, 182, 255, 1);
	box-shadow: 0px 0px 54px 3px rgba(76, 182, 255, 1);
}

.vocation-card-druid:hover {
	-webkit-box-shadow: 0px 0px 54px 3px rgba(106, 255, 76, 1);
	-moz-box-shadow: 0px 0px 54px 3px rgba(106, 255, 76, 1);
	box-shadow: 0px 0px 54px 3px rgba(106, 255, 76, 1);
}

.vocation-card-paladin:hover {
	-webkit-box-shadow: 0px 0px 54px 3px rgba(255, 169, 76, 1);
	-moz-box-shadow: 0px 0px 54px 3px rgba(255, 169, 76, 1);
	box-shadow: 0px 0px 54px 3px rgba(255, 169, 76, 1);
}

.vocation-card-knight:hover {
	-webkit-box-shadow: 0px 0px 54px 3px rgba(255, 76, 77, 1);
	-moz-box-shadow: 0px 0px 54px 3px rgba(255, 76, 77, 1);
	box-shadow: 0px 0px 54px 3px rgba(255, 76, 77, 1);
}

table {
	border-radius: 16px;
	overflow: hidden;
	/* overflow-x: auto; */
}

.TableContainer table {
	border-radius: 0;
}

.responsive-image {
	width: 100%;
}

.TableContainer .CaptionContainer .CaptionInnerContainer {
	background: #151b2e;
}

/* --- Contact Page Styles (Refactored Rules Page) --- */
.rules-container {
    max-width: 800px;
    margin: 50px auto;
    padding: 30px;
    background-color: rgba(4, 11, 31, 0.9); /* Semi-transparent to blend with background */
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.5);
    text-align: left;
}

.rules-container h1 {
    margin-bottom: 20px;
    font-size: 2.5em;
    color: #ffd919; /* Matches your h1 color */
    text-transform: uppercase;
    text-align: center;
}

.rules-container p {
    font-size: 1.2em;
    color: #bfbfbf; /* Matches your body text color */
    margin-bottom: 20px;
    line-height: 1.6;
}

.rules-container ol {
    padding-left: 20px;
    color: #bfbfbf;
}

.rules-container li {
    margin-bottom: 15px;
}

.rules-container li strong {
    color: #FFA500; /* Orange color for emphasis */
}

.rules-container li ol {
    padding-left: 20px;
    margin-top: 10px;
}

.rules-container li ol li {
    margin-bottom: 10px;
}

.rules-container a {
    color: #6bb2b2;
    text-decoration: underline;
}

.rules-container a:hover {
    color: #99ffff;
}

/* Responsive Design for Rules Page */
@media (max-width: 600px) {
    .rules-container {
        padding: 20px;
        margin: 20px;
    }

    .rules-container h1 {
        font-size: 2em;
    }

    .rules-container p {
        font-size: 1em;
    }
}

/* Contact Page Specific Styles */
.contact-container {
    max-width: 800px;
    margin: 50px auto;
    padding: 30px;
    background-color: rgba(4, 11, 31, 0.9); /* Semi-transparent to blend with background */
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.5);
    text-align: center;
}

.contact-container h1 {
    margin-bottom: 20px;
    font-size: 2.5em;
    color: #ffd919; /* Matches your h1 color */
    text-transform: uppercase;
}

.contact-message {
    font-size: 1.2em;
    color: #bfbfbf; /* Matches your body text color */
    margin-bottom: 30px;
    line-height: 1.6;
}

.contact-links a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 10px;
    padding: 15px 25px;
    font-size: 1em;
    color: #040b1f; /* Button text color */
    background-color: #6bb2b2; /* Matches your link color */
    border: none;
    border-radius: 5px;
    text-decoration: none;
    transition: background-color 0.3s ease, transform 0.2s ease;
}

.contact-links a:hover {
    background-color: #99ffff; /* Link hover color */
    transform: scale(1.05);
}

.discord-icon {
    width: 20px;
    height: 20px;
    vertical-align: middle;
    margin-right: 8px;
}

/* Responsive Design */
@media (max-width: 600px) {
    .contact-container {
        padding: 20px;
    }

    .contact-container h1 {
        font-size: 2em;
    }

    .contact-message {
        font-size: 1em;
    }

    .contact-links a {
        padding: 12px 20px;
        font-size: 0.9em;
    }
}

/* --- Recent Deaths Page Styles --- */
.lastkills-container {
    max-width: 1000px;
    margin: 50px auto;
    padding: 30px;
    background-color: rgba(4, 11, 31, 0.9); /* Semi-transparent dark background */
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.5);
    color: #bfbfbf;
}

.lastkills-container h1 {
    margin-bottom: 20px;
    font-size: 2.5em;
    color: #ffd919; /* Matches your h1 color */
    text-transform: uppercase;
    text-align: center;
}

.lastkills-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 20px;
}

.lastkills-table th, .lastkills-table td {
    padding: 12px 15px;
    text-align: left;
}

.lastkills-table.teal-header th {
    background-color: #6bb2b2; /* Teal matching link color */
    color: #040b1f; /* Dark text for contrast */
    font-weight: 600; /* Bold for emphasis */
    border-bottom: 2px solid #99ffff; /* Light border for separation */
}

.lastkills-table.yellow-header th {
    background-color: #ffd919; /* Yellow matching h1 */
    color: #040b1f; /* Dark text for contrast */
    font-weight: 600;
    border-bottom: 2px solid #6bb2b2; /* Teal border for separation */
}

.lastkills-table tr:nth-child(even) {
    background-color: rgba(255, 255, 255, 0.05); /* Subtle stripe effect */
}

.lastkills-table tr:hover {
    background-color: rgba(255, 255, 255, 0.1); /* Highlight on hover */
}

.centralizeContent {
    text-align: center;
}

/* Responsive Design */
@media (max-width: 768px) {
    .lastkills-container {
        padding: 20px;
        margin: 20px;
    }

    .lastkills-container h1 {
        font-size: 2em;
    }

    .lastkills-table th, .lastkills-table td {
        padding: 10px;
    }

    .lastkills-table th {
        font-size: 1em;
    }
}

/* --- Bestiary Page Styles --- */
.bestiary-container {
    max-width: 1200px;
    margin: 50px auto;
    padding: 30px;
    background-color: rgba(4, 11, 31, 0.9); /* Semi-transparent dark background */
    border-radius: 8px;
    color: #bfbfbf;
}

.bestiary-container h2 {
    margin-bottom: 20px;
    font-size: 2.5em;
    color: #ffd919; /* Matches your h1 color */
    text-transform: uppercase;
    text-align: center;
}

.bestiary-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 20px;
    table-layout: fixed;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.5);
}

.bestiary-table th, .bestiary-table td {
    padding: 12px 15px;
    text-align: left;
    border: 1px solid rgba(255, 255, 255, 0.1); /* Subtle borders */
    word-wrap: break-word;
}

.bestiary-table th {
    background-color: rgba(255, 255, 255, 0.1); /* Matching hover background */
    color: #ffd919; /* Enhanced contrast: Yellow for readability */
    font-weight: 600; /* Bold for emphasis */
    border-bottom: 2px solid #99ffff; /* Light border for separation */
    text-align: center;
}

.bestiary-table tbody tr:nth-child(even) {
    background-color: rgba(255, 255, 255, 0.05); /* Subtle stripe effect */
}

.bestiary-table tbody tr:hover {
    background-color: rgba(255, 255, 255, 0.1); /* Highlight on hover */
}

.centralizeContent {
    text-align: center;
}

/* Responsive Design */
@media (max-width: 992px) {
    .bestiary-container {
        padding: 20px;
        margin: 20px;
    }

    .bestiary-container h2 {
        font-size: 2em;
    }

    .bestiary-table th, .bestiary-table td {
        padding: 10px;
        font-size: 0.9em;
    }
}

/* Scrollable Table for Small Screens */
.table-responsive {
    overflow-x: auto;
}

/* --- Additional Styles for Icons (Optional) --- */
.icon-small {
    width: 16px;
    height: 16px;
    margin-left: 5px;
    vertical-align: middle;
}

/* --- Pagination Styles (Optional) --- */
.pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 10px;
    gap: 15px;
}

.pagination a {
    padding: 10px 20px;
    background-color: #6bb2b2;
    color: #040b1f;
    text-decoration: none;
    border-radius: 5px;
    transition: background-color 0.3s ease;
}

.pagination a:hover {
    background-color: #99ffff;
}

.pagination span {
    color: #ffd919;
    font-weight: bold;
}

/* Modernized Last Kills Styles */
.lastkills-container {
    background: rgba(4, 11, 31, 0.95);
    border-radius: 12px;
    padding: 2rem;
    margin: 2rem auto;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
    border: 1px solid rgba(107, 178, 178, 0.1);
}

.no-deaths-alert {
    text-align: center;
    padding: 2rem;
    background: rgba(4, 11, 31, 0.5);
    border-radius: 8px;
    margin: 2rem 0;
}

.no-deaths-alert img {
    width: 64px;
    margin-bottom: 1rem;
}

.lastkills-table {
    width: 100%;
    border-collapse: collapse;
    background: rgba(4, 11, 31, 0.8);
    border-radius: 8px;
    overflow: hidden;
}

.lastkills-table th {
    background: linear-gradient(180deg, #ffd919 0%, #e5c117 100%);
    color: #040b1f;
    padding: 1rem;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.9em;
    letter-spacing: 0.5px;
}

.lastkills-table td {
    padding: 1rem;
    border-bottom: 1px solid rgba(107, 178, 178, 0.1);
}

.kill-entry {
    transition: all 0.2s ease;
}

.kill-entry:hover {
    background: rgba(107, 178, 178, 0.05);
}

.timestamp {
    white-space: nowrap;
    color: #6bb2b2;
    font-size: 0.9em;
}

.participants {
    color: #e0e0e0;
    line-height: 1.4;
}

.world-id {
    text-align: center;
    font-weight: 600;
    color: #ffd919;
}

/* Responsive Design */
@media (max-width: 768px) {
    .lastkills-container {
        padding: 1rem;
        margin: 1rem;
    }
    
    .lastkills-table th,
    .lastkills-table td {
        padding: 0.75rem;
    }
    
    .table-responsive {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
}



img {
  border: none;
}

#ArtworkHelper {
  text-align: center;
  background-position: top center;
  background-attachment: scroll;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
  min-width: 1000px;
}

/* container to implement min/max width */
#Bodycontainer {
  text-align: left;
  min-width: 1000px;
  max-width: 1200px;
  width: 100%;
  height: 100%;
  margin: 0px;
  margin-left: auto;
  margin-right: auto;
  padding: 0px;
  display: table;
  width: expression(document.body.clientWidth > 1200? "1200px": "100%");
}

#ContentRow {
  position: relative;
  top: 155px;
}

/* "star-HTML-hack" to correct the position of the content row */
* html #ContentRow {
  display: inline-block;
}

#MenuColumn {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 180px;
  margin-right: 15px;
  margin-left: 15px;
  padding: 0px;
  font-family: Arial, sans-serif;
  font-size: 10pt;
  font-weight: bold;
  line-height: 12pt;
}

#ContentColumn {
  position: relative;
  margin: 0px;
  margin-left: 205px;
  margin-right: 205px;
}

#ThemeboxesColumn {
  text-align: center;
  position: absolute;
  top: 0px;
  right: 0px;
  width: 180px;
  margin: 0px;
  margin-right: 15px;
  margin-left: 25px;
}

#Footer {
  font-family: Verdana, Arial, Times New Roman, sans-serif;
  font-size: 7pt;
  font-weight: normal;
  text-align: center;
  position: relative;
  width: 100%;
  padding-bottom: 20px;
  color: white;
}

* html #Footer {
  padding-bottom: 120px;
  margin-bottom: 50px;
}

/* Footer linkes */
#Footer a:link {
  color: white;
  text-decoration: none;
}

#Footer a:visited {
  color: white;
  text-decoration: none;
}

#Footer a:focus {
  color: white;
  text-decoration: none;
}

#Footer a:active {
  color: white;
  text-decoration: underline;
}

#Footer a:hover {
  color: white;
  text-decoration: underline;
}

/** -------------------------------
 *  Stylesheet declarations for the
 *  HEADER AREA
 *  -------------------------------
 */

#LeftArtwork {
  position: absolute;
  height: 140px;
  width: 166px;
  top: -140px;
  left: 4px;
  background-repeat: no-repeat;
  z-index: 5;
}

#LeftArtwork #TibiaLogoArtworkTop {
  position: absolute;
  top: 20px;
  left: 0px;
  height: 82px;
  width: 166px;
  z-index: 5;
  cursor: pointer;
  border: 0px;
}

#LeftArtwork #TibiaLogoArtworkBottom {
  position: absolute;
  top: 102px;
  left: 0px;
  height: 43px;
  width: 166px;
  z-index: 5;
}

#LeftArtwork #Statue_1 {
  position: absolute;
  top: 0px;
  left: 5px;
  height: 30px;
  width: 32px;
  z-index: 10;
}

#LeftArtwork #Statue_2 {
  position: absolute;
  top: 0px;
  right: 25px;
  height: 30px;
  width: 32px;
  z-index: 10;
}

#LeftArtwork #LogoLink {
  position: absolute;
  bottom: 14px;
  left: 58px;
  height: 14px;
  width: 50px;
  z-index: 99;
  cursor: pointer;
}

#RightArtwork {
  text-align: left;
  position: absolute;
  top: -1px;
  right: 24px;
  width: 132px;
  background-repeat: no-repeat;
  z-index: 90;
}

#RightArtwork #Monster {
  position: absolute;
  height: 80px;
  width: 80px;
  top: -137px;
  left: 8px;
  z-index: 15;
  cursor: pointer;
}

#PedestalAndOnline {
  position: absolute;
  top: -105px;
  width: 132px;
  height: 111px;
}

#RightArtwork #PlayersOnline {
  font-family: Verdana, Arial, Times New Roman, sans-serif;
  font-size: 7pt;
  line-height: 8pt;
  text-align: center;
  position: absolute;
  width: 92px;
  bottom: 11px;
  left: 21px;
  color: #cfa600;
  border-bottom: 1px solid #010101;
  cursor: pointer;
}

/** -------------------------------
 *  Stylesheet declarations for the
 *  LOGINBOX
 *  -------------------------------
 */

#Loginbox {
  position: relative;
  left: 5px;
  top: 8px;
  width: 100%;
  margin-bottom: 42px;
  background-repeat: no-repeat;
}

#Loginbox #LoginTop {
  position: absolute;
  left: -5px;
  top: -12px;
  height: 12px;
  width: 180px;
  background-repeat: no-repeat;
}

#Loginbox #LoginBottom {
  position: absolute;
  top: 52px;
  left: -5px;
  height: 12px;
  width: 180px;
  background-repeat: no-repeat;
}

#Loginbox .LoginBorder {
  position: absolute;
  top: 0px;
  height: 52px;
  width: 8px;
  background-repeat: repeat-y;
  z-index: 10;
}

#Loginbox #BorderRight {
  right: 9px;
}

#Loginbox .Loginstatus {
  position: relative;
  top: 0px;
  left: 5px;
  height: 13px;
  width: 160px;
}

#Loginbox .LoginstatusText {
  position: absolute;
  top: 1px;
  left: 18px;
  width: 124px;
  height: 11px;
  cursor: pointer;
}

#Loginbox #LoginstatusText_1 {
  top: 2px;
  cursor: default;
}

#Loginbox #LoginstatusText_2_1 {
  visibility: visible;
}

#Loginbox #LoginstatusText_2_2 {
  visibility: hidden;
}

#LoginBox #LoginButtonContainer {
  margin-left: 5px;
  height: 26px;
  width: 160px;
  background-repeat: repeat-y;
}

#Loginbox #LoginButton {
  position: relative;
  top: 1px;
  left: 12px;
  height: 25px;
  width: 135px;
}

#Loginbox #LoginButton .Button {
  position: relative;
  top: 0px;
  left: 0px;
  width: 135px;
  height: 25px;
  visibility: hidden;
}

#Loginbox #LoginButton #ButtonText {
  position: absolute;
  top: 0px;
  left: 0px;
  height: 22px;
  width: 135px;
  z-index: 15;
  cursor: pointer;
}

/** -------------------------------
 *  Stylesheet declarations for the
 *  MENU
 *  -------------------------------
 */

#Menu {
  position: relative;
  left: 5px;
  background-repeat: no-repeat;
}

#MenuTop {
  position: absolute;
  left: -5px;
  top: -12px;
  height: 12px;
  width: 180px;
  background-repeat: no-repeat;
}

#MenuBottom {
  position: relative;
  left: -5px;
  bottom: 0px;
  height: 12px;
  width: 180px;
  background-repeat: no-repeat;
}

/* Menuitems */

.MenuButton {
  position: relative;
  height: 32px;
  width: 170px;
  display: block;
  cursor: pointer;
}

.Button {
  position: relative;
  height: 32px;
  width: 170px;
  visibility: hidden;
  display: block;
}

.Extend {
  position: absolute;
  top: 20px;
  right: -2px;
  height: 12px;
  width: 12px;
  background-repeat: no-repeat;
}

.Lights {
  visibility: hidden;
}

.Light_lu {
  position: absolute;
  top: 2px;
  left: 3px;
  height: 2px;
  width: 2px;
  background-repeat: no-repeat;
}

.Light_ru {
  position: absolute;
  top: 2px;
  right: 3px;
  height: 2px;
  width: 2px;
  background-repeat: no-repeat;
}

.Light_ld {
  position: absolute;
  height: 2px;
  width: 2px;
  top: 28px;
  left: 3px;
}

.Icon {
  position: absolute;
  height: 32px;
  width: 32px;
  top: 0px;
  left: 8px;
}

.Label {
  position: absolute;
  height: 22px;
  width: 116px;
  top: 6px;
  left: 42px;
}

/* Submenus(items) */

.LeftChain {
  position: absolute;
  top: 0px;
  left: -5px;
  height: 33px;
  width: 7px;
  background-repeat: repeat-y;
}

.RightChain {
  position: absolute;
  top: 0px;
  right: -4px;
  height: 33px;
  width: 7px;
  background-repeat: repeat-y;
}

.Submenu {
  position: relative;
  margin-left: 5px;
  margin-right: 5px;
  background-color: #0D2E2B;
  width: 160px;
}

.Submenuitem {
  position: relative;
  margin: 0px;
  padding: 0px;
}

.ActiveSubmenuItemIcon {
  position: absolute;
  top: 5px;
  left: 3px;
  width: 10px;
  height: 10px;
  background-repeat: no-repeat;
  visibility: hidden;
}

.SubmenuitemLabel {
  margin: 0px;
  border-top: 0;
  padding-top: 2px;
  padding-bottom: 2px;
  padding-left: 15px;
  border-bottom: 1px solid #4b7874;
  overflow: hidden;
}

/* Submenu links */
.Submenu a:link {
  color: #d7d7d7;
  text-decoration: none;
}

.Submenu a:visited {
  color: #d7d7d7;
  text-decoration: none;
}

.Submenu a:focus {
  color: #d7d7d7;
  text-decoration: none;
}

.Submenu a:active {
  color: white;
  text-decoration: none;
}

.Submenu a:hover {
  color: white;
  text-decoration: none;
}

/** -------------------------------
 *  Stylesheet declarations for the
 *  CONTENT AREA
 *  -------------------------------
 */

.Content .BoxContent {
  padding: 10px;
}

/* "tanhack" for correction of IE bug */
* html {
  top: -5px;
}

.Content {
  position: relative;
  top: 0px;
  width: 100%;
}

/* "star-HTML-hack" to correct the position of the content area */
* html .Content {
  position: relative;
  top: 796px;
  margin: 20px;
  border: 0px dashed #051122;
  border-right-width: 550px;
}

#ContentHelper {
  position: relative;
}

/* "star-HTML-hack" to to implement min-width in IE */
* html #ContentHelper {
  display: inline-block;
  position: relative;
  top: -800px;
  margin: -20px;
  margin-right: -570px;
}

.Box {
  font-size: 0pt;
  position: relative;
  margin: 5px;
  margin-bottom: 18px;
  color: #668fad;
  border-left: 2px solid #3a3738;
  border-right: 2px solid #3a3738;
  background-color: #debb9d;
  background-repeat: no-repeat;
  overflow: visible;
}

  /* {
  font-family: Verdana, Arial, Times New Roman, sans-serif;
  font-size: 9pt;
  background-color: #FFF2db;
  color: #668fad;
  min-height: 367px;
  height: auto !important;
  height: 387px;
} */

/* "star-HTML-hack" to correct Box width in IE */
* html .Box {
  width: 100%;
}

/* "star-HTML-hack" to correct BoxContent width in IE */
* html {
  width: 100%;
}

th {
  /* font-family: Verdana, Arial, Times New Roman, sans-serif; */
  font-size: 10pt;
  font-weight: bold;
  text-align: left;
  color: white;
  background-color: #46525A;
}

td {
  /* font-family: Verdana, Arial, Times New Roman, sans-serif; */
  font-size: 10pt;
  color: #668fad;
}

/* Content Links */

a {
  /* font-family: Verdana, Arial, Times New Roman, sans-serif; */
  font-weight: bold;
  /* color: #004294; */
  text-decoration: none;
}

a:hover {
  /* font-family: Verdana, Arial, Times New Roman, sans-serif; */
  font-weight: bold;
  text-decoration: underline;
  /* color: #0063DC; */
}

.HelpLink {
  font-size: 7pt;
  cursor: pointer;
}

/* Corners */

.Corner-tl {
  position: absolute;
  top: -4px;
  left: -5px;
  width: 17px;
  height: 17px;
  z-index: 50;
}

.Corner-tr {
  position: absolute;
  top: -4px;
  right: -5px;
  width: 17px;
  height: 17px;
  z-index: 50;
}

.BottomCornersHelper {
  position: absolute;
  width: 100%;
}

.CornerWrapper-b {
  position: absolute;
  width: 100%;
}

.Corner-bl {
  position: absolute;
  bottom: -4px;
  left: -6px;
  width: 17px;
  height: 17px;
  z-index: 50;
}

.Corner-br {
  position: absolute;
  bottom: -4px;
  right: -6px;
  width: 17px;
  height: 17px;
  z-index: 50;
}

/* Borders */

.Border_1 {
  position: relative;
  height: 6px;
  width: 100%;
  background-repeat: repeat-x;
}

.BorderTitleText {
  position: relative;
  height: 24px;
  background-repeat: repeat-x;
}

.Title {
  position: absolute;
  top: 6px;
  left: 5px;
}

.Border_2 {
  /* margin: 4px;
  padding: 0px;
  background-color: #793d03; */
}

.Border_3 {
  /* margin: 1px;
  border-top: 1px solid #793d03;
  border-bottom: 1px solid #793d03; */
}

/** -------------------------------
 *  Stylesheet declarations for the
 *  THEMEBOXES of the Tibia
 *  website
 *  -------------------------------
 */

.Themebox {
  position: relative;
  margin-bottom: 10px;
  top: -4px;
  width: 180px;
  height: 154px;
}

#Themeboxes div {
  font-size: 10pt;
  background-repeat: no-repeat;
}

#Themeboxes .ThemeboxButton {
  position: absolute;
  bottom: 20px;
  left: 22px;
  height: 25px;
  width: 135px;
  cursor: pointer;
}

#Themeboxes .Bottom {
  position: absolute;
  bottom: 0px;
  left: 0px;
  height: 12px;
  width: 180px;
}

/* "star-HTML-hack" to correct the position of the bottom element */
* html #Themeboxes .Bottom {
  bottom: -3px;
}

#Themeboxes #NewcomerBox .ThemeboxButton {
  bottom: 15px;
}

#Themeboxes #PremiumBox {
  height: 164px;
}

#Themeboxes #JobBox {
  height: 164px;
}

#Themeboxes #GalleryBox #GalleryContent {
  position: relative;
  height: 111px;
  width: 170px;
  top: 31px;
  left: 0px;
  margin-left: 5px;
  margin-right: 5px;
  border: 0;
  cursor: pointer;
}

#Themeboxes #CurrentPollBox #CurrentPollText {
  /* font-family: Verdana, Arial, sans-serif; */
  font-weight: bold;
  line-height: 11pt;
  color: #668fad;
  position: absolute;
  height: 70px;
  width: 150px;
  top: 37px;
  left: 15px;
  padding-top: 5px;
  overflow: hidden;
}

#Themeboxes #SkyscraperBanner {
  border: 0;
}

#Themeboxes #NetworksBox {
  position: relative;
  height: 204px;
}

#Themeboxes #NetworksBox #FacebookBlock {
  position: relative;
  top: 32px;
  height: 113px;
}

#Themeboxes #NetworksBox #FacebookLikeBox {
  position: relative;
  left: 27px;
  top: 3px;
  height: 60px;
  width: 115px;
  overflow: hidden;
}

#Themeboxes #NetworksBox #FacebookLikeBox div {
  position: relative;
  left: -1px;
  top: -1px;
}

#Themeboxes #NetworksBox #FacebookSendBox {
  position: absolute;
  left: 92px;
  top: 14px;
  width: 50px;
}

#Themeboxes #NetworksBox #FacebookLikes {
  position: relative;
  left: 14px;
  top: 10px;
  width: 155px;
  left: 13px;
  overflow: hidden;
}

#Themeboxes #NetworksBox #FacebookLikes div {
  position: relative;
  left: -69px;
}

#Themeboxes #NetworksBox #TwitterBlock {
  position: relative;
  top: 42px;
  text-align: center;
}

/** -------------------------------
 *  OLD Stylesheet declarations for
 *  the CONTENT AREA
 *  -------------------------------
 */

td .white {
  color: #EFEFEF;
  visibility: visible;
}

td .whites {
  color: #EFEFEF;
  visibility: visible;
  font-size: 9pt;
}

.white {
  color: #EFEFEF;
  visibility: visible;
}

td .green {
  color: #00BF00;
}

td .yellow {
  color: #FFBB05;
}

td .red {
  color: #EF0000;
}

td .grey {
  color: #808080;
}

td .orange {
  color: #FF9712;
}

/** -------------------------------
 *  OLD Stylesheet declarations for
 *  the CONTENT AREA (forum)
 *  -------------------------------
 */

.ff_info {
  /* font-family: Verdana, Arial, Times New Roman, sans-serif; */
  font-size: 10pt;
  color: #668fad;
  visibility: visible;
}

.ff_white a {
  color: #FFFFFF;
}

.ff_white {
  /* font-family: Verdana, Arial, Times New Roman, sans-serif; */
  color: #EFEFEF;
  visibility: visible;
  font-size: 7pt;
  font-weight: bold;
}

.ff_red {
  /* font-family: Verdana, Arial, Times New Roman, sans-serif; */
  color: #EF0000;
  visibility: visible;
  font-size: 8pt;
  font-weight: bold;
}

.ff_whitelarge {
  /* font-family: Verdana, Arial, Times New Roman, sans-serif; */
  color: #EFEFEF;
  visibility: visible;
  font-size: 9pt;
  font-weight: bold;
}

.ff_info {
  /* font-family: Verdana, Arial, Times New Roman, sans-serif; */
  font-size: 8pt;
  color: #668fad;
  visibility: visible;
}

.ff_infotext {
  /* font-family: Verdana, Arial, Times New Roman, sans-serif; */
  font-size: 8pt;
  color: #668fad;
  visibility: visible;
  line-height: 12pt;
}

.ff_smallinfo {
  /* font-family: Verdana, Arial, Times New Roman, sans-serif; */
  font-size: 7pt;
  color: #668fad;
  visibility: visible;
}

.ff_large {
  /* font-family: Verdana, Arial, Times New Roman, sans-serif; */
  font-size: 12pt;
  color: #668fad;
  visibility: visible;
}

.ff_pagetext {
  /* font-family: Verdana, Arial, Times New Roman, sans-serif; */
  font-size: 9pt;
  color: #668fad;
  visibility: visible;
  line-height: 13pt;
}

.ff_pagetextgrey {
  /* font-family: Verdana, Arial, Times New Roman, sans-serif; */
  font-size: 9pt;
  color: #46525A;
  visibility: visible;
  line-height: 13pt;
}

.ff_pagetextred {
  /* font-family: Verdana, Arial, Times New Roman, sans-serif; */
  font-size: 9pt;
  color: #F00;
  visibility: visible;
  line-height: 13pt;
}

.ff_correct {
  /* font-family: Verdana, Arial, Times New Roman, sans-serif; */
  font-size: 11pt;
  color: #FF0000;
  visibility: visible;
  font-weight: bold;
}

.FormFieldError {
  font-size: 8pt;
  color: red;
}

.SmallBox {
  position: relative;
  font-size: 1px;
}

.SmallBox .ErrorMessage {
  font-size: 8pt;
  position: relative;
  color: red;
  height: 100%;
  background-color: #152238;
  padding: 5px;
  padding-left: 43px;
}

.SmallBox .Message {
  font-size: 10pt;
  position: relative;
  height: 100%;
  background-color: #152238;
  padding: 10px;
}

.SmallBox .ErrorMessage ul {
  padding-left: 15px;
}

.SmallBox .BoxFrameHorizontal {
  position: relative;
  height: 4px;
}

.SmallBox .BoxFrameVerticalRight {
  position: absolute;
  right: 0px;
  top: 0px;
  width: 3px;
  background-repeat: repeat-y;
  height: 100%;
}

.SmallBox .BoxFrameVerticalLeft {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 3px;
  background-repeat: repeat-y;
  height: 100%;
}

.SmallBox .MessageContainer {
  position: relative;
  height: 100%;
}

.SmallBox .BoxFrameEdgeLeftTop {
  position: absolute;
  left: -1px;
  top: -1px;
  width: 5px;
  height: 5px;
}

.SmallBox .BoxFrameEdgeLeftBottom {
  position: absolute;
  left: -1px;
  bottom: -1px;
  width: 5px;
  height: 5px;
}

.SmallBox .BoxFrameEdgeRightTop {
  position: absolute;
  right: -1px;
  top: -1px;
  width: 5px;
  height: 5px;
}

.SmallBox .BoxFrameEdgeRightBottom {
  position: absolute;
  right: -1px;
  bottom: -1px;
  width: 5px;
  height: 5px;
}

.SmallBox .AttentionSign {
  position: absolute;
  top: 3px;
  left: 8px;
  width: 30px;
  height: 26px;
}


/** ----------------
 *  new process bars
 *  ----------------
 */

#ProgressBar #Headline {
  text-align: center;
  font-size: 14pt;
  font-weight: bold;
  margin-bottom: 5px;
}

#ProgressBar #MainContainer {
  position: relative;
  top: 10px;
  height: 50px;
  margin-bottom: 25px;
}

#ProgressBar #BackgroundContainer {
  position: relative;
  width: 100%;
}

#ProgressBar #BackgroundContainerLeftEnd {
  position: absolute;
  float: left;
}

#ProgressBar #BackgroundContainerCenter {
  position: absolute;
  left: 0px;
  top: 0px;
  height: 17px;
  width: 100%;
}

#ProgressBar #BackgroundContainerCenterImage {
  position: relative;
  margin-left: 25px;
  margin-right: 25px;
  height: 17px;
}

#ProgressBar #BackgroundContainerRightEnd {
  position: absolute;
  right: 0px;
  top: 0px;
  float: right;
}

#ProgressBar #TubeLeftEnd {
  position: absolute;
  left: 25px;
  top: 4px;
}

#ProgressBar #TubeRightEnd {
  position: absolute;
  right: 25px;
  top: 4px;
  z-index: 0;
}

#ProgressBar .Steps {
  position: relative;
  height: 39px;
  font-size: 9px;
  float: left;
  top: -11px;
  margin-left: -1px;
}

#ProgressBar #StepsContainer1 {
  text-align: right;
  margin-left: 92px;
  margin-right: 40px;
  height: 10px;
}

#ProgressBar #StepsContainer2 {
  width: 100%;
  height: 10px;
}

#ProgressBar .TubeContainer {
  position: relative;
  padding-right: 47px;
}

#ProgressBar .Tube {
  position: relative;
  top: 16px;
  left: 0px;
  width: 100%;
  height: 7px;
  background: #FFFFFF none repeat scroll 0%;
}

* html #ProgressBar .Tube {
  top: 13px;
}

#ProgressBar .SingleStepContainer {
  position: absolute;
  top: 0px;
  width: 47px;
  height: 30px;
  right: 0px;
  text-align: center;
}

#ProgressBar #FirstStep .SingleStepContainer {
  left: 45px;
  width: 47px;
  position: absolute;
}

#ProgressBar .StepIcon {
  position: absolute;
  right: 0px;
}

* html #ProgressBar .StepIcon {
  right: -1px;
}

#ProgressBar #FirstStep .StepIcon {
  top: 0px;
  left: 0px;
}

#ProgressBar .StepText {
  top: 40px;
  position: absolute;
  width: 200px;
  right: -77px;
}


/** -------------------------------
 *  Stylesheet declarations for the
 *  NEW TABLES
 *  -------------------------------
 */

.TableContainer {
  border: 1px solid black;
  position: relative;
  width: 100%;
  font-size: 1px;
}

.TableContainer .Odd {
  background-color: #152238;
}

.TableContainer .Even {
  background-color: #131F33;
}

/* TABLEHEADER DECORATION */
.TableContainer .CaptionContainer {
  position: relative;
  font-size: 1pt;
  background-color: #46525A !important;
  height: 100%;
  width: 100%;
  text-align: left;
}

.TableContainer .CaptionContainer .CaptionInnerContainer {
  position: relative;
  background-color: #46525A;
  width: 100%;
  height: 100%;
  padding-top: 3px;
  padding-bottom: 4px;
}

.TableContainer .CaptionContainer .Text {
  /* font-family: Verdana, Arial, Times New Roman, sans-serif; */
  font-size: 10pt;
  font-weight: bold;
  text-align: left;
  color: white;
  padding-left: 10px;
  padding-top: 0px;
  padding-bottom: 0px;
}

.TableContainer .CaptionContainer .CaptionEdgeLeftTop {
  position: absolute;
  width: 5px;
  height: 5px;
  top: -2px;
  left: -2px;
  z-index: 50;
}

.TableContainer .CaptionContainer .CaptionEdgeRightTop {
  position: absolute;
  width: 5px;
  height: 5px;
  top: -2px;
  right: -2px;
  z-index: 50;
}

.TableContainer .CaptionContainer .CaptionEdgeLeftBottom {
  position: absolute;
  width: 5px;
  height: 5px;
  left: -2px;
  bottom: -3px;
  z-index: 50;
}

.TableContainer .CaptionContainer .CaptionEdgeRightBottom {
  position: absolute;
  width: 5px;
  height: 5px;
  right: -2px;
  bottom: -3px;
  z-index: 50;
}

.TableContainer .CaptionContainer .CaptionBorderTop {
  position: absolute;
  width: 100%;
  height: 4px;
  left: 0px;
  top: -1px;
}

.TableContainer .CaptionContainer .CaptionBorderBottom {
  position: absolute;
  width: 100%;
  height: 4px;
  left: 0px;
  bottom: -2px;
}

.TableContainer .CaptionContainer .CaptionVerticalLeft {
  position: absolute;
  height: 100%;
  width: 3px;
  left: -1px;
  top: 0px;
}

.TableContainer .CaptionContainer .CaptionVerticalRight {
  position: absolute;
  height: 100%;
  width: 3px;
  right: -1px;
  top: 0px;
}

* html .TableContainer .CaptionContainer .CaptionEdgeRightTop {
  right: -3px;
}

* html .TableContainer .CaptionContainer .CaptionEdgeLeftBottom {
  bottom: -4px;
}

* html .TableContainer .CaptionContainer .CaptionEdgeRightBottom {
  right: -3px;
  bottom: -4px;
}

* html .TableContainer .CaptionContainer .CaptionBorderBottom {
  bottom: -3;
}

* html .TableContainer .CaptionContainer .CaptionVerticalRight {
  right: -2px;
}

/* TABLE CONTENT */
.TableContentContainer {
  border: 1px solid #46525A;
  position: relative;
  margin-right: 4px;
  height: 100%;
  background-color: #152238;
  padding: 0px;
}

.TableContent {
  width: 100%;
  border-collapse: collapse;
}

.TableContent td {
  padding-left: 5px;
  padding-top: 2px;
  padding-right: 5px;
  padding-bottom: 2px;
}

/* INNERLYOUT 1 */
.TableContainer .Table1 {
  width: 100%;
  background-color: #152238;
  border: 2px solid #55636c;
}

.TableContainer .Table1 .InnerTableContainer {
  padding: 5px;
}

/* INNERLYOUT 2 */
.TableContainer .Table2 {
  width: 100%;
  border: 2px solid #55636c;
  background-color: #051023;
  padding: 0px;
  margin: 0px;
  border-collapse: collapse;
}

.TableContainer .Table2 td {
  padding: 0px;
  margin: 0px;
}

.TableContainer .Table2 .InnerTableContainer {
  margin-top: 1px;
}

.TableContainer .Table2 .InnerTableContainer table {
  border-collapse: collapse;
}

.TableContainer .Table2 .InnerTableContainer td {
  padding-top: 2px;
  padding-left: 5px;
  padding-bottom: 2px;
  padding-right: 5px;
  border: 1px solid #152238;
}

/* INNERLYOUT 3 */
.TableContainer .Table3 {
  width: 100%;
  border: 2px solid #55636c;
  background-color: #051023;
}

.TableContainer .Table3 .InnerTableContainer {
  width: 100%;
  position: relative;
  margin-top: 5px;
  margin-left: 3px;
}

.TableContainer .Table3 .TableContentAndRightShadow td {
  border: 1px solid #152238;
}

/* INNERLYOUT 4 */
.TableContainer .Table4 {
  width: 100%;
  border: 2px solid #55636c;
  background-color: #051023;
}

.TableContainer .Table4 .InnerTableContainer {
  width: 100%;
  position: relative;
  margin-top: 3px;
}

.TableContainer .Table4 .TableContentAndRightShadow .TableContent td {
  padding-left: 4px;
  padding-top: 2px;
  padding-bottom: 2px;
}

/* INNERLYOUT 5 */
.TableContainer .Table5 {
  width: 100%;
  border: 2px solid #55636c;
  background-color: #051023;
}

.TableContainer .Table5 .InnerTableContainer {
  width: 100%;
  position: relative;
  margin-top: 5px;
  margin-left: 3px;
}

.TableContainer .Table5 .TableContentAndRightShadow .TableContent td {
  padding-left: 4px;
  padding-top: 2px;
  padding-bottom: 2px;
}

/* SHADOWS */
.TableShadowContainerRightTop {
  position: relative;
  top: 0px;
  right: 3px;
  margin-right: 0px;
  font-size: 1px;
  float: right;
  z-index: 99;
}

.TableShadowRightTop {
  position: absolute;
  top: 0px;
  right: 0px;
  width: 4px;
  height: 5px;
  z-index: 99;

  background-image: none !important;
}

.TableContentAndRightShadow {
  position: relative;
  background-repeat: repeat-y;
  background-position: top right;
  margin-right: 3px;
  font-size: 1px;

  background-image: none !important;
}

.TableShadowContainer {
  position: relative;
  margin-right: 5px;
}

.TableBottomShadow {
  position: relative;
  font-size: 1px;
  height: 5px;
  width: 100%;
  padding: 0px;
  margin: 0px;

  background-image: none !important;
}

.TableBottomLeftShadow {
  position: relative;
  height: 5px;
  width: 4px;
  float: left;
  padding: 0px;
  margin: 0px;

  background-image: none !important;
}

.TableBottomRightShadow {
  position: relative;
  float: right;
  right: -2px;
  top: 0px;
  height: 5px;
  width: 4px;

  background-image: none !important;
}

/* HEADLESS CONTENT TABLE */
.HeadlessTable {
  border: 0px;
  border-style: solid;
  border-color: #656565;
  border-top-width: 1px;
  border-top-color: white;
  border-left-width: 1px;
  border-left-color: white;
  border-bottom-width: 1px;
  border-right-width: 1px;
  border-right-color: #656565;
  margin-left: 15px;
}

/* LABELS */
.LabelV {
  font-weight: bold;
  padding-right: 10px;
  white-space: nowrap;
  vertical-align: top;
}

.LabelH {
  font-weight: bold;
  padding-right: 10px;
  white-space: nowrap;
  background-color: #131F33;

}

.LabelH td {
  background-color: #131F33;
  padding-left: 5px;
  padding-top: 2px;
  padding-right: 5px;
  padding-bottom: 2px;
}

/* BUTTONS */
.InnerTableButtonRow {
  width: 100%;
  padding-left: 1px;
  padding-right: 0px;
  padding-bottom: 4px;
  border: 0px;
}

.InnerTableButtonRow td {
  padding-right: 4px;
}

.BigButton {
  position: relative;
  width: 135px;
  height: 25px;
  z-index: 10;
  display: block;
}

.BigButtonOver {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 137px;
  height: 25px;
  visibility: hidden;
  z-index: 15;
	background-repeat: no-repeat;
}

.ButtonText {
  position: absolute;
  top: 0px;
  left: 0px;
  height: 25px;
  width: 135px;
  z-index: 20;
}

.BigButtonText {
  position: absolute;
  top: 0;
  left: 0;
  width: 135px;
  height: 25px;
  margin: 0;
  padding: 0;
  cursor: pointer;
  background: 0 0;
  border: none;
  text-align: center;
  color: #ffd18c;
  font-family: Verdana, Arial, Times New Roman, sans-serif;
  font-size: 12px;
  font-weight: 400;
  z-index: 20;
  text-shadow: -1px -1px 0 #000, 0 -1px 0 #000, 1px -1px 0 #000, 1px 0 0 #000, 1px 1px 0 #000, 0 1px 0 #000, -1px 1px 0 #000, -1px 0 0 #000;
  line-height: 25px;
}

.TopButtonContainer {
  position: relative;
  right: 4px;
  top: 4px;
  z-index: 60;
}

* html .TopButtonContainer {
  right: 27px;
}

.TopButtonContainer .TopButton {
  position: absolute;
  right: 0px;
  z-index: 55;
}

.Odd {
  background-color: #152238;
  padding: 2px;
}

.Even {
  background-color: #152238;
  padding: 2px;
}

.NewsCategoryIconSmall {
  position: absolute;
  top: 1px;
  left: 1px;
  height: 16px;
  width: 16px;
  background-repeat: no-repeat;
}

/* News Ticker */

#NewsTicker {
  padding: 5px;
  min-height: 90px;
  height: auto !important;
  height: 100px;
}

#NewsTicker .Row {
  position: relative;
  width: 100%;
}

#NewsTicker .NewsTickerIcon {
  position: absolute;
  top: 1px;
  left: 1px;
  height: 16px;
  width: 16px;
  background-repeat: no-repeat;
}

#NewsTicker .NewsTickerText {
  font-size: 9pt;
  position: relative;
  margin-left: 20px;
}

#NewsTicker .NewsTickerDate {
  font-size: 7pt;
  position: absolute;
  top: 0px;
  float: left;
}

#NewsTicker .NewsTickerShortText {
  margin-left: 85px;
  height: 14px;
}

#NewsTicker .NewsTickerFullText {
  margin-left: 85px;
  margin-right: 20px;
  display: none;
}

#NewsTicker .NewsTickerExtend {
  position: relative;
  right: 0px;
  top: 1px;
  right: 1px;
  height: 12px;
  width: 12px;
  background-repeat: no-repeat;
  float: right;
  cursor: pointer;
  z-index: 10;
}

/* Featured Article */

#FeaturedArticle {
  position: relative;
  height: 100px;
  padding: 5px;
  padding-left: 10px;
  min-height: 100px;
  height: auto !important;
  height: 110px;
  line-height: 10.5pt;
}

#FeaturedArticle .NewsHeadline {
  margin-top: 5px;
}

#FeaturedArticle #TeaserThumbnail {
  position: relative;
  top: 0px;
  right: 0px;
  height: 100px;
  width: 150px;
  margin-left: 10px;
  background-color: black;
  z-index: 90;
  float: right;
}

#ContentHelper #FeaturedArticle:first-child {
  padding: 10px;
}

#FeaturedArticle #TeaserText {
  height: 100px;
  overflow: hidden;
  z-index: 0;
}

#FeaturedArticle #Link {
  position: absolute;
  top: 0px;
  right: 0px;
  margin: 89 165 0 0;
  z-index: 99;
}

#FeaturedArticle .NewsHeadlineBackground {
  position: relative;
  height: 28px;
  margin-bottom: 5px;
  background-repeat: repeat-x;
  border-left: 1px solid #000000;
  border-right: 1px solid #000000;
}

#FeaturedArticle .NewsHeadlineIcon {
  position: absolute;
  top: -1px;
  left: 0px;
  margin-left: 5px;
  margin-right: 5px;
  float: left;
}

#FeaturedArticle .NewsHeadlineDate {
  font-size: 7pt;
  position: absolute;
  top: 9px;
  left: 50px;
  width: 85px;
  color: white;
}

#FeaturedArticle .NewsHeadlineText {
  position: relative;
  top: 8px;
  left: 135px;
  font-size: 10pt;
  font-weight: bold;
  color: white;
}

/* News */

#News {
  min-height: 100px;
  height: auto !important;
  height: 110px;
}

#News .NewsHeadlineBackground {
  position: relative;
  height: 28px;
  margin-bottom: 5px;
  background-repeat: repeat-x;
  border-left: 1px solid #000000;
  border-right: 1px solid #000000;
}

#News .NewsHeadlineIcon {
  position: absolute;
  top: -1px;
  left: 0px;
  margin-left: 5px;
  margin-right: 5px;
}

#News .NewsHeadlineDate {
  font-size: 7pt;
  position: absolute;
  top: 10px;
  left: 50px;
  width: 85px;
  color: white;
}

#News .NewsHeadlineText {
  position: relative;
  top: 7px;
  left: 135px;
  font-size: 10pt;
  font-weight: bold;
  color: white;
}

/* News Archive */

#NewsArchive .NewsHeadlineBackground {
  position: relative;
  height: 28px;
  margin-bottom: 5px;
  background-repeat: repeat-x;
  border-left: 1px solid #000000;
  border-right: 1px solid #000000;
}

#NewsArchive .NewsHeadlineIcon {
  position: absolute;
  top: -1px;
  left: 0px;
  margin-left: 5px;
  margin-right: 5px;
}

#NewsArchive .NewsHeadlineDate {
  font-size: 7pt;
  position: absolute;
  top: 9px;
  left: 50px;
  width: 85px;
  color: white;
}

#NewsArchive .NewsHeadlineText {
  position: relative;
  top: 7px;
  left: 135px;
  font-size: 10pt;
  font-weight: bold;
  color: white;
}

#News .NewsHeadlineAuthor {
  position: absolute;
  top: 7px;
  right: 10px;
  font-size: 10pt;
  color: white;
}

/* BUTTONS */
.MediumButtonText {
  position: absolute;
  top: 0;
  left: 0;
  height: 37px;
  width: 150px;
  z-index: 20;
}

.MediumButtonBackground {
  position: relative;
  top: 0;
  left: 0;
  width: 150px;
  height: 37px;
  z-index: 10;
}

.MediumButtonOver {
  position: relative;
  top: 0;
  left: 0;
  width: 150px;
  height: 37px;
  visibility: hidden;
  z-index: 15;
}

.MediumButtonForm {
  margin: 0;
  padding: 0;
}

.moduleRow {}

.moduleRowOver {
  background-color: #152238;
  cursor: pointer;
  cursor: hand;
}

h1.centered {text-align: center;}

/* Tooltip styling */
.feature-container {
    position: relative;
    cursor: pointer;
    flex: 1 1 0%;
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: center;
}
.tooltip {
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    background: #1a2331;
    color: white;
    padding: 15px;
    border: 2px solid #0d1218;
    border-radius: 4px;
    width: 250px;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    z-index: 100;
    box-shadow: 0 4px 12px rgba(0,0,0,0.3);
    pointer-events: none;
}
.feature-container:hover .tooltip {
    opacity: 1;
    visibility: visible;
    transform: translate(-50%, -10px);
}
.responsive-image {
    border: 6px solid #01040a;
}
.vocations-wrapper {
    display: flex;
    justify-content: center;
    gap: 2rem;
    margin-top: 2rem;
}
.vocation-card img {
    transition: transform 0.3s ease;
}
.vocation-card:hover img {
    transform: scale(1.05);
}

.vdarkborder {
  background: #505050;
}
.darkborder {
  background: #152238;
}
.lightborder {
  background: #1D2C46;
}

.library-breadcrumb { list-style: none; margin: 0 0 20px 0; padding: 0; }
.library-breadcrumb li { display: inline; }
.library-breadcrumb li:after { content: "»"; padding: 0 5px; }
.library-breadcrumb li:last-child:after { content: none; }

.library-npc-list { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr; grid-row-gap: 20px; justify-items: center; align-items: center; text-align: center; }
.library-creature { min-width: 64px; }
.library-creature-image, .library-npc-image { height: 64px; position: relative; }
.library-creature-image img, .library-npc-image img { position: absolute; bottom: 0; left: 0; right: 0; margin: 0 auto; }

.library-npc-location-info { display: inline; }
.library-location { margin-top: 20px; }

.library-header { display: flex; }
.library-header .library-header-name { margin-left: 20px; font-size: 24px; font-weight: bold; }
.library-description { margin-top: 7px; color: #888; }

.library-buys-sells, .library-buys-sells-npc { margin-top: 50px; display: flex; }
.library-buys, .library-sells { flex-basis: 50%; }
.library-buys table, .library-sells table { width: 100%; border-spacing: 1px; }
.library-buys table th, .library-buys table td, .library-sells table th, .library-sells table td { padding: 4px; }
.library-buys-sells .library-buys table tr > th:first-child, .library-buys-sells .library-sells table tr > th:first-child { width: 32px; }
.library-buys-sells-header { text-align: center; }

.library-creatures { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr; grid-row-gap: 20px; justify-items: center; align-items: center; text-align: center; }

.library-monster-description {
	margin-top: 7px; color: #888;
}

.library-elements-table table { border-spacing: 1px; }
.library-elements-table th, .library-elements-table td { padding: 4px; }
.library-elements-table td { padding-top: 1px; padding-bottom: 1px; }
.library-elements-table tr > th:nth-child(2) { width: 600px; }
.library-elements-table .element-neutral, .library-elements-table .element-positive, .library-elements-table .element-negative { height: 20px; position: relative; width: 0px; display: flex; align-items: center; color: #ffffff; font-weight: bold; }
.library-elements-table .element-neutral { margin: 0 auto; border: 1px solid #000; }
.library-elements-table .element-positive { background: green; left: 50%; right: auto; float: left; }
.library-elements-table .element-negative { background: red; left: auto; right: 50%; float: right; justify-content: flex-end; }
.library-elements-table .element-positive::after, .library-elements-table .element-negative::after { box-sizing: border-box; content: ''; position: absolute; display: block; top: 0; height: 20px; }
.library-elements-table .element-positive::after { border-left: 1px solid #000; left: -1px; }
.library-elements-table .element-negative::after { border-right: 1px solid #000; right: -1px; }

.library-loot-table table { border-spacing: 1px; margin-top: 15px; }
.library-loot-table th, .library-loot-table td { padding: 4px; }
.library-loot-table td { padding-top: 1px; padding-bottom: 1px; }
.library-loot-table tr > th:first-child { width: 32px; }

.library-loot-amount { display: inline; }
.library-dropped-by { margin-top: 50px; }
.library-dropped-by-creatures { margin-top: 10px; display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr; grid-row-gap: 20px; justify-items: center; align-items: center; text-align: center; }
.library-dropped-by-chance { font-size: 10px; color: #888; }

.library-items { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr; grid-row-gap: 20px; grid-column-gap: 10px; justify-items: center; align-items: center; text-align: center; }

.library-buys table th, .library-sells table th, .library-elements-table th, .library-loot-table th { background: #151b2e; }
.library-buys table tr:first-child, .library-sells table tr:first-child, .library-elements-table tr:first-child, .library-loot-table tr:first-child { background: #151b2e; }
.library-buys table tr:nth-of-type(even), .library-sells table tr:nth-of-type(even), .library-loot-table tr:nth-of-type(even), .library-elements-table tr:nth-of-type(even) { background: #152238; }
.library-buys table tr:nth-of-type(odd), .library-sells table tr:nth-of-type(odd), .library-elements-table tr:nth-of-type(odd), .library-loot-table tr:nth-of-type(odd) { background: #152238; }

.library-categories { display: grid; grid-template-columns: 1fr 1fr 1fr; grid-row-gap: 20px; justify-items: center; align-items: center; text-align: center; }
.library-category-image img { width: 128px; }
.library-categories-items { grid-template-columns: 1fr 1fr 1fr 1fr; }
.library-categories-items .library-category-image img { width: 64px; }

.library-item a:hover, .library-creature a:hover, .library-npc a:hover, .library-category a:hover { text-decoration: none; }
.library-item-name, .library-creature-name, .library-npc-name, .library-category-name { cursor: pointer; padding: 5px; background: #debb9d; border: 2px solid #5a2800; border-radius: 5px; box-shadow: 2px 3px 2px   #333333; color: #5a2800; transition: box-shadow .15s, transform .15s; margin-top: 5px; }
.library-item-name:active, .library-creature-name:active, .library-npc-name:active, .library-category-name:active { background: #f9d1af; box-shadow: inset 1px 2px 3px #333333; outline: none; transform: translate(0px, 2px); }
.library-item-name:hover, .library-creature-name:hover, .library-npc-name:hover, .library-category-name:hover { background: #f9d1af; }

.library-item-name, .library-creature-name, .library-npc-name { font-size: .8em; }

.streamer-page-list { display: grid; grid-template-columns: 1fr 1fr; row-gap: 20px; }
@media screen and (max-width:800px) {
	.streamer-page-list { grid-template-columns: 1fr; }
}
.streamer-page-info { display: flex; flex-direction: column; justify-content: center; align-items: center; }
.streamer-page-image img { width: 332px; height: 186px; }
.streamer-page-title { width: 100%; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }
.streamer-page-link-viewers { display: flex; justify-content: space-between; }
.streamer-page-viewers-offline { color: #F33; }
.streamer-page-details { width: 332px; display: flex; }
.streamer-page-profile img { width: 40px; height: 40px; }
.streamer-page-details-texts { width: 287px; margin-left: 5px; }

.benefits-table {
  width: 80%; /* Adjust width as needed */
  margin: 20px auto;
  border-collapse: collapse;
  background-color: rgba(4, 11, 31, 0.9); /* Matches site theme */
  border-radius: 8px;
  overflow: hidden;
  text-align: center;
  font-size: 14px;
  color: #bfbfbf; /* Text color */
}

.benefits-table th, .benefits-table td {
  padding: 15px;
  border: 1px solid rgba(255, 255, 255, 0.1); /* Subtle borders */
}

.benefits-table th {
  background-color: #6bb2b2; /* Header background color */
  color: #040b1f; /* Text color for header */
  font-weight: 600;
  text-transform: uppercase;
}

.benefits-table tr:nth-child(even) {
  background-color: rgba(255, 255, 255, 0.05); /* Stripe effect */
}

.benefits-table tr:nth-child(odd) {
  background-color: rgba(255, 255, 255, 0.02); /* Alternate stripe */
}

.benefits-table tr:hover {
  background-color: rgba(255, 255, 255, 0.1); /* Highlight on hover */
}

#tscoins-offers { display: flex; align-items: center; }
.tscoins-offer { flex-grow: 1; flex-basis: 0; display: flex; flex-direction: column; align-items: center; text-align: center; cursor: pointer; border: 2px solid transparent; padding: 10px; }
#tscoins-radio-offer-1 ~ div .tscoins-offer-image img { width: 28px; }
#tscoins-radio-offer-2 ~ div .tscoins-offer-image img { width: 60px; }
#tscoins-radio-offer-3 ~ div .tscoins-offer-image img { width: 76px; }
#tscoins-radio-offer-4 ~ div .tscoins-offer-image img { width: 115px; }
#tscoins-radio-offer-5 ~ div .tscoins-offer-image img { width: 150px; }
#tscoins-offers input[type="radio"] { display: none; }
#tscoins-offers input[type="radio"]:checked + .tscoins-offer { background: #80ff0055; border: 2px solid #80ff00; }

#smart-button-container { display: flex; flex-flow: column; align-items: center; }
#paypal-button-container { width: 500px; }

.lds-ring { display: inline-block; position: relative; width: 80px; height: 80px; }
.lds-ring div { box-sizing: border-box; display: block; position: absolute; width: 64px; height: 64px; margin: 8px; border: 8px solid #dfc; border-radius: 50%; animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite; border-color: #dfc transparent transparent transparent; }
.lds-ring div:nth-child(1) { animation-delay: -0.45s; }
.lds-ring div:nth-child(2) { animation-delay: -0.3s; }
.lds-ring div:nth-child(3) { animation-delay: -0.15s; }
@keyframes lds-ring {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}


.item-auction .error {
	padding: 3px;
}

.bazaar-points-image {
	width: 14px;
    position: relative;
    top: 2.5px;
}
	
#bazaar-filters-menu {
	display: flex;
	justify-content: space-between;
}
#bazaar-filters-tab, #bazaar-filters-sections {
	display: flex;
	align-items: center;
	gap: 3px;
}
#bazaar-filters-sections a.disabled {
    background: #666666;
    border: 2px solid #555555;
    color: #999999;
	cursor: not-allowed;
}
#bazaar-filters-sections a.disabled:hover {
	background: #666666;
}
.bazaar-filters-header {
	font-weight: bold;
}
.bazaar-filters-section {
	border-top: 1px solid #5a2800;
    margin-top: 8px;
	display: flex;
	justify-content: center;
	gap: 3px;
	flex-wrap: wrap;
}

.item-auction .placeholder {
	width: 200px;
	height: 12px;
	border-radius: 5px;
	background: linear-gradient(100deg, #b2bfcc 30%, #7f8993 50%, #b2bfcc 70%);
	background-size: 400%;
	animation: loading 2s ease-in-out infinite;
}
@keyframes loading {
  0% { background-position: 100% 50%; }
  100% { background-position: 0 50%; }
}
.items-list {
	display: flex;
	gap: 20px;
	flex-wrap: wrap;
	justify-content: center;
}
.item-auction {
	flex-basis: 200px;
	padding: 5px;
    background: #debb9d;
    border: 2px solid #5a2800;
    border-radius: 5px;
    box-shadow: 2px 3px 2px #333333;
    color: #5a2800;
    display: flex;
    flex-flow: column;
}
.dialog::backdrop {
	background: #00000099;
}

#bazaar-filters a, .item-auction a, .item-actions input[type="submit"] { display: inline-block; cursor: pointer; padding: 2px 5px; background: #debb9d; border: 2px solid #5a2800; border-radius: 5px; box-shadow: 2px 3px 2px #333333; color: #5a2800; font-family: montserrat, Arial; font-size: 13px; font-weight: bold; text-decoration: none; transition: box-shadow .15s, transform .15s; margin-top: 5px; }
#bazaar-filters a:active, .item-auction a:active, .item-actions input[type="submit"]:active { background: #f9d1af; box-shadow: inset 1px 2px 3px #333333; outline: none; transform: translate(0px, 2px); }
#bazaar-filters a:hover, .item-auction a:hover, .item-actions input[type="submit"]:hover { background: #f9d1af; }
#bazaar-filters a.selected { background: #9cdc75; }
#bazaar-filters-menu a { margin-top: 0; }

.item-auction form {
	margin-bottom: 0;
}
.item-info {
	display: flex;
	flex-flow: column;
	align-items: center;
	flex-grow: 1;
}
.item-header {
	width: 100%;
	display: flex;
}
.item-image {
	width: 32px;
	position: relative;
	margin-right: 4px;
}
.item-count {
	position: absolute;
	right: 0;
	bottom: 0;
    font-weight: bold;
    text-shadow: 1px 1px 0 #cccccc, 1px -1px 0 #cccccc, -1px 1px 0 #cccccc, -1px -1px 0 #cccccc;
}
.item-name-description {
	flex-grow: 1;
}
.item-name {
	font-weight: bold;
}
.item-description {
	font-size: 0.7em;
	color: #999999;
}
.item-extras {
	display: flex;
	flex-flow: column;
	align-items: flex-end;
	gap: 2px;
}
.item-favorite {
	font-weight: bold;
	font-size: 20px;
	line-height: 15px;
	cursor: pointer;
}
.item-filters {
	font-size: 9px;
    font-weight: bold;
    color: #333333;
    white-space: nowrap;
}
.item-filters img {
    height: 9px;
    top: 1.5px;
    position: relative;
    margin-right: 1px;
}
.item-stat {
	font-size: 0.8em;
}
.item-attributes, .item-contents {
    display: flex;
    flex-flow: column;
    align-items: center;
}
.item-contents {
	border: 1px solid #c1a98b;
    padding: 1px 3px;
    margin: 2px 0;
}
.item-attribute, .item-contents-entry, .item-foundin, .item-reforged, .item-world {
	text-align: center;
}
.item-world-warning {
	color: #ff0000;
	font-weight: bold;
}

.item-withdraw {
	display: flex;
	justify-content: center;
}

.item-actions {
	margin-top: 5px;
	margin-bottom: 1px;
    border-top: 2px solid #5a2800;
	padding-top: 5px;
	display: flex;
	flex-flow: column;
	justify-content: center;
}
.item-buy-bid {
	display: flex;
}
.item-buy-bid form {
	width: 100%;
}
.item-buy, .item-bid {
	flex-basis: 50%;
}
.item-buy, .item-bid, .item-time {
	display: flex;
	flex-flow: column;
	align-items: center;
	justify-content: center;
	text-align: center;
}
.item-buy span, .item-bid span, .item-max-bid {
	white-space: nowrap;
}
.item-price {
	text-align: center;
}
.item-bid-purchase {
	white-space: nowrap;
}
.item-actions .item-buy input[type="submit"], .item-actions .item-bid input[type="submit"] { margin-top: 0; }
.item-bid-form {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1px;
}
.item-actions input[type="number"] {
	width: 50px;
}
.item-actions input[type="submit"] {
	align-self: center;
}
.item-fee-details {
	font-size: 0.8em;
	text-align: center;
}

#bazaar-pages {
	display: flex;
	justify-content: space-between;
	margin-top: 16px;
}
#bazaar-pages a.disabled {
	color: #422626;
	cursor: not-allowed;
}

#charbazaar form { display: block; margin-top: 0em; margin-block-end: 0em; }
.BigButtonText { position: absolute; top: 0; left: 0; width: 135px; height: 25px; margin: 0; padding: 0; cursor: pointer; background: 0 0; border: none; text-align: center; color: #ffd18c; font-family: Verdana,Arial,Times New Roman,sans-serif; font-size: 12px; font-weight: 400; z-index: 20; text-shadow: -1px -1px 0 #000, 0 -1px 0 #000, 1px -1px 0 #000, 1px 0 0 #000, 1px 1px 0 #000, 0 1px 0 #000, -1px 1px 0 #000, -1px 0 0 #000; }
.LevelRange { float: left; height: 8px; width: 8px; margin-right: 5px; border-bottom: 1px solid #000; }
.LevelRangeInput { text-align: right; width: 100px; }
.AuctionInput { width: 115px; margin-right: 7px; float: left; }
.AuctionFilterHelper { clear: both; }
.AuctionInputLong { width: 237px; }
#CurrentTradesItemSearch #ItemInput { width: 350px; }
.DisplayOptionsContent #ItemInput { width: 352px; }
.DisplayOptionsContent { min-height: 25px; min-width: 600px; }
.DisplayOptionsContent .DisplayOptionsLabel { float: left; padding-top: 2px; }
.DisplayOptionsButton .BigButton { position: absolute; right: 5px; }
.Content .BoxContent td { font-family: Verdana,Arial,Times New Roman,sans-serif; font-size: 10pt; color: #5a2800; }
.LabelV100 { font-weight: 700; padding-right: 10px; white-space: nowrap; vertical-align: top; width: 100px; }
.LabelV120 { font-weight: 700; padding-right: 10px; white-space: nowrap; vertical-align: top; width: 120px; }
.PageNavigation { padding-right: 10px; padding-bottom: 7px; }
.TableContentContainer { border: 1px solid #5f4d41; position: relative; margin-right: 7px; margin-bottom: 5px; height: 100%; background-color: #d4c0a1; padding: 0; }
.InnerTableContainer .TableContentContainer { box-shadow: 3px 3px 2px #875f3e; }
.AuctionLinks { position: absolute; right: 6px; top: 4px; height: 15px; }
.AuctionLinks a { margin-left: 5px; }
.AuctionCharacterName { font-weight: 700; margin-bottom: 4px; }
.AuctionBody { display: flex; width: 100%; flex-wrap: wrap; justify-content: flex-start; align-items: stretch; align-content: stretch; margin-top: 5px; padding-top: 5px; border-top: 1px dashed #5a2800; }
.AuctionOutfit { position: relative; }
.AuctionBodyBlock { margin-top: 5px; margin-bottom: 5px; }
.AuctionDisplay { flex-basis: 114px; flex-grow: 0; flex-shrink: 0; order: 0; padding: 1px; background-color: #f1e0c6; border: 1px solid #5a2800; box-shadow: 2px 2px 5px 0 rgb(0 0 0 / 75%); float: left; margin-right: 10px; }
.AuctionNewIcon { position: absolute; left: -4px; top: -4px; z-index: 105; }
.AuctionOutfitImage { position: absolute; left: 5px; top: 2px; width: 64px; height: 64px; z-index: 100; display: flex; align-items: flex-end; justify-content: flex-end; }
.AuctionOutfitImage img { image-rendering: crisp-edges; image-rendering: pixelated; }
.AuctionItemsViewBox { display: grid; grid-template-columns: repeat(auto-fill,minmax(36px,1fr)); grid-auto-rows: 38px; }
.VSCCoinImages { position: relative; width: 12px; height: 12px; margin-left: 2px; margin-right: 2px; }
.CVIcon.CVIconObject { width: 36px; height: 36px; overflow: hidden; }
.CVIcon { float: left; position: relative; z-index: 150; cursor: help; background-color: #d5c0a1; border: 1px solid #5a2800; margin: auto; padding: 1px; width: 64px; height: 64px; overflow: hidden; image-rendering: crisp-edges; image-rendering: pixelated; }
.CVIcon.CVIconObject img { width: 32px; height: 32px; }
.ObjectAmount { position: absolute; bottom: 0; right: 2px; font-family: Arial,Helvetica,sans-serif; font-size: 10px; font-weight: 700; z-index: 100; color: #fff; text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000; }
.ShortAuctionData { position: relative; min-width: 250px; flex-shrink: 0; flex-grow: 1; padding: 10px; padding-top: 2px; padding-bottom: 2px; text-align: left; background-color: #f1e0c6; border: 1px solid #5a2800; box-shadow: 2px 2px 5px 0 rgb(0 0 0 / 50%); }
.ShortAuctionData .AuctionTimer { position: absolute; top: 18px; right: 10px; width: 200px; text-align: right; background-color: #f1e0c6; color: red; }
.ShortAuctionData .ShortAuctionDataLabel { width: 115px; font-weight: 700; float: left; }
.ShortAuctionDataValue { text-align: right; }
.ShortAuctionDataBidRow { margin-top: 5px; }
.CurrentBid { width: 142px; flex-shrink: 0; margin-left: 10px; padding: 5px; text-align: center; background-color: #f1e0c6; border: 1px solid #5a2800; box-shadow: 2px 2px 5px 0 rgb(0 0 0 / 50%); display: flex; flex-direction: column; justify-content: space-around; }
.CurrentBid .Container { margin-right: auto; margin-left: auto; text-align: center; }
.MyMaxBidLabel { font-weight: 700; }
.MyMaxBidInput { width: 131px; margin-top: 4px; margin-bottom: 4px; }
.SpecialCharacterFeatures { flex-basis: 300px; flex-grow: 1; display: flex; flex-direction: column; justify-content: center; align-content: stretch; align-items: center; padding: 10px; background-color: #f1e0c6; border: 1px solid #5a2800; box-shadow: 2px 2px 5px 0 rgb(0 0 0 / 50%); }
.SpecialCharacterFeatures .Entry { width: 100%; min-width: 300px; text-align: left; }
.SpecialCharacterFeatures .CharacterFeatureCategory { margin-right: 5px; }
.AuctionInfo { width: 100%; text-align: center; font-weight: 700; font-size: 12px; color: #ff9712; }
.LabelColumn { width: 80px!important; white-space: nowrap; }
.LevelColumn { width: 30px!important; text-align: right; }
.PercentageColumn { position: relative; margin-right: 2px; }
.PercentageColumn { width: 100%; position: relative; }
.PercentageBar { position: absolute; height: 18px; background-color: #5f4d41; top: 1px; }
.PercentageBarSpacer { width: 5px; }
.PercentageStringContainer { width: 100%; text-align: center; }
.PercentageString { position: absolute; top: 3px; width: 50%; margin-left: 20px; left: 0; text-align: right; font-family: Arial,Helvetica,sans-serif; font-size: 12px; font-weight: 700; color: #fff; text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000; }
.BlockPageNavigationRow { height: 20px; margin-top: 3px; margin-bottom: 5px; padding: 6px; padding-top: 3px; padding-bottom: 0; background-color: #d5c0a1; border: 1px solid #5a2800; }
.BlockPage.BlockPageObject { grid-template-columns: repeat(auto-fill,minmax(36px,1fr)); grid-auto-rows: 38px; }
.BlockPage { display: grid; grid-template-columns: repeat(auto-fill,minmax(68px,1fr)); grid-auto-rows: 73px; grid-gap: 1px; }
.PageLink { display: inline-block; min-width: 15px; text-align: center; }
.BlockPageNavigationRow .CurrentPageLink { display: block; min-width: 15px; padding-left: 2px; padding-right: 2px; background-color: #d5c0a1; }
.CharacterDetailsBlock .ShowMoreOrLess { padding: 7px; padding-bottom: 7px; font-size: 8pt; text-align: right; }
.CharacterDetailsBlock .ShowMoreOrLess a { cursor: pointer; }
.CollapsedBlock .TableContent tr:last-child { display: table-row; text-align: center; }
.CollapsedBlock .IndicateMoreEntries { font-style: italic; }
.ColorGreen { color: green; }
.CharacterTradeTibiaCoinBalance { position: absolute; top: 8px; color: #fff; right: 5px; font-size: 7pt; }
.bazaar-outfits-list { display: flex; justify-content: space-around; gap: 16px; flex-wrap: wrap; }
.bazaar-outfits-list div { width: 64px; height: 64px; position: relative; }
.bazaar-outfits-list div img { position: absolute; bottom: 0; right: 0; image-rendering: pixelated; }