/*
	Original dark colors for background:
	#0d0c11
	#312d3c
	
	Dark gradient color for background:
	background: rgba(49,45,60,1);
	background: -moz-linear-gradient(top, rgba(49,45,60,1) 0%, rgba(32,30,40,1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(49,45,60,1)), color-stop(100%, rgba(32,30,40,1)));
	background: -webkit-linear-gradient(top, rgba(49,45,60,1) 0%, rgba(32,30,40,1) 100%);
	background: -o-linear-gradient(top, rgba(49,45,60,1) 0%, rgba(32,30,40,1) 100%);
	background: -ms-linear-gradient(top, rgba(49,45,60,1) 0%, rgba(32,30,40,1) 100%);
	background: linear-gradient(to bottom, rgba(49,45,60,1) 0%, rgba(32,30,40,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#312d3c', endColorstr='#201e28', GradientType=0 );
	
	
	Strip light background:
	#c2a9ac
	
	Strip light gradient background:
	background: rgba(194,169,172,1);
	background: -moz-linear-gradient(top, rgba(194,169,172,1) 38%, rgba(176,153,156,1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(38%, rgba(194,169,172,1)), color-stop(100%, rgba(176,153,156,1)));
	background: -webkit-linear-gradient(top, rgba(194,169,172,1) 38%, rgba(176,153,156,1) 100%);
	background: -o-linear-gradient(top, rgba(194,169,172,1) 38%, rgba(176,153,156,1) 100%);
	background: -ms-linear-gradient(top, rgba(194,169,172,1) 38%, rgba(176,153,156,1) 100%);
	background: linear-gradient(to bottom, rgba(194,169,172,1) 38%, rgba(176,153,156,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c2a9ac', endColorstr='#b0999c', GradientType=0 );
*/

@font-face {
  font-family: "OpenSans";
  src: url("../fonts/OpenSans-Regular.ttf");
}

@font-face {
	font-family: "OpenSansMedium";
	src: url("../fonts/OpenSans-Medium.ttf");
}

@font-face {
	font-family: "OpenSansSemibold";
	src: url("../fonts/OpenSans-Semibold.ttf");
}

@font-face {
	font-family: "OpenSansBold";
	src: url("../fonts/OpenSans-Bold.ttf");
}

@font-face {
	font-family: "Coolvetica";
	src: url("../fonts/coolvetica rg.ttf");
}

body {
	background-color: #010109;
	cursor: default;
	margin: 0px;
	padding: 0px;
}

h1, h2, h3 {
	font-family: OpenSansBold;
	font-weight: normal;
}

table {
}

table th {
	font-family: OpenSansBold;
	font-weight: normal;
}

table .darkCell {
	background-color: #2e293b;
	color: #e4e4e4;
}

table .darkCellGradient {
	background: rgba(49,45,60,1);
	background: -moz-linear-gradient(top, rgba(49,45,60,1) 0%, rgba(32,30,40,1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(49,45,60,1)), color-stop(100%, rgba(32,30,40,1)));
	background: -webkit-linear-gradient(top, rgba(49,45,60,1) 0%, rgba(32,30,40,1) 100%);
	background: -o-linear-gradient(top, rgba(49,45,60,1) 0%, rgba(32,30,40,1) 100%);
	background: -ms-linear-gradient(top, rgba(49,45,60,1) 0%, rgba(32,30,40,1) 100%);
	background: linear-gradient(to bottom, rgba(49,45,60,1) 0%, rgba(32,30,40,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#312d3c', endColorstr='#201e28', GradientType=0 );
	color: #e4e4e4;
}

form {
	margin: 0px;
}

input[type="checkbox"] {
	margin: 2px 0px;
}

input[type="button"].add, input[type="submit"].add {
	background: url("../images/buttons/add.png") no-repeat;
	width: 14px;
	height: 14px;
	border: none !important;
	background-color: none !important;
	border-radius: 0px !important;
	cursor: pointer;
	
	box-shadow: none !important;
	-webkit-box-shadow: none !important;
	-moz-box-shadow: none !important;
}

input[type="button"].delete, input[type="submit"].delete {
	background: url("../images/buttons/delete.png") no-repeat;
	width: 14px;
	height: 14px;
	border: none !important;
	background-color: none !important;
	border-radius: 0px !important;
	cursor: pointer;
	
	box-shadow: none !important;
	-webkit-box-shadow: none !important;
	-moz-box-shadow: none !important;
}

input[type="button"].search, input[type="submit"].search {
	background: url("../images/buttons/search.png") no-repeat center center;
	width: 23px;
	height: 23px;
	background-color: #070606;
	cursor: pointer;
	top: 1px;
	position: relative;
	border: 1px solid #666;
	border-radius: 1px;
	
	box-shadow: none !important;
	-webkit-box-shadow: none !important;
	-moz-box-shadow: none !important;
}

select.black {
	background: url("../images/dropdown/arrow.png") no-repeat right 2px center;
	background-color: #070606;
	color: #918c84;
	font-family: OpenSansBold;
	font-size: 13px;
	
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	
	-webkit-padding-end: 20px;
}

select.black:hover {
	border: 1px solid #555;
}

input[type="button"].black, input[type="submit"].black, button.black, a.buttonBlack {
	outline: 1px solid #222;
	background-color: #070606;
	color: #918c84;
	padding: 6px;
	border: 1px solid #918c84;
	font-family: OpenSansBold;
	cursor: pointer;
}

input[type="button"].black:hover:enabled, input[type="submit"].black:hover:enabled, button.black:hover:enabled, a.buttonBlack:hover {
	color: #827c75;
}

/*
input[type="button"].black:disabled, input[type="submit"].black:disabled, button.black:disabled {
	background-color: #666 !important;
	cursor: default !important;
}
*/

input[type="button"].blackSmall, input[type="submit"].blackSmall, button.blackSmall, a.buttonBlackSmall {
	outline: 1px solid #222;
	background-color: #070606;
	color: #918c84;
	padding: 2px 6px;
	border: 1px solid #918c84;
	font-family: OpenSansBold;
	cursor: pointer;
	font-size: 12px;
}

input[type="button"].blackSmall:hover:enabled, input[type="submit"].blackSmall:hover:enabled, button.blackSmall:hover:enabled, a.buttonBlackSmall:hover {
	color: #827c75;
}

/*
input[type="button"].blackSmall:disabled, input[type="submit"].blackSmall:disabled, button.blackSmall:disabled {
	background-color: #666 !important;
	cursor: default !important;
}
*/

input[type="submit"].disabled, input[type="button"].disabled, button.disabled, a.disabled {
	color: #777;
	opacity: 0.6;
	cursor: default !important;
}

button, input[type="submit"] {
	outline: none;
}


button.light, input[type="submit"].light, a.buttonLight {
	color: #000 !important;
	text-decoration: none;
	border-radius: 3px;
	background: #e5dadb;
	border: 2px solid #725b60;
	padding: 5px 15px;
	cursor: pointer;
}

button.lightSmall, input[type="submit"].lightSmall {
	color: #000;
	text-decoration: none;
	border-radius: 3px;
	background: #e5dadb;
	border: 2px solid #725b60;
	padding: 2px 15px;
	cursor: pointer;
	font-size: 12px;
}

button.lightBig, input[type="submit"].lightBig {
	color: #000;
	text-decoration: none;
	border-radius: 3px;
	background: #e5dadb;
	border: 2px solid #725b60;
	padding: 10px 15px;
	cursor: pointer;
	font-size: 18px;
}

button.light:hover, input[type="submit"].light:hover, button.lightSmall:hover, input[type="submit"].lightSmall:hover, button.lightBig:hover, input[type="submit"].lightBig:hover, a.buttonLight:hover {
	background: #d3c9ca;
	text-decoration: none !important;  /* for links */
}

button.darkButton, input[type="submit"].darkButton, a.darkButton {
	text-decoration: none !important;
	background-color: #302d40;
	background: linear-gradient(180deg, #3e3b53 30%, #302d40 70%);
	border-radius: 5px;
	font-family: OpenSansSemiBold;
	text-align: center;
	color: #ddd !important;
	padding: 1px 8px;
	border: 2px solid #282635;
	cursor: pointer;
	font-size: 12px;
	
	user-select: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	-ms-user-select: none;
}

button.darkButton:not(.hidden), input[type="submit"].darkButton:not(.hidden), a.darkButton:not(.hidden) {
	display: inline-block;
}

button.darkButton:not([disabled]):not(.disabled):hover, input[type="submit"].darkButton:not([disabled]):not(.disabled):hover, a.darkButton:not([disabled]):not(.disabled):hover {
	background: linear-gradient(180deg, #4b4863 30%, #3b374f 70%);
	border: 2px solid #343245;
}

button.darkButton:not([disabled]):not(.disabled):active, input[type="submit"].darkButton:not([disabled]):not(.disabled):active, a.darkButton:not([disabled]):not(.disabled):active {
	background: linear-gradient(180deg, #3b374f 30%, #4b4863 70%);
}

button.darkButton.disabled, input[type="submit"].darkButton.disabled, a.darkButton.disabled {
	color: #bbb !important;
}

button.darkButtonBig, input[type="submit"].darkButtonBig, a.darkButtonBig {
	padding: 6px 12px;
	font-size: 14px;
}

button.darkButtonMedium, input[type="submit"].darkButtonMedium, a.darkButtonMedium {
	padding: 4px 8px;
	font-size: 13px;
}

a.dark {
	color: #0d0c11 !important;
	text-decoration: underline !important;
}

button.outerDarkButton, input[type="submit"].outerDarkButton, a.outerDarkButton {
	display: inline-block;
    background-image: url("../images/buttons/outer_button_middle.png");
    background-repeat: repeat-x;
	height: 48px;
    border: none;
    color: #ddd !important;
	line-height: 44px !important;
	
	position: relative;
    padding: 0px;
    margin: 5px;
	/*line-height: 24px;*/
	cursor: pointer;
	background-color: transparent;
	font-family: OpenSansBold;
	font-size: 14px;
	
	user-select: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	-ms-user-select: none;
}

button.outerDarkButton::before, input[type="submit"].outerDarkButton::before, a.outerDarkButton::before {
	position:absolute;
    width: 32px;
    height: 48px;
	left: -32px;
	top: 0px;
	background-image: url("../images/buttons/outer_button_left.png");
	content: "";
}

button.outerDarkButton::after, input[type="submit"].outerDarkButton::after, a.outerDarkButton::after {
	position:absolute;
    display: inline-block;
    width: 32px;
    height: 48px;
	right: -32px;
	top: 0px;
    background-image: url("../images/buttons/outer_button_right.png");
    content: "";
	
	background-size: cover;
	-webkit-background-size: cover;
	-ms-background-sice:  cover;
	-o-background-size: cover;
}

button.outerDarkButton:hover, input[type="submit"].outerDarkButton:hover, a.outerDarkButton:hover {
	text-decoration: none !important;
}

button.outerDarkButton:active, input[type="submit"].outerDarkButton:active, a.outerDarkButton:active {
	top: 1px;
}

button.buttonPlus {
	font-size: 15px;
	font-family: OpenSansBold;
	padding: 0px 6px;
}


input[type="text"]:focus, input[type="password"]:focus, input[type="number"]:focus {
	outline: none;
	
	box-shadow: 0px 0px 4px 0px rgba(114, 91, 96, 0.75);
	-webkit-box-shadow: 0px 0px 4px 0px rgba(114, 91, 96, 0.75);
	-moz-box-shadow: 0px 0px 4px 0px rgba(114, 91, 96, 0.75);
}

.ajaxProcessing {
	pointer-events: none;
}

.content button.ajaxProcessing, .content input[type="submit"].ajaxProcessing, .content a.ajaxProcessing,
.contentTable button.ajaxProcessing, .contentTable input[type="submit"].ajaxProcessing, .contentTable a.ajaxProcessing,
.stripDark button.ajaxProcessing, .stripDark input[type="submit"].ajaxProcessing, .stripDark a.ajaxProcessing,
.contentFight .panelButtons .ajaxProcessing,
.arenaPlayerSearch .ajaxProcessing,
.layout-top .resources .resource .iconBuy.ajaxProcessing,
.layout-top .middlePanel .energyAmountPanel .iconBuy.ajaxProcessing,
.contentTribeForumThreadComment a.ajaxProcessing {
	opacity: 0.7;
}

.topPanelPremium a.ajaxProcessing {
	opacity: 0.5;
}

.outerDarkButton.ajaxProcessing {
	opacity: 0.7;
	color: #aaa !important;
}

.layout-top .notificationsPanel .ajaxProcessing,
.boxCharacter a.ajaxProcessing {
	opacity: 0.8;
}

.alignCenter {
	margin-left: auto;
	margin-right: auto;
}

.textCenter {
	text-align: center;
}

.textLeft {
	text-align: left;
}

.textRight {
	text-align: right;
}

.textNowrap {
	white-space: nowrap;
}

.hidden {
	display: none;
}

.hiddenHard {
	display: none !important;
}

.clear {
	clear: both;
}

.centeredText {
	text-align: center;
}

.centered {
	margin-left: auto !important;
	margin-right: auto !important;
}

.clickable {
	cursor: pointer;
}

.zoomable {
	cursor: zoom-in;
}

.inline-block {
	display: inline-block;
}

.bold {
	font-weight: bold;
}

.boldFont {
	font-family: OpenSansBold !important;
}

.right {
	color: #007700;
}

.wrong {
	color: #cc0000;
}

.uppercaseLetters {
	text-transform: uppercase;
}

.cursorDefault {
	cursor: default !important;
}

.clear {
	clear: both;
}

.tinyShadow {
	box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
	-webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
	-moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
}

.boxShadow {
	box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.3);
	-webkit-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.3);
}

.boxShadowMedium {
	box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.6);
	-webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.6);
	-moz-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.6);
}

.boxShadowBig {
	box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.6);
	-webkit-box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.6);
	-moz-box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.6);
}

table th.halfSize, table td.halfSize {
	width: 50%;
}

.iconEnergy {
	display: inline-block;
	vertical-align: bottom;
	width: 14px;
	height: 17px;
	background-image: url("../images/icons/icon_energy.png");
	background-size: contain;
}

.pageInactivityAjaxSpinnerBackground {
	display: none;
	position: fixed;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.80);
	z-index: 1000;
	
	user-select: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	-ms-user-select: none;
}

.pageInactivityAjaxSpinnerBackground .spinnerArea {
	position: relative;
	margin: 10% auto;
}

.pageInactivityAjaxSpinnerBackground .text {
	margin: 60px auto 0px auto;
	font-size: 18px;
	/* color: #f4f4f4; */
	color: gold;
	font-family: OpenSansSemibold;
	text-align: center;
	padding: 20px 80px;
	background-color: #000;
	width: max-content;
	border: 1px solid #2a2a2a;
}

.pageInactivityAjaxSpinnerBackground .links {
	margin: 50px auto 0px auto;
	width: max-content;
}

.pageInactivityAjaxSpinnerBackground .links a {
	color: #eee;
	text-decoration: none;
	font-family: OpenSansMedium;
	font-size: 14px;
	padding: 10px 25px;
	margin: 0px 7px;
	background-color: #000;
	border: 1px solid #2a2a2a;
}

.pageInactivityAjaxSpinnerBackground .links a:hover {
	text-decoration: underline;
}

.pageInactivityAjaxSpinnerBackground .loader, .pageInactivityAjaxSpinnerBackground .loader:before, .pageInactivityAjaxSpinnerBackground .loader:after {
	width: 2.5em;
	height: 2.5em;
	border-radius: 50%;
	
	animation-fill-mode: both;
	-webkit-animation-fill-mode: both;
	
	animation: pageInactivityAjaxSpinnerAnimation 1.8s infinite ease-in-out;
	-webkit-animation: pageInactivityAjaxSpinnerAnimation 1.8s infinite ease-in-out;
}

.pageInactivityAjaxSpinnerBackground .loader {
	position: relative;
	margin: 0px auto;
	color: #ffffff;
	font-size: 10px;
	text-indent: -9999em;
	
	transform: translateZ(0);
	-webkit-transform: translateZ(0);
	-ms-transform: translateZ(0);
	
	animation-delay: -0.16s;
	-webkit-animation-delay: -0.16s;
}

.pageInactivityAjaxSpinnerBackground .loader:before,
.pageInactivityAjaxSpinnerBackground .loader:after {
	position: absolute;
	top: 0px;
	content: '';
}

.pageInactivityAjaxSpinnerBackground .loader:before {
	left: -3.5em;
	
	animation-delay: -0.32s;
	-webkit-animation-delay: -0.32s;
}

.pageInactivityAjaxSpinnerBackground .loader:after {
	left: 3.5em;
}

@-webkit-keyframes pageInactivityAjaxSpinnerAnimation {
	0%,
	80%,
	100% {
		box-shadow: 0px 2.5em 0px -1.3em;
		-webkit-box-shadow: 0px 2.5em 0px -1.3em;
		-moz-box-shadow: 0px 2.5em 0px -1.3em;
	}
	
	40% {
		box-shadow: 0px 2.5em 0px 0px;
		-webkit-box-shadow: 0px 2.5em 0px 0px;
		-moz-box-shadow: 0px 2.5em 0px 0px;
	}
}

@keyframes pageInactivityAjaxSpinnerAnimation {
	0%,
	80%,
	100% {
		box-shadow: 0px 2.5em 0px -1.3em;
		-webkit-box-shadow: 0px 2.5em 0px -1.3em;
		-moz-box-shadow: 0px 2.5em 0px -1.3em;
	}

	40% {
		box-shadow: 0px 2.5em 0px 0px;
		-webkit-box-shadow: 0px 2.5em 0px 0px;
		-moz-box-shadow: 0px 2.5em 0px 0px;
	}
}

.itemSlotContainer {
	position: relative;
	display: inline-block;
}

.itemSlotContainer .itemTooltipIcon {
	position: absolute;
	top: 2px;
	right: 2px;
	width: 24px;
	height: 24px;
	z-index: 1100; /* must be higher than in .ui-draggable */
	
	background-image: url("../images/map/icon_question.png");
	
	background-size: contain;
	-webkit-background-size: contain;
	-ms-background-sice: contain;
	-o-background-size: contain;
}

.itemSlot {
	position: relative;
	
	display: inline-block;
	width: 77px;
	height: 77px;
	padding: 0px;
	margin: 1px;
	
	background-color: #131119;
	border: 1px solid #1b1a23;
}

.itemSlot.questPreview {
	background-size: cover;
	width: 47px;
	height: 47px;
}

.itemSlot.templeTreasurePreview {
	background-size: cover;
	width: 72px;
	height: 72px;
}

.itemSlot.marketPreview {
	background-size: cover;
	width: 60px;
	height: 60px;
}

.itemSlot.storehousePreview {
	width: 70px;
	height: 70px;
}

.itemSlotHover {
	opacity: 0.7;
}

.itemSlotDisabled {
	background: repeating-linear-gradient(
	  -55deg,
	  #0f0d15,
	  #0f0d15 10px,
	  #050505 20px,
	  #050505 20px
	);
	
	border: 1px solid #12101a !important;
}

.itemSlotContainerShadow .itemSlot {
	box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, 0.8);
	-webkit-box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, 0.8);
	-moz-box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, 0.8);
}

.itemSlotShadow {
	box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, 0.8);
	-webkit-box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, 0.8);
	-moz-box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, 0.8);
}

.itemSlot .backgroundGlow {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
}

.itemSlot .backgroundGlow.backgroundGlowGreen {
	background-image: url("../images/common/items_glow_green.png");
	background-size: contain;
}

.itemSlot .itemImage {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	
	background-size: contain;
}

.itemSlot .enhancement {
	position: absolute;
	bottom: 0px;
	right: 0px;
	font-size: 15px;
	font-family: OpenSansSemibold;
	
	/*
	text-shadow: 0px 0px 5px #000;
	*/
	

	text-shadow:
	   -1px -1px 0px #000,  
		1px -1px 0px #000,
		-1px 1px 0px #000,
		 1px 1px 0px #000;
	
	/* text-shadow: 0px 0px 5px #000; */
	
	user-select: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	-ms-user-select: none;
}

.itemSlot .enhancement span {
	display: block;
	
	
	background: rgba(18, 17, 25, 0.8);
	padding: 0px 2px;
	border-radius: 20px;
	
	
	margin-bottom: 1px;
	margin-right: 0px;
	/* background: rgba(0, 0, 0, 0.75); */
	/* border-radius: 10px; */
}

.itemSlot .enhancement .enhancementAttributes {
	color: #e05a69;
}

.itemSlot .enhancement .enhancementWeaponDamage {
	color: #ff5e5e;
}

.itemSlot .enhancement .enhancementLevel {
	margin-bottom: 2px;
	height: 2px;
	width: 10px;
	background: yellow;
}

.itemSlot .enchantment {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 22px;
	height: 21px;
	
	background-image: url("../images/icons/item_enchantment.png");
	
	background-size: contain;
	-webkit-background-size: contain;
	-ms-background-sice:  contain;
	-o-background-size: contain;
	
	/*
	border-radius: 100%;
	background-color: #7a4cba;
	border: 1px solid #41245e;
	box-shadow: 0px 0px 4px 1px #000;
	-webkit-box-shadow: 0px 0px 4px 1px #000;
	-moz-box-shadow: 0px 0px 4px 1px #000;
	*/
	
	user-select: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	-ms-user-select: none;
}

.itemSlot .potionStatusSign {
	position: absolute;
	top: 3px;
	right: 3px;
	width: 8px;
	height: 8px;
	border-radius: 50px;
}

.itemSlot .potionStatusSign.high {
	background-color: #22cc22;
}

.itemSlot .potionStatusSign.medium {
	background-color: #dd7700;
}

.itemSlot .potionStatusSign.low {
	background-color: #cc0000;
}

.itemSlot .item, .itemSlotContainer .item {
	width: 81px;
	height: 80px;
	
	background-size: 81px 80px;
	-webkit-background-size: 81px 80px;
	-ms-background-sice:  81px 80px;
	-o-background-size: 81px 80px;
}

.tooltipsContainer {
	width: max-content;
}

.tooltipsContainer .tooltip {
	display: inline-block;
	vertical-align: top;
	margin-left: 1px;
}

.tooltip {
	color: #ddd;
	background: black;	
	font-family: OpenSansSemibold;
}

.tooltip table {
	color: #ddd;
	font-size: 9px;
}

.tooltip .smallHeading {
	margin-top: 1px;
	margin-bottom: 1px;
	color: #dbb100;
	font-size: 13px;
}

.tooltipDefault {
	background: #060606;
	/* padding: 3px; */
	padding: 10px;
	border: 1px solid #777;
	/* font-size: 10px; */
	font-size: 13px;
	border-radius: 2px;
	opacity: 0.97;
	color: #ddd;
	
	background: #0c0c0c;
	border: 1px solid #444;
	border-top: 1px solid #777;
	opacity: 0.99;
	
	max-width: 600px;
}

.tooltipDefault .heading {
	color: gold;
	font-size: 14px;
}

.tooltipDefault .heading:not(:first-of-type) {
	margin-top: 20px;
}

.tooltipDefault .description {
	margin-top: 10px;
	color: #f2f2f2;
}

.tooltipDefault table {
	color: #ddd;
}

.tooltipDefault table th, .tooltipDefault table td {
	font-size: 13px;
}

.tooltipText {
	/* font-size: 11px !important; */
}

.tooltipText table {
	/* font-size: 11px !important; */
}

.tooltipLevelPanel {
	width: max-content;
}

.tooltipLevelPanel table td {
	padding-left: 10px;
}

.tooltipLevelPanel .percents {
	margin-left: 5px;
	font-size: 12px;
	color: #fcc82b;
}

.tooltipPlayerAvatarArea {
	min-width: 200px;
	max-width: 400px;
	width: max-content;
}

.tooltipPlayerAvatarArea .playerName {
	margin-bottom: 5px;
	color: #fcc82b;
	font-size: 16px;
}

.tooltipPlayerAvatarArea table {
	margin-left: -3px;
	
	/* font-family: OpenSans; */
}

.tooltipPlayerAvatarArea table td {
	padding: 2px 0px;
	font-size: 12px;
}

.tooltipPlayerAvatarArea table td.label {
	padding-right: 5px;
}

.tooltipPlayerAvatarArea .percents {
	margin-left: 5px;
	font-size: 12px;
	color: #fcc82b;
}


.tooltipAttribute {
	min-width: 300px;
	max-width: 400px;
	width: max-content;
	padding: 15px 15px;
	font-family: OpenSans;
	background-color: #141414;
	border-radius: 6px;
	border: 1px solid #444;
}

.tooltipAttribute .attributeName {
	font-size: 15px;
	color: #fcc82b;
}

.tooltipAttribute .heading {
	margin: 12px 0px 6px 0px;
	color: #a4a4a4;
	font-size: 14px;
	border-bottom: 1px solid #333;
	
	text-shadow: 0px 0px 2px #222;
}

.tooltipAttribute .attributeDetails {
}

.tooltipAttribute .attributeDetails table {
	border-spacing: 0px;
	border-collapse: separate;
}

.tooltipAttribute .attributeDetails table td {
	padding: 0px;
	font-size: 12px;
}

.tooltipAttribute .attributeDetails table td:nth-child(1) {
	padding-right: 20px;
}

.tooltipAttribute .attributeDetails table .bonus {
	color: #00ee00;
}

.tooltipAttribute .attributeDetails table .bonusDecrease {
	color: #fa3434;
	text-shadow: 0px 0px 1px #c91004;
}

.tooltipAttribute .attributeDetails table .total td {
	color: #fcc82b;
	padding-top: 2px;
}

.tooltipAttribute .attributeDescription {
	margin-top: 20px;
	padding-top: 8px;
	color: #949494;
	font-size: 12px;
	text-align: center;
	border-top: 1px solid #333;
}

.tooltipAttribute .attributeDetailEffect {
	margin-top: 5px;
	color: #fcc82b;
}

.tooltipAttribute .specializationBonusText {
	margin-top: 3px;
	margin-left: 10px;
	color: #00ee00;
	font-size: 11px;
}

.tooltipAttribute td.overMax {
	color: #fa3434;
	text-shadow: 0px 0px 1px #c91004;
}

.tooltipAttribute .attributeDetails table td.space {
	padding: 5px 0px;
}

.tooltipAttribute .attributeSubInfo {
	margin-top: 3px;
	margin-bottom: 5px;
	margin-left: 15px;
	padding-left: 6px;
	font-size: 12px;
	color: #ddd;
	border-left: 1px solid #aaa;
}


.tooltip table {
	
}

.tooltip table th {
}

.tooltipItem {
	min-width: 200px;
	max-width: 350px;
	width: max-content;
	padding: 15px 15px;
	font-family: OpenSans;
	color: #e6e6e6;
	background-color: #111;
	border-radius: 6px;
	border: 1px solid #444;
	
	background: linear-gradient(180deg, rgba(18,18,18,1) 0%, rgba(13,13,13,1) 75%);
}

.tooltipItem .itemOnCharacter {
	display: inline-block;
	position: relative;
	top: 3px;
	float: right;
	margin-left: 20px;
	font-size: 12px;
	font-family: OpenSansSemibold;
	color: gold;
}

.tooltipItem .itemOnCharacter2 {
	margin-top: 15px;
	padding-top: 10px;
	font-size: 13px;
	font-family: OpenSansMedium;
	color: gold;
	text-align: center;
	border-top: 2px dashed #444;
}

.tooltipItem .itemName {
	margin-bottom: 8px;
	/* font-size: 15px; */
	font-size: 14px;
	text-align: left;
	font-family: OpenSansSemiBold;
}

.tooltipItem .tier1 {
	color: #f4f4f4;
}

.tooltipItem .tier2 {
	color: rgb(0, 222, 0);
}

.tooltipItem .tier3 {
	color: #1f94ed;
	text-shadow: 0px 0px 1px #0064b0;
}

.tooltipItem .tier4 {
	color: #ff4860;
}

.tooltipItem .scroll {
	color: #1f94ed;
}

.tooltipItem .herb {
	color: rgb(0, 222, 0);
}

.tooltipItem .potion {
	color: rgb(0, 222, 0);
}

.tooltipItem .specialPotion {
	color: #1888f4;
}

.tooltipItem .enhancedName {
	color: #ff5e5e;
	text-shadow: -1px 0px 4px #3d0d63, 0px 0px 4px #3d0d63;
}

.tooltipItem .damage {
	font-size: 13px;
	text-align: left;
	color: #f2f2f2;
}

.tooltipItem table.tooltipAttributes {
	margin-top: 8px;
	width: 100%;
	font-size: 13px;
	text-align: left;
	color: #f4f4f4;
}

.tooltipItem table.tooltipAttributes td {
	padding: 0px;
}

.tooltipItem table.tooltipAttributes td.attributeInfo {
	min-width: 220px;
}

.tooltipItem table.tooltipAttributes td.detailedInfoItem {
	width: 1%;
	padding: 0px 2px;
	white-space: nowrap;
	text-align: right;
}

.tooltipItem table.tooltipAttributes .attributeValueDefault {
	font-family: OpenSans;
	color: #f4f4f4;
}

.tooltipItem .attributeBonus {
	color: #00e400;
}

.tooltipItem .attributeEnhanced {
	color: #ff5e5e;
	
	font-family: OpenSansSemibold;
}

.tooltipItem .attributeEnchantmentBonus {
	color: #c07aff;
}

.tooltipItem .specializationEnchantmentText {
	margin-top: 10px;
	color: #c07aff;
	font-family: OpenSansSemibold;
}

.tooltipItem .leftMargin {
	margin-left: 2px;
}

.tooltipItem .tooltipAttributes .attributeName {
	color: #f4f4f4;
}

.tooltipItem .itemDuration {
	margin-top: 10px;
	color: #aaa;
	font-size: 13px;
}

.tooltipItem .itemDuration .high {
	color: #22ee22;
}

.tooltipItem .itemDuration .medium {
	color: #ffa51c;
	text-shadow: 0px 0px 1px #ff9900;
}

.tooltipItem .itemDuration .low {
	color: #ff2222;
	text-shadow: 0px 0px 1px #ff2222;
}

.tooltipItem .scrollAttribute {
	margin-top: 10px;
	color: rgb(255, 209, 0);
	font-size: 13px;
}

.tooltipItem .scrollInformation {
	margin-top: 15px;
	font-size: 12px;
	color: #aaa;
}

.tooltipItem .enchantedItem {
	padding-top: 6px;
	color: #c07aff;
	
	font-family: OpenSansSemibold;
}

.tooltipItem .enhancedItem {
	padding-top: 6px;
	color: #ff5e5e;
	
	font-family: OpenSansSemibold;
}

.tooltipItem .itemEnhancement {
	margin-top: 8px;
	margin-bottom: 16px;
	color: #ff5e5e;
	font-size: 13px;
	text-align: left;
	
	font-family: OpenSansSemibold;
}

.tooltipItem .enhancementTypes {
	padding-top: 5px;
	font-weight: normal !important;
	font-size: 11px !important;
}

.tooltipItem .itemDescription {
	margin-top: 6px;
	color: #888;
	font-style: italic;
}

.tooltipItem .itemDescription hr {
	margin-top: 3px;
	border-top: 1px solid #444;
	border-bottom: none;
	border-left: none;
	border-right: none;
}

.tooltipItem .additionalAttributesInfo {
	margin-top: 3px;
	margin-bottom: 10px;
	font-size: 13px;
	text-align: left;
	color: rgb(255, 209, 0);
}

.tooltipItem .damageType {
	/* color: rgb(102, 187, 255); */
}

.tooltipItem .defenseType {
	/* color: rgb(102, 187, 255); */
}

.tooltipItem .magicAttackType {
	color: #ff9900;
}

.tooltipItem .additionalInfoSeparator {
	margin: 10px 0px 5px 0px;
	border-top: 1px solid #444;
}

.tooltipItem .additionalInfo {
	font-size: 13px;
}

/*
.tooltipItem .artifact {
	display: inline-block;
	margin-top: 5px;
	color: rgb(50, 150, 255);
	font-family: OpenSansSemiBold;
}
*/

.tooltipItem .tierLevel {
	color: rgb(255, 209, 0);
}

.tooltipItem .forQuest {
	margin-bottom: 10px;
	color: rgb(255, 209, 0);
	text-align: center;
	font-family: OpenSansSemibold;
	font-size: 15px;
}

.tooltipItem .level {
	padding-top: 6px;
	color: rgb(255, 209, 0);
}

.tooltipItem .itemPrice {
	margin-top: 10px;
}

.tooltipItem .itemPriceLabel {
}

.tooltipItem .additionalInfo {
}

.tooltipItem .additionalInfo .infoRow {
}

.tooltipItem .additionalInfo .infoRow span {
	display: inline-block;
	margin-right: 10px;
}

.tooltipItem .marketPricePremium {
	color: #00cc00;
}

.tooltipItem .marketPricePremiumCrossed {
	color: #ff0000;
	text-decoration: line-through;
}

.tooltipItem .marketPricePremiumText {
	color: #00cc00;
	font-size: 11px;
}

.tooltipItem .marketPrice {
	margin-top: 5px;
	margin-left: 5px;
}

.tooltipItem .marketItemPriceIncrease {
	margin: 10px auto 0px auto;
	text-align: center;
	font-family: OpenSansMedium;
	font-size: 13px;
	color: #ff3030;
	text-shadow: 0px 0px 0px #ee0000;
	max-width: 80%;
	width: max-content;
}

.tooltipItem .merchantSpecializationDiscount {
	margin-top: 8px;
	font-size: 12px;
	color: #00dd00;
}

.tooltipItem .goldFree {
	margin-top: 10px;
	color: #00dd00;
	font-family: OpenSansSemiBold;
	font-size: 13px;
}

.tooltipItem .herbPotionDuration {
	font-size: 13px;
}

.tooltipItem .potionUsages {
	margin-top: 10px;
}

.tooltipItem .potionUsages .use {
	color: #00e400;
}

.tooltipItem .potionUsages .notUse {
	color: #ee3333;
	text-shadow: 0px 0px 1px #dd0000;
}

.tooltipItem .attributeSubInfo {
	margin-top: 3px;
	margin-bottom: 5px;
	margin-left: 15px;
	padding-left: 6px;
	font-size: 12px;
	color: #ddd;
	border-left: 1px solid #aaa;
}

.tooltipItem .usedForSuffixSet {
	margin: 5px 0px 10px 0px;
	font-size: 13px;
	color: #aaa;
}


.tooltipPlayerEnergy {
	width: max-content;
	font-size: 13px;
}


.tooltip table .premium {
	padding-top: 2px;
	color: #00aa00;
}

.tooltipExpeditionFightParameters {
	min-width: 200px;
	font-size: 11px;
	padding: 4px 3px;
}

.tooltipExpeditionFightParameters .heading {
	color: #dbb100;
	text-align: center;
	margin-bottom: 6px;
	font-size: 14px;
}

.tooltipExpeditionFightParameters .smallHeading {
	margin-top: 5px;
}

.tooltipExpeditionFightParameters .list {
	margin-left: 8px;
}

.tooltipExpeditionFightParameters .list .listItem {
	margin-top: 2px;
	margin-bottom: 2px;
}

.tooltipWeekendEvent {
	width: 300px;
}

.tooltipWeekendEvent .weekendEventHeading {
	text-align: center;
	font-size: 15px;
	color: #fcc82b;
}

.tooltipWeekendEvent .weekendEventDescription {
	margin-top: 10px;
	font-size: 12px;
	color: #eee;
}

.tooltipWeekendEvent .weekendEventFinish {
	margin-top: 10px;
	font-size: 11px;
	color: #aaa;
}

.tooltipWeekendEvent .weekendEventFinish .date {
	padding-left: 2px;
	color: #aaa;
}

.tooltipRecruitmentInfo {
	width: 400px;
}

table.headingsLeft {
}

table.headingsLeft th {
	text-align: left;
}

table.tableCornerRadius {
}

table.tableCornerRadius tr:first-child td:first-child {
	border-top-left-radius: 12px;
}

table.tableCornerRadius tr:first-child td:last-child {
	border-top-right-radius: 12px;
}

table.tableCornerRadius tr:first-child th:last-child {
	border-top-right-radius: 12px;
}

table.tableCornerRadius tr:last-child td:first-child {
	border-bottom-left-radius: 12px;
}

table.tableCornerRadius tr:last-child td:last-child {
	border-bottom-right-radius: 12px;
}

table.tableCornerRadius tr:last-child th:last-child {
	border-bottom-right-radius: 12px;
}

.stripLightMiddle {
	background: #c2a9ac;
	border-top: 2px solid #9b8a8d;
	border-bottom: 2px solid #9b8a8d;
	padding: 10px;
	font-size: 13px;
	font-family: OpenSansSemibold;
}

.stripLightMiddle h2, .stripLightMiddle h3, .stripLightMiddle h4 {
	margin: 2px 0px;
	padding: 0px;
}

.stripHeadingMargin {
	position: relative;
	top: 20px;
	margin-bottom: 20px;
}

.contentUnderStripHeading {
	margin-top: 40px;
}


.resourceText {
	display: inline-block;
	margin-right: 4px;
	width: 24px;
	height: 16px;
	vertical-align: top;
}

.resourceTextBottom {
	vertical-align: middle;
}

.resourceIconSilver {
	width: 24px;
	height: 16px;
	background-image: url("../images/icons/resources/silver.png");
}

.resourceIconGold {
	width: 24px;
	height: 16px;
	background-image: url("../images/icons/resources/gold.png");
}

.resourceIconWood {
	width: 24px;
	height: 16px;
	background-image: url("../images/icons/resources/wood.png");
}

.resourceIconStone {
	width: 24px;
	height: 16px;
	background-image: url("../images/icons/resources/stone.png");
}

.resourceIconIron {
	width: 24px;
	height: 16px;
	background-image: url("../images/icons/resources/iron.png");
}

.resourceIconActivityPoint {
	margin-left: 2px;
	width: 24px;
	height: 16px;
	background-image: url("../images/icons/resources/activity_point.png");
}


.resourcePanelBuyGold {
	position: absolute;
	z-index: 1;
	top: 6px;
	left: 545px;
	width: 25px;
	height: 25px;
	text-align: center;
}

.resourcePanelBuyGold a {
	color: #ddd;
	text-decoration: none;
	display: block;
	width: 100%;
	height: 100%;
	line-height: 25px;
	font-size: 18px;
	font-family: OpenSansBold;
	background: #1b182a;
	border: 1px solid #4f4f5e;
	border-radius: 20px;
}

.resourcePanelBuyGold a:hover {
	background-color: #292542;
	border: 1px solid #555;
	color: #f2f2f2;
}



.panelMenuIcons {
}

.panelMenuIcons a:hover {
	filter: brightness(1.3);
}

.panelMenuIcons {
}


.panelMenuIcons a.fight {
	background-image: url("../images/icons/fight.png");
}

.panelMenuIcons a.conversation {
	background-image: url("../images/icons/conversation.png");
}

.panelMenuIcons a.notes {
	background-image: url("../images/icons/notes.png");
}

.panelMenuIcons a.diplomacy {
	background-image: url("../images/icons/diplomacy.png");
}

.panelMenuIcons a.tribeChat {
	background-image: url("../images/icons/tribe_chat.png");
}

.panelMenuIcons a.serverMessage {
	background-image: url("../images/icons/server_message.png");
}



.panelMenuIcons .number {
	position: absolute;
	width: 18px;
	height: 18px;
	border-radius: 10px;
	color: #fff;
	font-size: 13px;
	font-weight: bold;
	text-align: center;
	text-shadow: 1px 1px 2px #000;
	line-height: 20px;
}

.panelMenuIcons .numberFightReports {
	top: 12px;
	left: 14px;
	
	background: rgba(238,0,0,1);
	background: -moz-radial-gradient(center, ellipse cover, rgba(238,0,0,1) 0%, rgba(170,0,0,1) 100%);
	background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, rgba(238,0,0,1)), color-stop(100%, rgba(170,0,0,1)));
	background: -webkit-radial-gradient(center, ellipse cover, rgba(238,0,0,1) 0%, rgba(170,0,0,1) 100%);
	background: -o-radial-gradient(center, ellipse cover, rgba(238,0,0,1) 0%, rgba(170,0,0,1) 100%);
	background: -ms-radial-gradient(center, ellipse cover, rgba(238,0,0,1) 0%, rgba(170,0,0,1) 100%);
	background: radial-gradient(ellipse at center, rgba(238,0,0,1) 0%, rgba(170,0,0,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ee0000', endColorstr='#aa0000', GradientType=1 );
	
	border: 2px solid #660000;
}

.panelMenuIcons .numberReceivedMessages {
	top: 12px;
	left: 14px;
	
	background: rgba(3,132,219,1);
	background: -moz-radial-gradient(center, ellipse cover, rgba(3,132,219,1) 0%, rgba(0,67,168,1) 100%);
	background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, rgba(3,132,219,1)), color-stop(100%, rgba(0,67,168,1)));
	background: -webkit-radial-gradient(center, ellipse cover, rgba(3,132,219,1) 0%, rgba(0,67,168,1) 100%);
	background: -o-radial-gradient(center, ellipse cover, rgba(3,132,219,1) 0%, rgba(0,67,168,1) 100%);
	background: -ms-radial-gradient(center, ellipse cover, rgba(3,132,219,1) 0%, rgba(0,67,168,1) 100%);
	background: radial-gradient(ellipse at center, rgba(3,132,219,1) 0%, rgba(0,67,168,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0384db', endColorstr='#0043a8', GradientType=1 );
	
	border: 2px solid #0000aa;
}

.panelMenuIcons .numberDiplomacyApplications {
	top: 12px;
	left: 14px;
	
	background: rgba(23,176,9,1);
	background: -moz-radial-gradient(center, ellipse cover, rgba(23,176,9,1) 0%, rgba(11,97,1,1) 100%);
	background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, rgba(23,176,9,1)), color-stop(100%, rgba(11,97,1,1)));
	background: -webkit-radial-gradient(center, ellipse cover, rgba(23,176,9,1) 0%, rgba(11,97,1,1) 100%);
	background: -o-radial-gradient(center, ellipse cover, rgba(23,176,9,1) 0%, rgba(11,97,1,1) 100%);
	background: -ms-radial-gradient(center, ellipse cover, rgba(23,176,9,1) 0%, rgba(11,97,1,1) 100%);
	background: radial-gradient(ellipse at center, rgba(23,176,9,1) 0%, rgba(11,97,1,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#17b009', endColorstr='#0b6101', GradientType=1 );
	
	border: 2px solid #003300;
}

.panelMenuIcons .numberTribeChatReport {
	top: 12px;
	left: 14px;
	
	background: rgba(3,132,219,1);
	background: -moz-radial-gradient(center, ellipse cover, rgba(3,132,219,1) 0%, rgba(0,67,168,1) 100%);
	background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, rgba(3,132,219,1)), color-stop(100%, rgba(0,67,168,1)));
	background: -webkit-radial-gradient(center, ellipse cover, rgba(3,132,219,1) 0%, rgba(0,67,168,1) 100%);
	background: -o-radial-gradient(center, ellipse cover, rgba(3,132,219,1) 0%, rgba(0,67,168,1) 100%);
	background: -ms-radial-gradient(center, ellipse cover, rgba(3,132,219,1) 0%, rgba(0,67,168,1) 100%);
	background: radial-gradient(ellipse at center, rgba(3,132,219,1) 0%, rgba(0,67,168,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0384db', endColorstr='#0043a8', GradientType=1 );
	
	border: 2px solid #0000aa;
	
	/*
	background: rgba(238,0,0,1);
	background: -moz-radial-gradient(center, ellipse cover, rgba(238,0,0,1) 0%, rgba(170,0,0,1) 100%);
	background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, rgba(238,0,0,1)), color-stop(100%, rgba(170,0,0,1)));
	background: -webkit-radial-gradient(center, ellipse cover, rgba(238,0,0,1) 0%, rgba(170,0,0,1) 100%);
	background: -o-radial-gradient(center, ellipse cover, rgba(238,0,0,1) 0%, rgba(170,0,0,1) 100%);
	background: -ms-radial-gradient(center, ellipse cover, rgba(238,0,0,1) 0%, rgba(170,0,0,1) 100%);
	background: radial-gradient(ellipse at center, rgba(238,0,0,1) 0%, rgba(170,0,0,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ee0000', endColorstr='#aa0000', GradientType=1 );
	*/
	
	/* border: 2px solid #660000; */
}

.shieldXpBackground {
	position: absolute;
	top: 37px;
	left: 109px;
	width: 125px;
	height: 108px;
	
	/* background: linear-gradient(180deg, rgba(255,221,86,1) 0%, rgba(251,205,83,1) 10%, rgba(246,188,80,1) 15%, rgba(233,162,86,1) 100%); */
	
	background: linear-gradient(180deg, rgba(255,221,86,1) 0%, rgba(253,225,90,1) 10%, rgba(253,225,90,1) 15%, rgba(233,162,86,1) 100%);
	
	/*
	background-size: 100% 70%;
	-webkit-background-size: 100% 70%;
	-ms-background-sice:  100% 70%;
	-o-background-size: 100% 70%;
	*/
	
	background-repeat: no-repeat;
	background-position: bottom;
	background-color: #282633;
	
	clip-path: polygon(20% 0, 78% 0, 100% 20%, 92% 86%, 50% 100%, 9% 85%, 0 18%);
	-webkit-clip-path: polygon(20% 0, 78% 0, 100% 20%, 92% 86%, 50% 100%, 9% 85%, 0 18%);
}

.shieldXpBackground .glow {
	position: relative;
	width: 100%;
	height: 100%;
	background-image: url("../images/layout/shield_exp_glow2.png");
	background-repeat: no-repeat;
}

.xpBar {
	position: absolute;
	bottom: 0px;
	width: 124px;
	
	background: rgba(255,221,86,1);
	background: -moz-linear-gradient(top, rgba(255,221,86,1) 0%, rgba(247,190,80,1) 23%, rgba(233,161,87,1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,221,86,1)), color-stop(23%, rgba(247,190,80,1)), color-stop(100%, rgba(233,161,87,1)));
	background: -webkit-linear-gradient(top, rgba(255,221,86,1) 0%, rgba(247,190,80,1) 23%, rgba(233,161,87,1) 100%);
	background: -o-linear-gradient(top, rgba(255,221,86,1) 0%, rgba(247,190,80,1) 23%, rgba(233,161,87,1) 100%);
	background: -ms-linear-gradient(top, rgba(255,221,86,1) 0%, rgba(247,190,80,1) 23%, rgba(233,161,87,1) 100%);
	background: linear-gradient(to bottom, rgba(255,221,86,1) 0%, rgba(247,190,80,1) 23%, rgba(233,161,87,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffdd56', endColorstr='#e9a157', GradientType=0 );
}

.xpBarGlow {
	background-image: url("../images/layout/shield_exp_glow.png");
	position: absolute;
	left: 4px;
	top: -19px;
	width: 124px;
	height: 108px;
}

.xpBarPlayerLevel {
	position: absolute;
	top: 24px;
	left: 160px;
	width: 25px;
	z-index: 1;
	color: #eee;
	font-size: 13px;
	text-align: center;
	font-family: OpenSansSemibold;
	
	text-shadow:
	   -1px -1px 0px #444,  
		1px -1px 0px #444,
		-1px 1px 0px #444,
		 1px 1px 0px #444;
	
	user-select: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	-ms-user-select: none;
}


.borderedBox {
	position: relative;
	color: #000;
	z-index: 1;
}

.borderedBox:before {
	content: "";
	z-index: 3;
	position: absolute;
	left: 0px;
	top: 0px;
	
	border: solid;  /* Edge */
	border-width: 0px;
	border-radius: 6px;
	
	border-image-repeat: round round;
	border-image-source: url("../images/layout/box_border.png");
	-o-border-image-source: url("../images/layout/box_border.png");
	-webkit-border-image-source: url("../images/layout/box_border.png");
	
	border-image-slice: 37 37 37 37 fill;
	border-image-width: 37px;
	border-image-outset: 15px 16px 18px 14px;
	
	width: 100%;
	height: 100%;
	
	pointer-events: none;
	
	box-shadow: inset 1px 1px 4px 1px rgba(0,0,0,0.5), inset -1px 0px 4px 1px rgba(0,0,0,0.5);
	-webkit-box-shadow: inset 0px 0px 4px 1px rgba(0,0,0,0.75);
	-moz-box-shadow: inset 0px 0px 4px 1px rgba(0,0,0,0.75);
}

.borderedBox2 {
	position: relative;
	color: #000;
	
	border: solid;  /* Edge */
	border-width: 0px;
	border-radius: 6px;
	
	border-image-repeat: round round;
	border-image-source: url("../images/layout/box_border2.png");
	-o-border-image-source: url("../images/layout/box_border2.png");
	-webkit-border-image-source: url("../images/layout/box_border2.png");	
	
	border-image-slice: 12 12 12 12 fill;
	border-image-width: 12px;
	border-image-outset: 11px 11px 11px 11px;
}

.contentTable {
	font-size: 13px;
	border-radius: 3px;
}

.contentTable table {
	font-size: 13px;
}

.borderedBox .boxTitle, .borderedBox2 .boxTitle {
	width: 154px;
	height: 25px;
	background-image: url("../images/layout/box_heading.png");
	
	position: absolute;
	top: -21px;
	left: calc(50% - 77px);
	
	color: #f2f2f2;
	text-align: center;
	font-size: 11px;
	font-family: OpenSansSemibold;
	line-height: 22px;
	
	z-index: 5;
	text-transform: uppercase;
	
	text-shadow:
	   -1px -1px 0px #222,  
		1px -1px 0px #222,
		-1px 1px 0px #222,
		 1px 1px 0px #222;
	
	user-select: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	-ms-user-select: none;
}

.borderedBoxMargin {
	margin-top: 43px;
}

.borderedBoxMarginSmall {
	margin-top: 20px;
}

.borderedBoxLeftMargin {
	margin-left: 40px;
}

.boxesSpace {
	margin-left: 40px;
}

.borderedBox .borderedBoxSwitch {
	position: absolute;
	top: -26px;
	right: 20px;
	/* width: 80px; */
	height: 20px;
	line-height: 20px;
	color: #f2f2f2;
	font-size: 0px;
	font-family: OpenSansSemibold;
	text-align: right;
	z-index: 3;
	
	user-select: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	-ms-user-select: none;
}

.borderedBox .borderedBoxSwitch span {
	display: inline-block;
	vertical-align: top;
	cursor: pointer;
	width: 30px;
	height: 30px;
	background-size: contain;
	-webkit-background-size: contain;
	-ms-background-sice: contain;
	-o-background-size: contain;
	text-align: center;
	line-height: 30px;
	font-size: 13px;
}

.borderedBox .borderedBoxSwitch span:not(.switchActive) {
	color: #74646b;
	background-image: url("../images/layout/content_page_switch.png");
}

.borderedBox .switchActive {
	color: #f2f2f2;
	font-family: OpenSansBold;
	background-image: url("../images/layout/content_page_switch_active.png");
}

.borderedBoxContent {
	background-color: #ceb8ba;
	border-radius: 3px;
}

.borderedBoxContentGradient {
	/* background: linear-gradient(180deg, rgba(206,184,186,1) 0%, rgba(199,177,179,1) 100%); */
	background: linear-gradient(180deg, rgba(206,184,186,1) 75%, rgba(192,170,172,1) 100%);
	
	border-radius: 3px;
}

.borderedBoxContentDark {
	background-color: #312d3c;
	border-radius: 3px;
}

.borderedBoxContentDungeonsOverview {
	/* background-color: #c7aeb2; */
	background: linear-gradient(180deg, rgba(199, 174, 178,1) 50%, rgba(179,154,158,1) 100%);
}


.borderedBox .highlightedText {
	margin-top: 20px;
	padding: 5px 8px 3px 8px;
	background-color: #c2a9ac;
	border: 1.5px solid #725b60;
	word-wrap: break-word;
}

.borderedBox table {
	border-spacing: 0px;
	border-collapse: collapse;
	padding: 0px;
}

.borderedBox table.stripedTable {
}

.borderedBox table.stripedTable tr:nth-child(odd) {
	background-color: #d3bec1;
}

.borderedBox table.stripedTable tr:nth-child(odd).highlightedRow th, .borderedBox table.stripedTable tr:nth-child(odd).highlightedRow td {
	background-color: #b49096;
}

.borderedBox table.stripedTable tr:nth-child(odd) .highlightedCell {
	background-color: #b49096;
}

.borderedBox table.stripedTable tr:nth-child(even) {
	background-color: #c7aeb2;
}

.borderedBox table.stripedTable tr:nth-child(even).highlightedRow th, .borderedBox table.stripedTable tr:nth-child(even).highlightedRow td {
	background-color: #ad868e;
}

.borderedBox table.stripedTable tr:nth-child(even) .highlightedCell {
	background-color: #ad868e;
}

.borderedBox table.stripedTable th, .boxTable table.stripedTable td {
	/* padding: 6px; */
}

.borderedBox .stripDark {
	position: relative;
	background: rgba(49,45,60,1);
	background: -moz-linear-gradient(top, rgba(49,45,60,1) 0%, rgba(32,30,40,1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(49,45,60,1)), color-stop(100%, rgba(32,30,40,1)));
	background: -webkit-linear-gradient(top, rgba(49,45,60,1) 0%, rgba(32,30,40,1) 100%);
	background: -o-linear-gradient(top, rgba(49,45,60,1) 0%, rgba(32,30,40,1) 100%);
	background: -ms-linear-gradient(top, rgba(49,45,60,1) 0%, rgba(32,30,40,1) 100%);
	background: linear-gradient(to bottom, rgba(49,45,60,1) 0%, rgba(32,30,40,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#312d3c', endColorstr='#201e28', GradientType=0 );
	color: #dfdfdf;
	padding: 10px 5px 6px 5px;
	font-size: 14px;
	font-family: OpenSansSemibold;
	border-radius: 0px;
	border-bottom: 2px solid #000;
}

.borderedBox .stripDark a {
	text-decoration: none;
}

.borderedBox .stripDark a.light {
	color: #94bdff;
}

.borderedBox .stripDark a.fullSize {
	display: inline-block;
	width: 100%;
}

.borderedBox .stripDark a.buttonBack {
	position: absolute;
	top: 4px;
	left: 10px;
}

.borderedBox .stripDark .tabs {
}

.borderedBox .stripDark .tabs .tab {
	color: #dfdfdf;
	margin: 0px 10px;
}

.borderedBox .stripDark .tabs .tab.tabActive {
	color: #94bdff;
}

.borderedBox .stripLight {
	background: rgba(194,169,172,1);
	background: -moz-linear-gradient(top, rgba(194,169,172,1) 38%, rgba(176,153,156,1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(38%, rgba(194,169,172,1)), color-stop(100%, rgba(176,153,156,1)));
	background: -webkit-linear-gradient(top, rgba(194,169,172,1) 38%, rgba(176,153,156,1) 100%);
	background: -o-linear-gradient(top, rgba(194,169,172,1) 38%, rgba(176,153,156,1) 100%);
	background: -ms-linear-gradient(top, rgba(194,169,172,1) 38%, rgba(176,153,156,1) 100%);
	background: linear-gradient(to bottom, rgba(194,169,172,1) 38%, rgba(176,153,156,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c2a9ac', endColorstr='#b0999c', GradientType=0 );
	text-align: center;
	padding: 5px;
	border-radius: 0px;
	border-top: 2px solid #9b8a8d;
	font-size: 13px;
	font-family: OpenSansSemibold;
}

.borderedBox .stripError {
	position: relative;
	background-color: #961717;
	border-bottom: 3px solid #870d0d;
	color: #e2e2e2;
	padding: 16px 5px 10px 5px;
	font-size: 15px;
	font-family: OpenSansSemibold;
	border-radius: 0px;
}

.borderedBox .stripMargin {
	padding-top: 12px;
	padding-bottom: 10px;
}

.borderedBox .content {
	padding: 15px 8px;	
	/* font-size: 12.5px; */
	font-size: 13px;
	font-family: OpenSansSemibold;
	
	/* Test */
	font-family: OpenSansMedium;
}

.borderedBox .contentDark {
	background: rgba(49,45,60,1);
	background: -moz-linear-gradient(top, rgba(49,45,60,1) 0%, rgba(32,30,40,1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(49,45,60,1)), color-stop(100%, rgba(32,30,40,1)));
	background: -webkit-linear-gradient(top, rgba(49,45,60,1) 0%, rgba(32,30,40,1) 100%);
	background: -o-linear-gradient(top, rgba(49,45,60,1) 0%, rgba(32,30,40,1) 100%);
	background: -ms-linear-gradient(top, rgba(49,45,60,1) 0%, rgba(32,30,40,1) 100%);
	background: linear-gradient(to bottom, rgba(49,45,60,1) 0%, rgba(32,30,40,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#312d3c', endColorstr='#201e28', GradientType=0 );
}

.borderedBox .content table {
	font-size: 13px;
}

.borderedBox .contentMargin {
	margin-left: 10px;
}

.borderedBox input[type="text"], .borderedBox input[type="password"], .borderedBox input[type="number"], .borderedBox input[type="email"], .borderedBox textarea, .borderedBox select {
	position: relative;
	background-color: #e5dadb;
	border-top: 2px solid #725b60;
	border-left: 2px solid #725b60;
	border-bottom: 2px solid #967c83;
	border-right: 2px solid #967c83;
	padding-left: 1px;
	padding-top: 1px;
	top: 1px;
	padding-bottom: 0px;
}

.borderedBoxShaded {
	opacity: 0.85;
}

.borderedBoxesContainer {
	width: 770px;
	display: flex;
	align-items: flex-start;	
}

.flexItemsLeft {
	justify-content: left;
}

.flexItemsCenter {
	justify-content: center;
}

.boxFull {
	width: 770px;
}

.boxHalf {
	width: 365px;
}

.boxQuarter {
	width: 246px;
}

.topMenu {
	position: relative;
	margin-top: 23px;
	margin-bottom: -40px;
	top: -40px;
	width: 775px;
	height: 27px;
	text-align: center;
	
	border-image-slice: 18 18 18 18 fill;
	border-image-width: 18px;
	border-image-outset: 10px 10px 11px 10px;
	
	font-size: 0px;  /* To remove space between each .item inline-block elements */
}

.topMenuFill {
	width: 100%;
	height: 100%;
	background-image: url("../images/layout/top_menu_background.png");
	background-repeat: repeat-x;
}

.topMenu a {
	display: inline-block;
	height: 27px;
	line-height: 25px;
	color: #e9e9f7 !important;
	font-size: 14px;
	/* font-family: OpenSansBold; */
	font-family: OpenSansSemibold;
	padding: 1px 15px;
	background-repeat: repeat-x;
	
	text-transform: uppercase;
	
	text-shadow:
	   -1px -1px 0px #131127,  
		1px -1px 0px #131127,
		-1px 1px 0px #131127,
		 1px 1px 0px #131127;
	
	
	/* text-shadow: 0px 0px 3px #282938; */
	
	user-select: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	-ms-user-select: none;
}

.topMenu a:hover {
	text-decoration: none !important;
	background-image: url("../images/layout/top_menu_background_hover.png");
}

.topMenu a.active {
	background-image: url("../images/layout/top_menu_background_active.png");
	
	text-shadow:
	   -1px -1px 0px #621f22,  
		1px -1px 0px #621f22,
		-1px 1px 0px #621f22,
		 1px 1px 0px #621f22;
}

.topMenu a.active:hover {
	filter: brightness(110%);
	-webkit-filter: brightness(110%);
}

.topMenu a.disabled {
	background-image: url("../images/layout/top_menu_background_disabled.png");
	color: #696675 !important;
}

.topMenu a.ajaxProcessing {
	opacity: 0.85;
}

.topMenu a:not(.warning).ajaxProcessing {
	color: #d8d5e6 !important;
}

.topMenu .buyGoldLink {
	color: gold;
}

.topMenu .warning {
	color: gold !important;
}


.tooltipContainer {
	display: none;
	position: absolute;
	z-index: 999;
}

table.stripedTable {
	border-spacing: 0px;
	border-collapse: collapse;
	padding: 0px;
}

table.stripedTable tr:nth-child(odd) {
	background-color: #ceb8ba;
}

table.stripedTable tr:nth-child(even) {
	background-color: #c2a9ac;
}

table.stripedTable th, .boxTable table td {
	/* padding: 6px; */
}

tr.darkHeadings {	
}

tr.darkHeadings th {
	background: rgba(49,45,60,1);
	background: -moz-linear-gradient(top, rgba(49,45,60,1) 0%, rgba(32,30,40,1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(49,45,60,1)), color-stop(100%, rgba(32,30,40,1)));
	background: -webkit-linear-gradient(top, rgba(49,45,60,1) 0%, rgba(32,30,40,1) 100%);
	background: -o-linear-gradient(top, rgba(49,45,60,1) 0%, rgba(32,30,40,1) 100%);
	background: -ms-linear-gradient(top, rgba(49,45,60,1) 0%, rgba(32,30,40,1) 100%);
	background: linear-gradient(to bottom, rgba(49,45,60,1) 0%, rgba(32,30,40,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#312d3c', endColorstr='#201e28', GradientType=0 );
	color: #dfdfdf;
}

tr.darkHeadings th.darker {
	background-color: #201c2c;
}

tr.darkHeadings th.rightBorder {
	border-right: 2px solid #84777c;
}

tr.darkHeadings th.bottomBorder {
	border-bottom: 2px solid #84777c;
}

tr.darkHeadings a {
	color: #dfdfdf !important;
	text-decoration: underline !important;
}

tr.headingsLeft {
}

tr.headingsLeft th {
	text-align: left !important;
}

table.cellsCenter {
}

table.cellsCenter td {
	text-align: center;
}

td.alignRight {
	text-align: right !important;
	padding-right: 4px;
}



.contentBoxContainer {
	margin-top: 15px;
	margin-bottom: 15px;
	display: table;
	padding: 3px;
	border: 1px solid #222;
}

.contentBox {
}

.contentBox .head {
	background-color: #070606;
	color: #918c84;
	border-top: 1px solid #555;
	border-left: 1px solid #555;
	border-right: 1px solid #555;
	border-bottom: 1px solid #555;
	padding: 4px;
}

.contentBox .head h1, .contentBox .head h2, .contentBox .head h3 {
	margin: 5px !important;
	padding: 0px !important;
}

.contentBox .body {
	background-color: rgb(125, 117, 105);
	padding: 4px;
}

.headingBox {
	padding: 2px 15px;
	background-color: #070606;
	color: #918c84;
	font-size: 21px;
	text-align: center;
}

a.disabled {
	color: #333 !important;
	opacity: 0.5 !important;
	cursor: default !important;
	text-decoration: none !important;
}

a.disabled:hover {
	text-decoration: none !important;
}

.contentTextSeparator {
	width: 100%;
	border-top: 1px solid #9b8a8d;
}

.ui-draggable {
	z-index: 1000 !important;
}

.firstVisitBox {
	padding: 10px 2px 5px 2px;
	border: 1px solid #9b8a8d;
	background-color: #e8dadc;
}

.textTip {
	border-bottom: 1px dotted #000;
	cursor: help;
}

.help {
	text-decoration: underline;
	text-decoration-style: dashed;
	cursor: help !important;
}

.helpQuestionMark {
	text-decoration: underline;
	cursor: help !important;
	font-size: 16px;
	font-family: OpenSansBold;
	padding: 2px;
	color: #0000aa;
}


.communityPanel {
	position: fixed; /* relative */
	top: 0px;
	margin: 0px;
	padding: 0px;
	width: 100%;
	height: 38px;
	background-color: #191625;
	border-bottom: 1px solid #090312;
	z-index: 100;
}

.communityPanel .panelContent {
	position: relative;
	margin: 0px auto;
	width: 1200px;
	line-height: 38px;
	font-family: OpenSansSemibold;
}

.communityPanel .panelContent .logo {
	display: inline-block;
	width: 84px;
	height: 40px;
	margin-top: 0px;
	margin-right: 20px;
	
	padding: 0px;
	
	background-image: url("../images/logo_small.png");
	background-repeat: no-repeat;
	background-position: center;
	
	background-size: contain;
	-webkit-background-size: contain;
	-ms-background-sice: contain;
	-o-background-size: contain;
}

.communityPanel .panelContent .menuLinks {
	display: inline-block;
	vertical-align: top;
	cursor: default;
	color: #d2d2d2;
	font-size: 15px;
}

.communityPanel .panelContent .menuLinks a, .communityPanel .panelContent .profileLinks a {
	color: #d2d2d2;
	text-decoration: none;
	font-size: 15px;
	margin: 0px 0px;
	padding: 20px 10px;
	text-transform: uppercase;
	transition: 0.1s;
	-webkit-transition: 0.1s;
	-moz-transition: 0.1s;
	-o-transition: 0.1s;
	
	text-shadow: 0px 0px 4px #000;
}

.communityPanel .panelContent .menuLinks a:hover, .communityPanel .panelContent .profileLinks a:hover {
	color: #fff;
}

.communityPanel .panelContent .menuLinks a.active, .communityPanel .panelContent .profileLinks a.active {
	color: #fff;
}

.communityPanel .panelContent .profileLinks {
	position: absolute;
	display: inline-block;
	right: 0px;
}

.communityPanel .panelContent .profileLinks a.userName {
	text-transform: initial;
}

.communityPanel .demoAccountText {
	position: absolute;
	display: inline-block;
	top: 5px;
	right: 100px;
	
	line-height: 15px;
	font-size: 12px;
	color: yellow;
}

.communityPanel .demoAccountText a {
	color: yellow;
	text-decoration: underline;
}


.diplomacyIcons {
	display: inline;
	font-family: OpenSansMedium;
	font-size: 16px;
}

.diplomacyIcons .icon {
	display: inline-block;
	vertical-align: top;
	position: relative;
	top: 4px;
	width: 15px;
	height: 15px;
	
	mask: url("../images/icons/user.svg") no-repeat center;
	-webkit-mask: url("../images/icons/user.svg") no-repeat center;
}

.diplomacyIcons .icon:not(:last-of-type) {
	margin-right: 2px;
}

.diplomacyIcons .icon.friend {
	background-color: #007a00;
}

.diplomacyIcons .icon.enemy {
	background-color: #c40000;
}

.diplomacyIcons .icon.tribeMember {
	background-color: #0782ba;
}

.dialogError {
	width: 700px;
}

.dialogError .iconError {
	display: inline-block;
	vertical-align: -4px;
	background-color: #e2e2e2;
	margin-right: 5px;
	width: 22px;
	height: 22px;
	
	mask: url("../images/icons/warning.svg") no-repeat center;
	-webkit-mask: url("../images/icons/warning.svg") no-repeat center;
	
	mask-size: 22px;
	-webkit-mask-size: 22px;
}

.dialogError .buttons {
	text-align: center;
}

.dialogError .buttons a {
	margin-right: 10px;
}


.imageZoomContainer {
	display: none;
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.5);
	z-index: 9999;
}

.imageZoomContainer .image {
	position: relative;
	top: 50%;
	margin-left: auto;
	margin-right: auto;
	width: max-content;
	
	transform: translateY(-50%);
	-ms-transform: translateY(-50%);
}

.floatingText {
	font-family: OpenSansSemibold;
	font-size: 17px;
}