

@charset "UTF-8";

@import url("../../css_rtl/travianLayout.css");
@import url("../../css_rtl/travianA2B.css");
@import url("../../css_rtl/travianActivate.css");
@import url("../../css_rtl/travianAlliance.css");
@import url("../../css_rtl/travianBannedCn.css");
@import url("../../css_rtl/travianBuildings.css");
@import url("../../css_rtl/buildings/buildingsConfig.css");
@import url("../../css_rtl/travianVillage.css");
@import url("../../css_rtl/travianVillage1.css");
@import url("../../css_rtl/travianVillage2.css");
@import url("../../css_rtl/travianVillage3.css");
@import url("../../css_rtl/travianHero.css");
@import url("../../css_rtl/travianRaidList.css");
@import url("../../css_rtl/travianPayment.css");
@import url("../../css_rtl/hacks.css");
@import url("../../css_rtl/highlight.css");
@import url("../../css_rtl/travianGeneral.css");
@import url("../../css_rtl/travianLinklist.css");
@import url("../../css_rtl/travianSupport.css");



@import "fontiran.css";
@import "compact1.css";
@import "compact2.css";
@import "compact3.css";
@import url("../../css_rtl/imports_compressed.css");
















#oneTimeOfferNotification.firstTimeAnimation .costsWrapper div.forOnly {
	animation-delay: 1600ms
}

#oneTimeOfferNotification.firstTimeAnimation .costsWrapper div.price {
	animation-delay: 1800ms
}

#oneTimeOfferNotification:not(.firstTimeAnimation) .notificationPackage .content:before {
	animation: otoShine 30000ms 30000ms ease-in-out infinite
}

#oneTimeOfferNotification.dismissed {
	animation: otoDismiss 250ms 250ms ease-in forwards;
	transform-origin: center right;
	pointer-events: none
}

@media screen and (max-width:1380px) {
	#oneTimeOfferNotification.dismissed {
		animation-name: otoDismissSmallVersion
	}
}

#oneTimeOfferNotification.dismissed .notificationPackage .content:before {
	animation: none
}

#oneTimeOfferNotification.dismissed .notificationTimer {
	transition-duration: 250ms;
	transform: translateX(100%)
}

#oneTimeOfferNotification.dismissed .closeAnnouncement {
	transition-duration: 150ms;
	transform: scale(0)
}

@keyframes otoDismiss {
	0% {
		opacity: 1;
		transform: translateX(0)
	}

	100% {
		opacity: 0;
		transform: translateX(50px)
	}
}

@keyframes otoDismissSmallVersion {
	0% {
		opacity: 1;
		transform: translateX(0) scale(0.82)
	}

	100% {
		opacity: 0;
		transform: translateX(50px) scale(0.82)
	}
}

@keyframes otoAppear {
	0% {
		transform: translateX(-100px);
		opacity: 0
	}

	50% {
		opacity: 1
	}

	70% {
		transform: translateX(10px)
	}

	100% {
		transform: translateX(0);
		opacity: 1
	}
}

@keyframes otoAppearSmallVersion {
	0% {
		transform: translateX(-100px) scale(0.82);
		opacity: 0
	}

	50% {
		opacity: 1
	}

	70% {
		transform: translateX(10px) scale(0.82)
	}

	100% {
		transform: translateX(0) scale(0.82);
		opacity: 1
	}
}

@keyframes otoZoomIn {
	0% {
		opacity: 0;
		transform: scale(1.2)
	}

	100% {
		opacity: 1;
		transform: scale(1)
	}
}

@keyframes otoShine {
	0% {
		transform: translateX(-300px) skew(-33deg, 0)
	}

	2.5% {
		transform: translateX(100px) skew(-33deg, 0)
	}

	2.6% {
		transform: translateX(100px) skew(33deg, 0)
	}

	5%,
	100% {
		transform: translateX(-300px) skew(33deg, 0)
	}
}

.ie #oneTimeOfferNotification .gradientFrameShape {
	background-image: linear-gradient(to bottom, #cba467 5%, #f3e2ae 13%, #efbf7b 32%, #aa8050 48%, #835e35 72%, #ad8a54 93%, #d7b672 100%);
	border: 1px solid #34220d
}

.ie #oneTimeOfferNotification .gradientFrameShape:before {
	content: "";
	position: absolute;
	top: 4px;
	left: 4px;
	bottom: 4px;
	right: 4px;
	border: solid 1px #44321d
}

.ie #oneTimeOfferNotification .gradientFrameShape .content {
	position: absolute;
	top: 5px;
	left: 5px;
	bottom: 5px;
	right: 5px
}

#oneTimeOfferNotification .gradientFrameShape .gradientFrame {
	overflow: visible
}

.ie #oneTimeOfferNotification .gradientFrameShape .gradientFrame {
	display: none
}

#oneTimeOfferNotification .gradientFrameShape .gradientFrame .innerFrameShape {
	stroke-width: 2
}

#oneTimeOfferNotification .notificationPackage {
	-ms-grid-column: 1;
	grid-column-start: 1
}

#oneTimeOfferNotification .notificationPackage .content {
	background-image: linear-gradient(to bottom, #3f2b50, #68486c);
	overflow: hidden
}

#oneTimeOfferNotification .notificationPackage .content:before {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	background: linear-gradient(to left, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, 0.03) 1%, rgba(255, 255, 255, 0.6) 30%, rgba(255, 255, 255, 0.85) 50%, rgba(255, 255, 255, 0.85) 70%, rgba(255, 255, 255, 0.85) 71%, rgba(255, 255, 255, 0) 100%);
	width: 30%;
	height: 100%;
	z-index: 5;
	opacity: .5;
	transform: translateX(-300px) skew(-33deg, 0);
	pointer-events: none
}

#oneTimeOfferNotification .notificationPackage .content:hover {
	cursor: pointer;
	filter: brightness(1.4)
}

.ie #oneTimeOfferNotification .notificationPackage .content:hover {
	background-image: linear-gradient(to bottom, #64447e, #916597)
}

#oneTimeOfferNotification .notificationPackage .packageImage {
	height: 100%;
	width: 124px;
	position: relative;
	background-image: url('../../img_rtl/views/shop/glareSpecial.png');
	background-size: contain
}

#oneTimeOfferNotification .notificationPackage .packageImage img {
	width: 80px;
	height: 80px;
	position: absolute;
	top: 17px;
	right: 25px
}

#oneTimeOfferNotification .notificationPackage .badge {
	position: absolute;
	bottom: 15px;
	right: 65px;
	z-index: 3;
	text-align: center;
	text-shadow: 0 1px 0 #3c140e;
	border-radius: 2px;
	background-image: linear-gradient(to bottom, #b23625, #95291b);
	border: 1px solid #6c1c13;
	box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.35);
	box-sizing: border-box;
	padding: 5px
}

.colorBlind #oneTimeOfferNotification .notificationPackage .badge {
	text-shadow: 0 1px 0 #040932;
	background-image: linear-gradient(to bottom, #3e69b3, #0022af);
	border: 1px solid #09156e
}

#oneTimeOfferNotification .notificationPackage .badge .value {
	line-height: 1.2em;
	font-size: 14px;
	font-weight: bold
}

#oneTimeOfferNotification .notificationPackage .badge .text {
	line-height: 1.2em;
	font-size: 8px;
	text-transform: uppercase
}

#oneTimeOfferNotification .notificationPackage .costsWrapper {
	position: absolute;
	top: 20px;
	left: 20px;
	text-align: left
}

#oneTimeOfferNotification .notificationPackage .costsWrapper .amount,
#oneTimeOfferNotification .notificationPackage .costsWrapper .price {
	font-size: 18px;
	line-height: 1em;
	font-weight: bold;
	text-shadow: 1px 0 0 #190000, 1px 1px 0 #190000, 0 1px 0 #190000, -1px 1px 0 #190000, -1px 0 0 #190000, -1px -1px 0 #190000, 0 -1px 0 #190000, 1px -1px 0 #190000
}

#oneTimeOfferNotification .notificationPackage .costsWrapper .forOnly {
	padding: 3px 0 5px
}

#oneTimeOfferNotification .notificationPackage .costsWrapper .goldCoin {
	width: 24px;
	height: 24px
}

#oneTimeOfferNotification .notificationTimer {
	-ms-grid-column: 2;
	grid-column-start: 2
}

#oneTimeOfferNotification .notificationTimer .content {
	background-color: #b47b35
}

#oneTimeOfferNotification .notificationTimer .remainingTime {
	text-align: center;
	padding-top: 40px
}

#oneTimeOfferNotification .notificationTimer .remainingTime i {
	background-image: url('../../img_rtl/views/shop/hourGlass_medium.png');
	width: 18px;
	height: 24px;
	margin-bottom: 5px
}

#oneTimeOfferNotification .notificationTimer .remainingTime .timer {
	font-size: 11px;
	font-weight: bold;
	text-shadow: 1px 0 0 #64441c, 1px 1px 0 #64441c, 0 1px 0 #64441c, -1px 1px 0 #64441c, -1px 0 0 #64441c, -1px -1px 0 #64441c, 0 -1px 0 #64441c, 1px -1px 0 #64441c;
	display: block
}

#oneTimeOfferNotification .closeAnnouncement {
	width: 32px;
	height: 32px;
	position: absolute;
	bottom: -7px;
	left: -7px;
	z-index: 3
}

.colorBlind #oneTimeOfferNotification .closeAnnouncement:before {
	background-color: #0022af;
	box-shadow: none
}

.colorBlind #oneTimeOfferNotification .closeAnnouncement:hover:before {
	background-color: #3e69b3;
	box-shadow: none
}

.colorBlind #oneTimeOfferNotification .closeAnnouncement:active:before {
	background-color: #09156e;
	box-shadow: none
}

#oneTimeOfferNotification .closeAnnouncement svg {
	width: 15px;
	height: 15px
}

#finishNowDialog ul {
	list-style: none;
	padding: 0;
	margin-right: 5px;
	margin-top: 5px;
	margin-bottom: 10px
}

#finishNowDialog ul li.notPossibleToFinishNow {
	color: #888
}

#finishNowDialog p {
	margin: 0 0 10px
}

#finishNowDialog span.lvl {
	font-size: 13px;
	color: #f88c1f;
	font-weight: bold
}

#finishNowDialog .buttonWrapper {
	text-align: center
}

#tileDetails {
	width: 552px
}

.dialog #tileDetails {
	overflow: hidden;
	position: relative;
	    color: #5e5e5e;
}

#tileDetails .detailImage {
	background-position: 0 0;
	width: 319px;
	min-height: 0;
	padding-top: 218px;
	 color: #5e5e5e;
}

#tileDetails.landscape .detailImage {
	width: 552px;
	padding-top: 336px;
	 color: #5e5e5e;
}

.buildingsV3 .village-1 .detailImage {
	position: relative;
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/f1.png')
}

.buildingsV3 .village-1 .detailImage:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background-position: center top;
	background-repeat: no-repeat
}

.buildingsV3 .village-1 .detailImage .option {
	position: relative;
	z-index: 1
}

.buildingsV3 .village-1 .detailImage.vid1:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid1.png')
}

.buildingsV3 .village-1 .detailImage.vid2:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid2.png')
}

.buildingsV3 .village-1 .detailImage.vid3:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid3.png')
}

.buildingsV3 .village-1 .detailImage.vid6:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid6.png')
}

.buildingsV3 .village-1 .detailImage.vid7:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid7.png')
}
.buildingsV3 .village-1 .detailImage.vid8:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid8.png')
}

.buildingsV3 .village-1 .detailImage.desert {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/d1.png')
}

.buildingsV3 .village-1 .detailImage.desert.vid1:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid1.png')
}

.buildingsV3 .village-1 .detailImage.desert.vid2:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid2.png')
}

.buildingsV3 .village-1 .detailImage.desert.vid3:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid3.png')
}

.buildingsV3 .village-1 .detailImage.desert.vid6:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid6.png')
}

.buildingsV3 .village-1 .detailImage.desert.vid7:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid7.png')
}
.buildingsV3 .village-1 .detailImage.desert.vid8:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid8.png')
}

.buildingsV3 .village-2 .detailImage {
	position: relative;
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/f2.png')
}

.buildingsV3 .village-2 .detailImage:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background-position: center top;
	background-repeat: no-repeat
}

.buildingsV3 .village-2 .detailImage .option {
	position: relative;
	z-index: 1
}

.buildingsV3 .village-2 .detailImage.vid1:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid1.png')
}

.buildingsV3 .village-2 .detailImage.vid2:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid2.png')
}

.buildingsV3 .village-2 .detailImage.vid3:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid3.png')
}

.buildingsV3 .village-2 .detailImage.vid6:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid6.png')
}

.buildingsV3 .village-2 .detailImage.vid7:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid7.png')
}
.buildingsV3 .village-2 .detailImage.vid8:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid8.png')
}

.buildingsV3 .village-2 .detailImage.desert {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/d2.png')
}

.buildingsV3 .village-2 .detailImage.desert.vid1:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid1.png')
}

.buildingsV3 .village-2 .detailImage.desert.vid2:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid2.png')
}

.buildingsV3 .village-2 .detailImage.desert.vid3:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid3.png')
}

.buildingsV3 .village-2 .detailImage.desert.vid6:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid6.png')
}

.buildingsV3 .village-2 .detailImage.desert.vid7:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid7.png')
}
.buildingsV3 .village-2 .detailImage.desert.vid8:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid8.png')
}

.buildingsV3 .village-3 .detailImage {
	position: relative;
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/f3.png')
}

.buildingsV3 .village-3 .detailImage:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background-position: center top;
	background-repeat: no-repeat
}

.buildingsV3 .village-3 .detailImage .option {
	position: relative;
	z-index: 1
}

.buildingsV3 .village-3 .detailImage.vid1:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid1.png')
}

.buildingsV3 .village-3 .detailImage.vid2:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid2.png')
}

.buildingsV3 .village-3 .detailImage.vid3:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid3.png')
}

.buildingsV3 .village-3 .detailImage.vid6:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid6.png')
}

.buildingsV3 .village-3 .detailImage.vid7:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid7.png')
}
.buildingsV3 .village-3 .detailImage.vid8:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid8.png')
}

.buildingsV3 .village-3 .detailImage.desert {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/d3.png')
}

.buildingsV3 .village-3 .detailImage.desert.vid1:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid1.png')
}

.buildingsV3 .village-3 .detailImage.desert.vid2:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid2.png')
}

.buildingsV3 .village-3 .detailImage.desert.vid3:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid3.png')
}

.buildingsV3 .village-3 .detailImage.desert.vid6:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid6.png')
}

.buildingsV3 .village-3 .detailImage.desert.vid7:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid7.png')
}
.buildingsV3 .village-3 .detailImage.desert.vid8:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid8.png')
}

.buildingsV3 .village-4 .detailImage {
	position: relative;
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/f4.png')
}

.buildingsV3 .village-4 .detailImage:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background-position: center top;
	background-repeat: no-repeat
}

.buildingsV3 .village-4 .detailImage .option {
	position: relative;
	z-index: 1
}

.buildingsV3 .village-4 .detailImage.vid1:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid1.png')
}

.buildingsV3 .village-4 .detailImage.vid2:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid2.png')
}

.buildingsV3 .village-4 .detailImage.vid3:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid3.png')
}

.buildingsV3 .village-4 .detailImage.vid6:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid6.png')
}

.buildingsV3 .village-4 .detailImage.vid7:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid7.png')
}
.buildingsV3 .village-4 .detailImage.vid8:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid8.png')
}

.buildingsV3 .village-4 .detailImage.desert {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/d4.png')
}

.buildingsV3 .village-4 .detailImage.desert.vid1:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid1.png')
}

.buildingsV3 .village-4 .detailImage.desert.vid2:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid2.png')
}

.buildingsV3 .village-4 .detailImage.desert.vid3:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid3.png')
}

.buildingsV3 .village-4 .detailImage.desert.vid6:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid6.png')
}

.buildingsV3 .village-4 .detailImage.desert.vid7:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid7.png')
}
.buildingsV3 .village-4 .detailImage.desert.vid8:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid8.png')
}

.buildingsV3 .village-5 .detailImage {
	position: relative;
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/f5.png')
}

.buildingsV3 .village-5 .detailImage:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background-position: center top;
	background-repeat: no-repeat
}

.buildingsV3 .village-5 .detailImage .option {
	position: relative;
	z-index: 1
}

.buildingsV3 .village-5 .detailImage.vid1:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid1.png')
}

.buildingsV3 .village-5 .detailImage.vid2:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid2.png')
}

.buildingsV3 .village-5 .detailImage.vid3:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid3.png')
}

.buildingsV3 .village-5 .detailImage.vid6:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid6.png')
}

.buildingsV3 .village-5 .detailImage.vid7:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid7.png')
}
.buildingsV3 .village-5 .detailImage.vid8:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid8.png')
}

.buildingsV3 .village-5 .detailImage.desert {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/d5.png')
}

.buildingsV3 .village-5 .detailImage.desert.vid1:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid1.png')
}

.buildingsV3 .village-5 .detailImage.desert.vid2:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid2.png')
}

.buildingsV3 .village-5 .detailImage.desert.vid3:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid3.png')
}

.buildingsV3 .village-5 .detailImage.desert.vid6:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid6.png')
}

.buildingsV3 .village-5 .detailImage.desert.vid7:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid7.png')
}
.buildingsV3 .village-5 .detailImage.desert.vid8:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid8.png')
}

.buildingsV3 .village-6 .detailImage {
	position: relative;
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/f6.png')
}

.buildingsV3 .village-6 .detailImage:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background-position: center top;
	background-repeat: no-repeat
}

.buildingsV3 .village-6 .detailImage .option {
	position: relative;
	z-index: 1
}

.buildingsV3 .village-6 .detailImage.vid1:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid1.png')
}

.buildingsV3 .village-6 .detailImage.vid2:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid2.png')
}

.buildingsV3 .village-6 .detailImage.vid3:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid3.png')
}

.buildingsV3 .village-6 .detailImage.vid6:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid6.png')
}

.buildingsV3 .village-6 .detailImage.vid7:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid7.png')
}
.buildingsV3 .village-6 .detailImage.vid8:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid8.png')
}

.buildingsV3 .village-6 .detailImage.desert {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/d6.png')
}

.buildingsV3 .village-6 .detailImage.desert.vid1:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid1.png')
}

.buildingsV3 .village-6 .detailImage.desert.vid2:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid2.png')
}

.buildingsV3 .village-6 .detailImage.desert.vid3:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid3.png')
}

.buildingsV3 .village-6 .detailImage.desert.vid6:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid6.png')
}

.buildingsV3 .village-6 .detailImage.desert.vid7:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid7.png')
}
.buildingsV3 .village-6 .detailImage.desert.vid8:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid8.png')
}

.buildingsV3 .village-7 .detailImage {
	position: relative;
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/f7.png')
}

.buildingsV3 .village-7 .detailImage:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background-position: center top;
	background-repeat: no-repeat
}

.buildingsV3 .village-7 .detailImage .option {
	position: relative;
	z-index: 1
}

.buildingsV3 .village-7 .detailImage.vid1:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid1.png')
}

.buildingsV3 .village-7 .detailImage.vid2:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid2.png')
}

.buildingsV3 .village-7 .detailImage.vid3:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid3.png')
}

.buildingsV3 .village-7 .detailImage.vid6:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid6.png')
}

.buildingsV3 .village-7 .detailImage.vid7:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid7.png')
}

.buildingsV3 .village-7 .detailImage.desert {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/d7.png')
}

.buildingsV3 .village-7 .detailImage.desert.vid1:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid1.png')
}

.buildingsV3 .village-7 .detailImage.desert.vid2:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid2.png')
}

.buildingsV3 .village-7 .detailImage.desert.vid3:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid3.png')
}

.buildingsV3 .village-7 .detailImage.desert.vid6:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid6.png')
}

.buildingsV3 .village-7 .detailImage.desert.vid7:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid7.png')
}
.buildingsV3 .village-7 .detailImage.desert.vid8:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid8.png')
}

.buildingsV3 .village-8 .detailImage {
	position: relative;
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/f8.png')
}

.buildingsV3 .village-8 .detailImage:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background-position: center top;
	background-repeat: no-repeat
}

.buildingsV3 .village-8 .detailImage .option {
	position: relative;
	z-index: 1
}

.buildingsV3 .village-8 .detailImage.vid1:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid1.png')
}

.buildingsV3 .village-8 .detailImage.vid2:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid2.png')
}

.buildingsV3 .village-8 .detailImage.vid3:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid3.png')
}

.buildingsV3 .village-8 .detailImage.vid6:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid6.png')
}

.buildingsV3 .village-8 .detailImage.vid7:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid7.png')
}
.buildingsV3 .village-8 .detailImage.vid8:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid8.png')
}

.buildingsV3 .village-8 .detailImage.desert {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/d8.png')
}

.buildingsV3 .village-8 .detailImage.desert.vid1:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid1.png')
}

.buildingsV3 .village-8 .detailImage.desert.vid2:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid2.png')
}

.buildingsV3 .village-8 .detailImage.desert.vid3:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid3.png')
}

.buildingsV3 .village-8 .detailImage.desert.vid6:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid6.png')
}

.buildingsV3 .village-8 .detailImage.desert.vid7:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid7.png')
}
.buildingsV3 .village-8 .detailImage.desert.vid8:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid8.png')
}

.buildingsV3 .village-9 .detailImage {
	position: relative;
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/f9.png')
}

.buildingsV3 .village-9 .detailImage:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background-position: center top;
	background-repeat: no-repeat
}

.buildingsV3 .village-9 .detailImage .option {
	position: relative;
	z-index: 1
}

.buildingsV3 .village-9 .detailImage.vid1:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid1.png')
}

.buildingsV3 .village-9 .detailImage.vid2:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid2.png')
}

.buildingsV3 .village-9 .detailImage.vid3:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid3.png')
}

.buildingsV3 .village-9 .detailImage.vid6:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid6.png')
}

.buildingsV3 .village-9 .detailImage.vid7:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid7.png')
}
.buildingsV3 .village-9 .detailImage.vid8:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid8.png')
}

.buildingsV3 .village-9 .detailImage.desert {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/d9.png')
}

.buildingsV3 .village-9 .detailImage.desert.vid1:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid1.png')
}

.buildingsV3 .village-9 .detailImage.desert.vid2:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid2.png')
}

.buildingsV3 .village-9 .detailImage.desert.vid3:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid3.png')
}

.buildingsV3 .village-9 .detailImage.desert.vid6:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid6.png')
}

.buildingsV3 .village-9 .detailImage.desert.vid7:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid7.png')
}
.buildingsV3 .village-9 .detailImage.desert.vid8:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid8.png')
}

.buildingsV3 .village-10 .detailImage {
	position: relative;
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/f10.png')
}

.buildingsV3 .village-10 .detailImage:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background-position: center top;
	background-repeat: no-repeat
}

.buildingsV3 .village-10 .detailImage .option {
	position: relative;
	z-index: 1
}

.buildingsV3 .village-10 .detailImage.vid1:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid1.png')
}

.buildingsV3 .village-10 .detailImage.vid2:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid2.png')
}

.buildingsV3 .village-10 .detailImage.vid3:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid3.png')
}

.buildingsV3 .village-10 .detailImage.vid6:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid6.png')
}

.buildingsV3 .village-10 .detailImage.vid7:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid7.png')
}
.buildingsV3 .village-10 .detailImage.vid8:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid8.png')
}

.buildingsV3 .village-10 .detailImage.desert {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/d10.png')
}

.buildingsV3 .village-10 .detailImage.desert.vid1:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid1.png')
}

.buildingsV3 .village-10 .detailImage.desert.vid2:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid2.png')
}

.buildingsV3 .village-10 .detailImage.desert.vid3:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid3.png')
}

.buildingsV3 .village-10 .detailImage.desert.vid6:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid6.png')
}

.buildingsV3 .village-10 .detailImage.desert.vid7:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid7.png')
}
.buildingsV3 .village-10 .detailImage.desert.vid8:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid8.png')
}

.buildingsV3 .village-11 .detailImage {
	position: relative;
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/f11.png')
}

.buildingsV3 .village-11 .detailImage:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background-position: center top;
	background-repeat: no-repeat
}

.buildingsV3 .village-11 .detailImage .option {
	position: relative;
	z-index: 1
}

.buildingsV3 .village-11 .detailImage.vid1:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid1.png')
}

.buildingsV3 .village-11 .detailImage.vid2:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid2.png')
}

.buildingsV3 .village-11 .detailImage.vid3:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid3.png')
}

.buildingsV3 .village-11 .detailImage.vid6:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid6.png')
}

.buildingsV3 .village-11 .detailImage.vid7:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid7.png')
}
.buildingsV3 .village-11 .detailImage.vid8:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid8.png')
}

.buildingsV3 .village-11 .detailImage.desert {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/d11.png')
}

.buildingsV3 .village-11 .detailImage.desert.vid1:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid1.png')
}

.buildingsV3 .village-11 .detailImage.desert.vid2:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid2.png')
}

.buildingsV3 .village-11 .detailImage.desert.vid3:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid3.png')
}

.buildingsV3 .village-11 .detailImage.desert.vid6:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid6.png')
}

.buildingsV3 .village-11 .detailImage.desert.vid7:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid7.png')
}
.buildingsV3 .village-11 .detailImage.desert.vid8:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid8.png')
}

.buildingsV3 .village-12 .detailImage {
	position: relative;
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/f12.png')
}


.buildingsV3 .village-12 .detailImage:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background-position: center top;
	background-repeat: no-repeat
}

.buildingsV3 .village-12 .detailImage .option {
	position: relative;
	z-index: 1
}

.buildingsV3 .village-12 .detailImage.vid1:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid1.png')
}

.buildingsV3 .village-12 .detailImage.vid2:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid2.png')
}

.buildingsV3 .village-12 .detailImage.vid3:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid3.png')
}

.buildingsV3 .village-12 .detailImage.vid6:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid6.png')
}

.buildingsV3 .village-12 .detailImage.vid7:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid7.png')
}
.buildingsV3 .village-12 .detailImage.vid8:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid8.png')
}

.buildingsV3 .village-12 .detailImage.desert {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/d12.png')
}

.buildingsV3 .village-12 .detailImage.desert.vid1:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid1.png')
}

.buildingsV3 .village-12 .detailImage.desert.vid2:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid2.png')
}

.buildingsV3 .village-12 .detailImage.desert.vid3:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid3.png')
}

.buildingsV3 .village-12 .detailImage.desert.vid6:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid6.png')
}

.buildingsV3 .village-12 .detailImage.desert.vid7:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid7.png')
}
.buildingsV3 .village-12 .detailImage.desert.vid8:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid8.png')
}



.buildingsV3 .village-13 .detailImage {
	position: relative;
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/f13.png')
}


.buildingsV3 .village-13 .detailImage:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background-position: center top;
	background-repeat: no-repeat
}

.buildingsV3 .village-13 .detailImage .option {
	position: relative;
	z-index: 1
}

.buildingsV3 .village-13 .detailImage.vid1:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid1.png')
}

.buildingsV3 .village-13 .detailImage.vid2:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid2.png')
}

.buildingsV3 .village-13 .detailImage.vid3:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid3.png')
}

.buildingsV3 .village-13 .detailImage.vid6:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid6.png')
}

.buildingsV3 .village-13 .detailImage.vid7:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid7.png')
}
.buildingsV3 .village-13 .detailImage.vid8:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/fc-vid8.png')
}

.buildingsV3 .village-13 .detailImage.desert {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/d12.png')
}

.buildingsV3 .village-13 .detailImage.desert.vid1:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid1.png')
}

.buildingsV3 .village-13 .detailImage.desert.vid2:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid2.png')
}

.buildingsV3 .village-12 .detailImage.desert.vid3:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid3.png')
}

.buildingsV3 .village-13 .detailImage.desert.vid6:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid6.png')
}

.buildingsV3 .village-13 .detailImage.desert.vid7:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid7.png')
}
.buildingsV3 .village-13 .detailImage.desert.vid8:after {
	background-image: url('../../img_rtl/layout/background2019/resourceFields/detail/village/tribeSpecificCenter/dc-vid8.png')
}

#tileDetails.oasis-2 .detailImage,
#tileDetails.oasis-4 .detailImage {
	background-image: url('../../img_rtl/g/detail/oasis/wood.jpg')
}

#tileDetails.oasis-3 .detailImage {
	background-image: url('../../img_rtl/g/detail/oasis/woodCrop.jpg')
}

#tileDetails.oasis-6 .detailImage,
#tileDetails.oasis-8 .detailImage {
	background-image: url('../../img_rtl/g/detail/oasis/clay.jpg')
}

#tileDetails.oasis-7 .detailImage {
	background-image: url('../../img_rtl/g/detail/oasis/clayCrop.jpg')
}

#tileDetails.oasis-10 .detailImage,
#tileDetails.oasis-12 .detailImage {
	background-image: url('../../img_rtl/g/detail/oasis/iron.jpg')
}

#tileDetails.oasis-11 .detailImage {
	background-image: url('../../img_rtl/g/detail/oasis/ironCrop.jpg')
}

#tileDetails.oasis-14 .detailImage {
	background-image: url('../../img_rtl/g/detail/oasis/crop.jpg')
}

#tileDetails.oasis-15 .detailImage {
	background-image: url('../../img_rtl/g/detail/oasis/cropCrop.jpg')
}

#tileDetails.landscape-village-normal .detailImage {
	background-image: url('../../img_rtl/g/detail.popup/landscape/villagePlayer.jpg')
}

#tileDetails.landscape-village-natars .detailImage {
	background-image: url('../../img_rtl/g/detail.popup/landscape/villageNatar.jpg')
}

#tileDetails.landscape-grassland .detailImage {
	background-image: url('../../img_rtl/g/detail.popup/landscape/grassland.jpg')
}

#tileDetails.landscape-clay .detailImage {
	background-image: url('../../img_rtl/g/detail/landscape/clay.jpg')
}

#tileDetails.landscape-forest .detailImage {
	background-image: url('../../img_rtl/g/detail/landscape/forest.jpg')
}

#tileDetails.landscape-hill .detailImage {
	background-image: url('../../img_rtl/g/detail/landscape/hill.jpg')
}

#tileDetails.landscape-lake .detailImage {
	background-image: url('../../img_rtl/g/detail/landscape/lake.jpg')
}

#tileDetails.landscape-vulcano .detailImage {
	background-image: url('../../img_rtl/g/detail/landscape/vulcano.jpg')
}

#tileDetails.landscape-desert_w .detailImage,
#tileDetails.landscape-desert .detailImage {
	background-image: url('../../img_rtl/g/detail/landscape/desert.jpg')
}

#tileDetails.landscape-sea .detailImage {
	background-image: url('../../img_rtl/g/detail/landscape/sea.jpg')
}

.adventureTimers {
	padding-top: 10px;
	padding-bottom: 10px
}

.adventureTimers table {
	background: 0;
	margin-top: 5px;
	margin-bottom: 5px
}

.adventureTimers table td {
	padding-top: 0;
	padding-bottom: 0
}

.adventureTimers .adventureArrival {
	width: 100%
}

.adventureTimers .adventureReturn {
	width: 100%
}

.adventureTimers .adventureText {
	width: 30%;
	vertical-align: top
}

.adventureTimers .adventureDuration {
	width: 15%;
	vertical-align: top
}

.adventureTimers .adventureTimeAt {
	width: 54%;
	vertical-align: top
}

.adventureInfo {
	margin-top: 18px;
	margin-bottom: 18px
}

.adventureSend {
	width: 100%;
	position: relative;
	text-align: center
}

.adventureBackButton {
	position: absolute;
	left: 0;
	top: 5px
}

#tileDetails th,
#tileDetails td {
	padding-right: 0;
	padding-left: 0
}

#dialogContent #tileDetails h1 {
	font-size: 14px;
	margin-bottom: 8px
}

#tileDetails h4 {
	font-size: 14px;
	margin-bottom: 5px
}

#tileDetails h1 span.mainVillage,
.positionDetails h1 span.mainVillage {
	font-size: 12px;
	font-weight: normal;
	margin-right: 3px
}

.dialog #tileDetails h1 span.mainVillage {
	color: silver
}

#tileDetails .detailImage {
	float: right;
	margin-left: 16px
}

#tileDetails .detailImage .options {
	margin-top: 16px
}

#tileDetails .detailImage .option {
	margin-top: 2px;
	padding-right: 10px;
	padding-top: 4px;
	white-space: normal
}

#tileDetails .detailImage .option .option,
#tileDetails .detailImage .option .a.arrow .farmListDetails,
#tileDetails .detailImage .a.arrow .option .farmListDetails,
#tileDetails .detailImage .option table#village_info .player,
#tileDetails table#village_info .detailImage .option .player,
#tileDetails .detailImage .option table#village_info .alliance,
#tileDetails table#village_info .detailImage .option .alliance {
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	direction: rtl
}

#tileDetails .detailImage .a.arrow {
	display: inline-block;
	font-size: 14px;
	width: 100%;
	white-space: normal
}

#tileDetails .detailImage .a.arrow .farmListDetails {
	width: 100%
}

#tileDetails .detailImage .a.arrow .farmListDetails .option,
#tileDetails .detailImage .a.arrow .farmListDetails .farmListDetails,
#tileDetails .detailImage .a.arrow .farmListDetails table#village_info .player,
#tileDetails table#village_info .detailImage .a.arrow .farmListDetails .player,
#tileDetails .detailImage .a.arrow .farmListDetails table#village_info .alliance,
#tileDetails table#village_info .detailImage .a.arrow .farmListDetails .alliance {
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	direction: rtl
}

#tileDetails div#map_details {
	float: left;
	width: 217px
}

#tileDetails table#village_info,
#tileDetails table#distribution,
#tileDetails table#troop_info,
#tileDetails table#surrounding_info {
	margin-bottom: 20px
}

#tileDetails table tr.first th,
#tileDetails table tr.first td {
	padding-top: 0
}

#tileDetails table#village_info tbody th {
	width: 35%
}

#tileDetails table#village_info tbody td {
	font-weight: bold
}

#tileDetails table#village_info tbody th,
#tileDetails table#village_info tbody td {
	padding-top: 3px;
	color: black;
}

#tileDetails table#village_info tbody tr.first th,
#tileDetails table#village_info tbody tr.first td {
	padding-top: 0
}

#tileDetails table#village_info .player,
#tileDetails table#village_info .alliance {
	max-width: 1px
}

#tileDetails table#village_info .player .detailImage .option,
#tileDetails .detailImage table#village_info .player .option,
#tileDetails table#village_info .player .detailImage .a.arrow .farmListDetails,
#tileDetails .detailImage .a.arrow table#village_info .player .farmListDetails,
#tileDetails table#village_info .player .player,
#tileDetails table#village_info .player .alliance,
#tileDetails table#village_info .alliance .detailImage .option,
#tileDetails .detailImage table#village_info .alliance .option,
#tileDetails table#village_info .alliance .detailImage .a.arrow .farmListDetails,
#tileDetails .detailImage .a.arrow table#village_info .alliance .farmListDetails,
#tileDetails table#village_info .alliance .player,
#tileDetails table#village_info .alliance .alliance {
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	direction: rtl
}

#tileDetails table#troop_info .ico {
	width: 10%
}

#tileDetails table#troop_info .val {
	width: 10%;
	text-align: left;
	padding-left: 5px
}

#tileDetails table#troop_info .val {
	font-weight: bold
}

#tileDetails table#troop_info ul {
	margin-top: 0;
	margin-left: 0;
	margin-bottom: 0;
	margin-right: 2px;
	padding-right: 12px
}

#tileDetails table#troop_info.rep tbody {
	line-height: 16px
}

#tileDetails table#troop_info.rep img {
	float: right;
	margin-left: 5px
}

#tileDetails table#troop_info.rep img.carry {
	float: left;
	margin-left: 55px
}

#tileDetails table#distribution {
	width: 100%
}

#tileDetails table#distribution .ico {
	width: 10%
}

#tileDetails table#distribution .val {
	width: 19%;
	text-align: left;
	padding-left: 5px
}

#tileDetails table#distribution .val {
	font-weight: bold
}

#heroInVillageInfo .duration {
	display: -ms-inline-grid;
	display: inline-grid;
	-ms-grid-columns: auto auto;
	grid-template-columns: auto auto
}

#heroInVillageInfo .duration i,
#heroInVillageInfo .duration svg {
	-ms-grid-column: 1;
	grid-column-start: 1;
	-ms-grid-row: 1;
	grid-row-start: 1;
	margin-left: 5px;
	-ms-grid-row-align: center;
	align-self: center
}

#heroInVillageInfo .duration span {
	-ms-grid-column: 2;
	grid-column-start: 2;
	-ms-grid-row: 1;
	grid-row-start: 1;
	-ms-grid-row-align: center;
	align-self: center;
	display: inline-block
}

.headerAdventures {
	line-height: 20px;
	height: 25px;
	padding-bottom: 10px;
	padding-top: 10px;
	font-weight: bold
}

div.durationCalculationsContainer img.openedClosedSwitch {
	width: 18px;
	height: 18px;
	float: right;
	padding: 0;
	margin-left: 5px
}

.hero_adventure .adventureStatusMessage,
.hero_adventure .durationCalculationsContainer {
	background-color: #e7e7e7;
	border-radius: 5px
}

.adventureStatusMessage {
	padding: 5px 10px;
	margin-bottom: 10px
}

.adventureStatusMessage .subMessage,
.attribute .subMessage {
	padding-right: 20px;
	font-style: italic
}

.durationCalculationsContainer {
	padding: 5px
}

#chooseOtherVillageLink {
	color: #333
}

.durationCalculations {
	margin: 10px 30px 0 30px
}

.durationCalculationsContainer .close {
	margin-top: -4px
}

#infoMoveHero {
	padding: 10px 5px 0 5px;
	text-align: justify
}

.durationCalculations select {
	min-width: 150px
}

.slower {
	color: #fc9511
}

.faster {
	color: #498843
}

#adventureListForm a.disabled {
	color: #d2d2d2;
	cursor: default
}

div#rallyPointNeeded {
	padding-top: 10px;
	padding-right: 5px;
	padding-bottom: 10px
}

#heroInVillageInfo {
	padding: 5px;
	padding-top: 10px
}

#heroInVillageInfo .moveHeroLink {
	float: left
}

div#build.exchangeResources {
	width: 500px;
	max-width: 100%
}

div#build.exchangeResources p#submitText,
div#build.exchangeResources p#submitButton {
	margin-top: 5px;
	text-align: left
}

div#build.exchangeResources p#submitButton {
	display: none
}

div#build.exchangeResources span.corr {
	color: #ff4000
}

div#build.exchangeResources p.npc_desc {
	font-size: 14px;
	margin-top: -2px
}

div#build.exchangeResources table#npc {
	line-height: 25px;
	margin-bottom: 4px
}

div#build.exchangeResources table#npc th,
div#build.exchangeResources table#npc td {
	padding: 2px 7px;
	text-align: center
}

div#build.exchangeResources table#npc thead td {
	background-color: #e7e7e7
}

div#build.exchangeResources table#npc thead td i {
	vertical-align: middle
}

div#build.exchangeResources table#npc thead td a+span {
	vertical-align: middle
}

div#build.exchangeResources table#npc td {
	text-align: center
}

div#build.exchangeResources table#npc td.deco {
	padding: 0;
	width: 1px
}

div#build.exchangeResources table#npc td.sel input.text {
	width: 90%
}

div#build.exchangeResources table#npc td.all {
	width: 18%
}

div#build.exchangeResources table#npc td.sum {
	text-align: right;
	padding-right: 20px
}

.he-IL div#build.exchangeResources table#npc .rem,
.he-IL div#build.exchangeResources table#npc #remain {
	direction: ltr;
	unicode-bidi: embed
}

#build.gid17 .whereAreMyMerchants {
	line-height: 20px;
	float: right;
	width: 48%
}

#build.gid17 .npcMerchant {
	float: left;
	width: 48%
}

#build.gid17 .npcMerchant button {
	margin-top: 3px
}

table#send_select hr {
	margin: 0
}

div#build.gid17 div.carry {
	padding-bottom: 15px
}

.merchantCapacityVisualization {
	float: right
}

.merchantCapacity {
	float: left
}

.invisibleButton {
	display: none
}

div#build.gid17 form#marketSend div#button {
	height: 35px
}

div#build.gid17 #merchantsOnTheWay div.filtered {
	display: none
}

div#build.gid17 #merchantsOnTheWay div.filter {
	text-align: left
}

div#build.gid17 #merchantsOnTheWay div.filter .filterContainer {
	background-color: #e7e7e7;
	border-radius: 5px;
	padding: 3px 5px;
	display: inline-block
}

div#build.gid17 #merchantsOnTheWay div.filter img.filterCategory {
	background-image: url('../../img_rtl/a/gid16Filter.png');
	width: 16px;
	height: 16px
}

div#build.gid17 #merchantsOnTheWay div.filter img.filterCategory.filterCategory1 {
	background-position: 0 0
}

div#build.gid17 #merchantsOnTheWay div.filter img.filterCategory.filterCategory2 {
	background-position: 0 -16px
}

#button button.goBack {
	float: right
}

#button button.sendRessources,
#button button.prepare {
	float: left
}

div#build.gid17 span.pleaseConfirm {
	color: #a2a2a2;
	font-weight: normal;
	padding-right: 0
}

#notEnoughMerchantsError {
	padding-bottom: 10px
}

#prepareError {
	padding-right: 3px;
	float: right;
	width: 385px;
	position: relative
}

a.notClickable {
	cursor: default;
	color: #d2d2d2
}

div.options td.sel {
	width: 3%;
	text-align: center;
	padding-left: 0;
	padding-right: 15px
}

div.options table.set input.radio {
	position: relative
}

div.options table#links td.nr input.text {
	width: 20px
}

div.options table#links td.nam input.text {
	width: 175px
}

div.options table#links td.link input.text {
	width: 240px
}

div.options table.timeSettings tbody th,
div.options table#languageSettings tbody th {
	width: 20%
}

div.options table.timeSettings tbody th.timeFormat {
	vertical-align: top;
	padding-top: 11px
}

div.options table#entriesPerPage input.messageReport,
div.options table#entriesPerPage input.troopMovementsPerPage {
	width: 25px
}

div.options table.timeSettings select,
div.options table#languageSettings select {
	width: 185px
}

div.options table#advertisement tbody th {
	width: 25%
}

div.options table#advertisement span.note {
	margin-right: 10px;
	font-size: 11px
}

div.options .timeSettings label,
div.options #advertisement label {
	margin: 6px 0;
	display: block
}

div.options .timeSettings label input,
div.options #advertisement label input {
	vertical-align: text-top
}

div.options div.text {
	padding: 6px 9px 3px
}

div.options table.account tbody th {
	width: 20%;
	white-space: nowrap
}

div.options table#change_pass input.text,
div.options table#change_account_name input.text {
	width: 150px
}

div.options table#change_account_name tbody td {
	width: 40%
}

div.options table#change_mail tbody th {
	width: 20%;
	white-space: nowrap
}

div.options table#change_mail th.process {
	color: #d40000
}

.colorBlind div.options table#change_mail th.process {
	color: #0022af
}

div.options div.text p.maxSitters {
	font-size: 13px;
	margin-top: 0
}

div.options .sitters th {
	text-align: center;
	white-space: nowrap;
	color: #f2f2f2;
	padding: 0 6px;
	width: 5%
}

div.options .sitters th div {
	padding: 8px 25px;
	border-radius: 5px
}

div.options .sitters th div.lightGreen {
	background-color: #99c019
}

div.options .sitters th div.orange {
	background-color: #f78c1f
}

div.options table.sitters2 {
	margin-top: 5px
}

div.options table.sitters2 td {
	text-align: center
}

div.options tr.sitterHead td {
	padding: 2px 4px
}

div.options table.sitters2 td.name {
	white-space: nowrap;
	width: 20%
}

div.options table#sharedUsage th {
	width: 20%;
	white-space: nowrap
}

div.options table#del_acc td.del_selection {
	text-align: right
}

div.options table#del_acc td.del_selection label {
	margin-left: 20px
}

div.options div.submitButtonContainer {
	text-align: center;
	margin-top: 15px
}

div.options table#del_acc td.count {
	font-weight: bold
}

div.options table#del_acc td.count span {
	color: #ff8000
}

div.options table#del_acc input.radio {
	position: relative
}

div.options table#gpack td {
	text-align: right;
	height: 24px
}

div.options table#gpack td span.alert {
	color: red;
	font-weight: bold
}

div.options table#gpack td input.radio {
	position: relative;
	margin-right: 2px;
	margin-left: 2px
}

div.options table#gpack td input.text {
	margin-right: 15px;
	width: 220px
}

div.options table#gpack td div.example {
	margin-right: 22px;
	font-size: 12px
}

div.options table#gpack td div.example span.path {
	color: #ff8000
}

div.options table#download thead td {
	white-space: nowrap
}

table#seasonal_winter_snow_settings.disabled {
	color: silver
}

div.options table#gpack td.info {
	text-align: center;
	font-size: 12px
}

div.options table#download td.nam {
	text-align: right
}

div.options table#download td.size {
	width: 22%
}

div.options table#download td.act {
	width: 22%
}

div.options table#download td.down {
	width: 22%
}

div.options table#other td.noOptions {
	font-style: italic;
	color: #858585
}

div.options span.pleaseSaveYourChanges {
	float: left;
	color: #f88c1f
}

div.options span.pleaseSaveYourChanges.hidden {
	display: none
}

div.options div.vacationMode {
	text-align: center;
	padding: 10px
}

div.options div.vacationMode .daySetter {
	margin: 10px 0 10px 0
}

div.options div.vacationMode .daySetter a {
	width: 18px;
	height: 18px;
	display: inline-block;
	vertical-align: middle
}

div.options div.vacationMode .daySetter.sub a {
	background-image: url('../../img_rtl/a/btnMinus-small.png')
}

div.options div.vacationMode .daySetter.add a {
	background-image: url('../../img_rtl/a/btnPlus-small.png')
}

div.options .conditionsWrapper {
	background-color: #e7e7e7;
	border-radius: 5px
}

div.options .conditionsWrapper .switchWrap {
	padding: 10px
}

div.options .conditionsWrapper ul {
	margin-bottom: 0;
	padding-bottom: 13px
}

div.options #vacationTimeWrapper {
	display: none
}

div.linklist div.recommendedLinks {
	background-color: #e7e7e7;
	border-radius: 5px
}

div.linklist div.recommendedLinks .switchWrap {
	padding: 10px
}

div.linklist div#linkRecommendations {
	padding: 0 10px 10px 10px
}

div.linklist div#hiddenRecommendedLinks {
	display: none
}

div.linklist td.sel {
	width: 3%;
	text-align: center;
	padding-left: 0;
	padding-right: 15px
}

div.linklist table#links thead td {
	font-weight: bold
}

div.linklist table#links td.nr input.text,
div.linklist table#recommendedLinks td.nr input.text {
	width: 25px
}

div.linklist table#links td.nam input.text,
div.linklist table#recommendedLinks td.nam input.text {
	width: 175px
}

div.linklist table#links td.link input.text,
div.linklist table#recommendedLinks td.link input.text {
	width: 240px
}

div.linklist table#links button,
div.linklist table#recommendedLinks button {
	width: 18px;
	height: 18px
}

div.linklist table#links button.addElement,
div.linklist table#recommendedLinks button.addElement {
	background-image: url('../../img_rtl/a/btnPlus-small.png')
}

div.linklist table#links button.removeElement {
	background-image: url('../../img_rtl/a/btnMinus-small.png')
}

div.linklist table#links button:hover,
div.linklist table#recommendedLinks button:hover {
	background-position: 0 -28px
}

div.linklist table#links button:active,
div.linklist table#recommendedLinks button:active {
	background-position: 0 -56px
}

div.linklist div.submitButtonContainer {
	text-align: left;
	margin-top: 15px
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent .duration,
.dialogV1.dialogWrapper .manual.dialog #dialogContent .clocks {
	display: -ms-inline-grid;
	display: inline-grid;
	-ms-grid-columns: auto auto;
	grid-template-columns: auto auto
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent .duration i,
.dialogV1.dialogWrapper .manual.dialog #dialogContent .clocks i,
.dialogV1.dialogWrapper .manual.dialog #dialogContent .duration svg,
.dialogV1.dialogWrapper .manual.dialog #dialogContent .clocks svg {
	-ms-grid-column: 1;
	grid-column-start: 1;
	-ms-grid-row: 1;
	grid-row-start: 1;
	margin-left: 5px;
	-ms-grid-row-align: center;
	align-self: center
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent .duration span,
.dialogV1.dialogWrapper .manual.dialog #dialogContent .clocks span {
	-ms-grid-column: 2;
	grid-column-start: 2;
	-ms-grid-row: 1;
	grid-row-start: 1;
	-ms-grid-row-align: center;
	align-self: center;
	display: inline-block
}

.dialogV1.dialogWrapper .manual.dialog {
	font-size: 14px
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent {
	width: 475px;
	min-height: 525px
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent table {
	background-color: transparent;
	border: 0;
	color: #333;
	vertical-align: top
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent table tr {
	background-color: transparent;
	border: 0;
	color: #333;
	vertical-align: top
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent table td {
	background-color: transparent;
	border: 0;
	color: #333;
	vertical-align: top
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent table th {
	background-color: transparent;
	border: 0;
	color: #333;
	vertical-align: top
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent a.manualBack {
	font-weight: normal
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent h1 {
	color: #333;
	font-size: 14px
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent h1 img {
	margin-left: 5px;
	vertical-align: middle
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent h3 {
	color: #333;
	margin: 10px 0 5px 0
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent #buildings {
	width: 474px;
	float: right;
	margin-top: 30px
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent #buildings H3 {
	margin: 0 0 10px 0
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent #buildings H3 img {
	vertical-align: middle
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent #troops {
	width: 474px;
	float: right
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent #troops H3 {
	margin: 0 0 10px 0
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent #troops H3 img {
	vertical-align: middle
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent .troopInfoWrapper,
.dialogV1.dialogWrapper .manual.dialog #dialogContent .troopDataWrapper {
	float: right;
	margin-top: 6px;
	background-color: #e7e7e7;
	border-radius: 5px
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent p {
	margin-top: 0
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent ul {
	margin: 0;
	padding: 0;
	padding-right: 12px;
	float: right
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent ul li {
	list-style-type: none;
	line-height: 23px;
	width: 221px;
	float: right;
	margin-left: 10px
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent ul li img {
	vertical-align: middle
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent ul li a {
	margin-right: 13px
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent p.description {
	float: right;
	width: 278px;
	min-height: 130px
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent img.building {
	float: left;
	margin-top: -50px
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent p.costsHeader {
	clear: both;
	margin-bottom: 5px
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent .duration {
	margin-top: 5px
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent div.bigUnitSection {
	float: left;
	margin-top: 6px
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent div.bigUnitSection img {
	height: 205px;
	background-repeat: no-repeat;
	background-position: 0 center
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent table#troop_info {
	float: right;
	margin: 10px 25px 10px 7px;
	width: 288px
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent table#troop_info td {
	width: 25%;
	text-align: right;
	padding-left: 3px;
	padding-right: 0;
	white-space: nowrap
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent table#troop_info td img {
	width: 18px;
	margin-left: 5px;
	vertical-align: middle
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent table#troop_details {
	width: 60%;
	background-color: #fff
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent table.troopData {
	float: right;
	margin: 10px 25px 10px 7px;
	width: 288px
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent table.troopData th {
	width: 50%;
	text-align: right;
	padding-left: 18px;
	padding-right: 0
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent table.troopData td {
	width: 50%;
	text-align: right;
	padding-left: 18px;
	padding-right: 0
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent table.troopData td img {
	width: 18px;
	margin-left: 5px;
	vertical-align: middle
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent div#t_desc {
	margin: 15px 0;
	float: right;
	width: 100%;
	clear: both
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent img#big_unit {
	float: left;
	width: 150px;
	height: 120px;
	margin: -30px 2px 0 0
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent div#prereqs {
	margin-top: 25px;
	width: 100%;
	line-height: 20px;
	clear: both
}

.dialogV1.dialogWrapper .manual.dialog #dialogContent .answers {
	margin-top: 15px
}

div.balanceCropBalancePart,
div.productionPerHourTotal,
div.productionPerHour {
	width: 304px;
	float: right
}

div.cropBalanceContainer,
div.productionContainer {
	position: relative;
	float: right;
	width: 100%
}

div.productionContainer h4 {
	margin-bottom: 10px
}

div.total.productionContainer {
	margin-top: 20px;
	clear: all
}

div.productionBoostSpeechBubble,
div.fluidSpeechBubble {
	float: left;
	width: 230px;
	margin-top: 2px
}

div.cropBalanceContainer div.productionBoostSpeechBubble {
	position: relative;
	height: 160px
}

div.fluidSpeechBubble {
	min-height: 55px
}

div.productionBoostSpeechBubble .speechArrowBack {
	bottom: auto;
	top: 26px
}

div.productionBoostSpeechBubble h5 {
	margin-bottom: 3px
}

div.productionBoostSpeechBubble td {
	padding: 3px 5px
}

div.productionContainer .productionBoostResourceSpeechBubble,
div.cropBalanceContainer .productionBoostResourceSpeechBubble {
	position: absolute;
	bottom: 0;
	left: 0
}

div.productionBoostResourceSpeechBubble .speechArrowBack {
	top: auto;
	bottom: 23px
}

div.cropBalanceContainer div.productionBoostResourceSpeechBubble .speechArrowBack {
	bottom: 10px
}

div.productionBoostResourceSpeechBubble .productionBoostSpeechBubbleFurtherInfo {
	font-style: italic;
	font-size: 12px
}

div.productionBoostResourceSpeechBubble p {
	margin: 5px
}

div.cropBalanceContainer .balanceCropBalancePart .subtotal td,
div.productionContainer .productionPerHourTotal .subtotal td {
	border-bottom: 1px solid black
}

div.cropBalanceContainer .balanceCropBalancePart .total td,
div.productionContainer .productionPerHourTotal .total td {
	white-space: nowrap;
	border-bottom: 3px double black
}

div.productionContainer .productionPerHour table,
div.productionContainer .productionPerHour tr,
div.productionContainer .productionPerHour td {
	border-collapse: collapse;
	border: 1px solid silver
}

div.productionPerHour table thead td {
	text-align: right;
	padding: 6px 9px 3px
}

div.productionPerHourTotal .row_table_data tr {
	line-height: 13px
}

div.productionPerHour table .productionSum td {
	font-weight: bold
}

div.cropBalanceContainer table .numberCell,
div.productionContainer table .numberCell {
	text-align: left;
	vertical-align: bottom;
	width: 5%;
	white-space: nowrap
}

div.productionContainer .productionBoostSpeechBubble .numberCell {
	white-space: nowrap
}

div.cropBalanceContainer .balanceCropBalancePart {
	margin-bottom: 10px
}

div.cropBalanceContainer .balanceTroops {
	background-color: #e7e7e7;
	border-radius: 5px
}

div.cropBalanceContainer .balanceTroops table,
div.cropBalanceContainer .balanceTroops tr,
div.cropBalanceContainer .balanceTroops td {
	border-collapse: collapse;
	background-color: #e4e4e4;
	padding: 4px 0 3px
}

div.cropBalanceContainer .balanceTroops .troopLabel {
	padding-right: 32px
}

div.cropBalanceContainer .emptyStorageSpeechBubble {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 205px
}

div.cropBalanceContainer .emptyStorageSpeechBubble p {
	margin: 2px
}

div.cropBalanceContainer .emptyStorageSpeechBubble .fluidSpeechBubble .speechArrowBack {
	top: auto;
	bottom: 12px
}

.questWrapper {
	font-size: 13px;
	width: 566px;
	padding-top: 10px;
	min-height: 375px
}

.questWrapper.achievements {
	width: 566px;
	display: block;
	padding-top: 0
}

div.dialog div.content hr.achievementLine {
	border-style: none none solid;
	border-color: #ddd9ce;
	margin-bottom: 10px;
	margin-top: 10px
}

.questWrapper .questImage {
	float: left;
	width: 130px;
	margin-right: 10px;
	margin-bottom: 10px
}

.questWrapper .questImage img {
	margin-bottom: 10px;
	width: 130px;
	height: 130px
}

.questWrapper .questImage .tipsWrapper {
	position: relative
}

.questWrapper .questImage .tipsWrapper .questTipsToggleDescription {
	position: absolute;
	top: 9px;
	right: 45px
}

.questWrapper .questText {
	float: right;
	width: 400px;
	margin-bottom: -10px
}

.questWrapper .questDescription,
.questWrapper .questTasks,
.questWrapper .questRewards {
	margin: 15px 10px 25px 0
}

.questWrapper.achievements .questDescription,
.questWrapper.achievements .questTasks,
.questWrapper.achievements .questRewards,
.questWrapper.achievements .questTextHighlight,
.questWrapper.achievements .questAchievementPoints,
.questWrapper.achievements .questDifficulty {
	margin: 0 10px 10px 0
}

.questWrapper.achievements .questImage .DailyQuestsReward_01 {
	background-image: url('../../img_rtl/quests/achievement/reward25.png')
}

.questWrapper.achievements .questImage .DailyQuestsReward_02 {
	background-image: url('../../img_rtl/quests/achievement/reward50.png')
}

.questWrapper.achievements .questImage .DailyQuestsReward_03 {
	background-image: url('../../img_rtl/quests/achievement/reward75.png')
}

.questWrapper.achievements .questImage .DailyQuestsReward_04 {
	background-image: url('../../img_rtl/quests/achievement/reward100.png')
}

.questWrapper .questTasks ul#questTodolist {
	padding: 0;
	list-style: none;
	margin: 0
}

.questWrapper .questTasks ul#questTodolist li {
	margin-bottom: 5px;
	padding-right: 15px;
	position: relative
}

.questWrapper .questTasks ul#questTodolist li img {
	position: absolute;
	width: 4px;
	height: 4px;
	right: 4px;
	top: 6px;
	background-image: url('../../img_rtl/activate/dot.png')
}

.questWrapper .questTasks ul#questTodolist li.finished,
.questWrapper .questTasks ul#questTodolist li.reward {
	color: #777
}

.questWrapper .questTasks ul#questTodolist li.finished img,
.questWrapper .questTasks ul#questTodolist li.reward img {
	right: 0;
	top: 0;
	width: 12px;
	height: 12px;
	background-image: url('../../img_rtl/a/check.png')
}

.questWrapper h4 {
	margin-bottom: 0
}

.questWrapper .questRewards {
	margin-top: 10px
}

.questWrapper .questRewards ul.questRewardsList {
	width: 470px
}

.questWrapper .questRewards ul.questRewardsList li {
	float: right;
	margin-left: 20px
}

.questWrapper .questRewards img {
	width: 16px;
	height: 16px
}

.questWrapper .questRewards img.questRewardTypeGold {
	background: url('../../img_rtl/round/button/content/goldInner-rtl.png');
	width: 14px;
	height: 14px
}

.questWrapper .questRewards img.questRewardTypeSilver {
	background: url('../../img_rtl/a/silver-rtl.gif');
	width: 10px;
	height: 10px
}

.questWrapper .questRewards img.questRewardTypeItem {
	background: url('../../img_rtl/hero/item.gif')
}

.questWrapper .questRewards img.questRewardTypeItem.item112 {
	background-position: 0 224px
}

.questWrapper .questRewards img.questRewardTypeItem.item106 {
	background-position: 0 120px
}

.questWrapper .questRewards img.questRewardTypeItem.item114 {
	background-position: 0 172px
}

.questWrapper .questRewards .resourceWrapper .resources {
	margin-left: 10px
}

.questWrapper .questRewards span.questRewardValue.stockFull {
	color: #d40000
}

.colorBlind .questWrapper .questRewards span.questRewardValue.stockFull {
	color: #0022af
}

.questWrapper .questButtons {
	position: relative;
	margin-top: 10px;
	height: 25px
}

.questWrapper .questButtons button {
	position: absolute
}

.questWrapper button.questButtonClose {
	left: 0
}

.questWrapper button.questButtonOverview {
	left: 0
}

.questWrapper button.questButtonGainReward {
	left: 0
}

.questWrapper .questTodoList {
	padding: 0
}

.questWrapper .questTodoList li {
	list-style: none
}

.questWrapper .questTodoList .questCategoryHeadline {
	background: lime;
	font-weight: bold
}

.questWrapper .questTodoList .questCategoryHeadline .questCategoryName {
	float: right
}

.questWrapper .questTodoList .questCategoryHeadline .questCategoryStats {
	float: left
}

.questWrapper .questTodoList .questName {
	margin-right: 20px
}

.questWrapper .categoryProgress {
	float: left
}

#questTodoListDialog ul li.questName img.reward {
	background-image: url('../../img_rtl/a/check.png');
	width: 12px;
	height: 12px
}

#questTodoListDialog ul {
	list-style: none
}

div.dialog div.content h1.questList {
	color: #7b624c;
	text-align: center
}

div.dialog div.questWrapper div.achievement div.nextReset {
	color: #7b624c;
	text-align: center;
	margin-bottom: 3px;
	font-size: 11px
}

div.dialog div.content div.birthdayRibbonContainer div.headline {
	color: #911d1d;
	font-family: IRANSans;
	text-shadow: 1px 0 1px rgba(251, 236, 201, 0.4), 1px 1px 1px rgba(251, 236, 201, 0.4), 0 1px 1px rgba(251, 236, 201, 0.4), -1px 1px 1px rgba(251, 236, 201, 0.4), -1px 0 1px rgba(251, 236, 201, 0.4), -1px -1px 1px rgba(251, 236, 201, 0.4), 0 -1px 1px rgba(251, 236, 201, 0.4), 1px -1px 1px rgba(251, 236, 201, 0.4);
	font-size: 23px;
	line-height: 3em;
	letter-spacing: .2em;
	display: none
}

div.dialog div.content div.pointsAndAchievements {
	margin-top: 40px
}

div.dialog div.content div.achievementPoints {
	background-image: url('../../img_rtl/quests/achievement/kranz.png');
	height: 109px;
	padding: 1px;
	text-align: center;
	width: 122px;
	float: right
}

div.dialog div.content div.achievementPoints div.points {
	font-size: 26px;
	margin-top: 42px;
	padding-left: 5px
}

div.dialog div.content div.achievementPoints div.pointstext {
	font-size: 15px;
	padding-left: 5px;
	padding-top: 16px
}

div.dialog div.content #achievementRewardList div.achievement {
	float: right;
	position: relative
}

div.dialog div.content #achievementRewardList div.achievement div.hook img {
	width: 30px;
	height: 30px;
	background-image: url('../../img_rtl/quests/achievement/haken_gruen.png');
	position: absolute
}

div.dialog div.content #achievementRewardList div.achievement div.hook.points_25 img {
	left: 57px;
	top: -2px
}

div.dialog div.content #achievementRewardList div.achievement div.hook.points_50 img {
	left: 49px;
	top: -2px
}

div.dialog div.content #achievementRewardList div.achievement div.hook.points_75 img {
	left: 45px;
	top: -2px
}

div.dialog div.content #achievementRewardList div.achievement div.hook.points_100 img {
	left: 45px;
	top: -2px
}

div#achievementRewardList div.achievement div.pointAmount {
	color: black;
	font-weight: normal
}

div#achievementRewardList div.achievement div.pointAmount.points_25 {
	font-size: 22px;
	left: 42px;
	position: absolute;
	top: 20px
}

div#achievementRewardList div.achievement div.pointAmount.points_50 {
	font-size: 22px;
	left: 32px;
	position: absolute;
	top: 20px
}

div#achievementRewardList div.achievement div.pointAmount.points_75 {
	font-size: 22px;
	left: 30px;
	position: absolute;
	top: 20px
}

div#achievementRewardList div.achievement div.pointAmount.points_100 {
	font-size: 22px;
	left: 24px;
	position: absolute;
	top: 20px
}

div.dialog div.content #achievementRewardList div.achievement .bigSpeechBubble.rewardReady img {
	background-image: url('../../img_rtl/layout/icons/exclamationMark-rtl.png')
}

div.dialog div.content #achievementRewardList div.achievement .bigSpeechBubble {
	position: absolute;
	right: -12px;
	top: 76px
}

div.dialog div.content #achievementRewardList div.achievementArrow {
	background: url('../../img_rtl/quests/achievement/pfeil-rtl.png') no-repeat center center;
	float: right;
	width: 9px;
	height: 112px;
	margin-right: 5px;
	margin-left: 3px
}

div.dialog div.content #achievementRewardList div.verticalLine {
	background-color: #ddd9ce;
	float: right;
	width: 1px;
	height: 112px;
	margin-right: 10px;
	margin-left: 3px
}

div.dialog div.content #achievementRewardList img.points_25 {
	width: 89px;
	height: 112px;
	background: url('../../img_rtl/quests/achievement/btn_brown_25.png') -18px center
}

div.dialog div.content #achievementRewardList img.points_50 {
	width: 89px;
	height: 112px;
	background: url('../../img_rtl/quests/achievement/btn_brown_50.png') -25px center
}

div.dialog div.content #achievementRewardList img.points_75 {
	width: 89px;
	height: 112px;
	background: url('../../img_rtl/quests/achievement/btn_brown_75.png') -28px center
}

div.dialog div.content #achievementRewardList img.points_100 {
	width: 89px;
	height: 112px;
	background: url('../../img_rtl/quests/achievement/btn_brown_100.png') -28px center
}

div.dialog div.content #achievementRewardList img.points_25.active {
	background: url('../../img_rtl/quests/achievement/btn_green_25.png') -4px center
}

div.dialog div.content #achievementRewardList img.points_50.active {
	background: url('../../img_rtl/quests/achievement/btn_green_50.png') -25px center
}

div.dialog div.content #achievementRewardList img.points_75.active {
	background: url('../../img_rtl/quests/achievement/btn_green_75.png') -28px center
}

div.dialog div.content #achievementRewardList img.points_100.active {
	background: url('../../img_rtl/quests/achievement/btn_green_100.png') -28px center
}

div.dialog div.content #achievementQuestList {
	border-top: 2px solid #ddd9ce;
	background-color: #f2f2f2;
	border-collapse: collapse
}

div.dialog div.content #achievementQuestList tr {
	height: 32px
}

div.dialog div.content #achievementQuestList td {
	background-color: transparent;
	border-bottom: 2px solid #fff
}

div.dialog div.content #achievementQuestList tr.zebra td {
	background-color: #efecdb
}

div.dialog div.content #achievementQuestList img.hook {
	width: 30px;
	height: 30px
}

div.dialog div.content #achievementQuestList img.hook.working {
	background-image: url('../../img_rtl/quests/achievement/haken_weiss.png')
}

div.dialog div.content #achievementQuestList img.hook.done {
	background-image: url('../../img_rtl/quests/achievement/haken_gruen.png')
}

div.dialog div.content #achievementQuestList tr {
	height: 41px
}

div.dialog div.content #achievementQuestList tr:nth-child(even) {
	background-color: #efecdb
}

div.dialog div.content #achievementQuestList tr:nth-child(odd) {
	background-color: #f2f2f2
}

div.dialog div.content #achievementQuestList td.hook {
	width: 35px
}

div.dialog div.content #achievementQuestList td.steps {
	width: 35px
}

div.dialog div.content #achievementQuestList td.points {
	width: 70px;
	color: #99c01a;
	font-weight: bold
}

.questWrapper.achievements h2.questTitle {
	text-align: center;
	margin-top: 10px
}

.questWrapper.achievements .difficulty.moderate {
	color: #006400
}

.questWrapper.achievements .difficulty.challenging {
	color: #ff8c00
}

.questWrapper.achievements .difficulty.hard {
	color: #8b0000
}

.questWrapper .questImage .natars {
	background-image: url('../../img_rtl/quests/natars.png')
}

.questWrapper .questImage .adventure3 {
	background-image: url('../../img_rtl/quests/adventure3.png')
}

.questWrapper .questImage .adventure5 {
	background-image: url('../../img_rtl/quests/adventure5.png')
}

.questWrapper .questImage .heroLevelUp {
	background-image: url('../../img_rtl/quests/heroLevelUp.png')
}

.questWrapper .questImage .hero {
	background-image: url('../../img_rtl/quests/hero.png')
}

.questWrapper .questImage .auction {
	background-image: url('../../img_rtl/quests/auction.png')
}

.questWrapper .questImage .inventoryResources {
	background-image: url('../../img_rtl/quests/inventoryResources.png')
}

.questWrapper .questImage .oasisFree {
	background-image: url('../../img_rtl/quests/oasisFree.png')
}

.questWrapper .questImage .resources {
	background-image: url('../../img_rtl/quests/resources.png')
}

.questWrapper .questImage .resourceTypes {
	background-image: url('../../img_rtl/quests/resourceTypes.png')
}

.questWrapper .questImage .resourceView {
	background-image: url('../../img_rtl/quests/resourceView.png')
}

.questWrapper .questImage .culturePoints {
	background-image: url('../../img_rtl/quests/culturePoints.png')
}

.questWrapper .questImage .trade {
	background-image: url('../../img_rtl/quests/trade.png')
}

.questWrapper .questImage .renameVillage {
	background-image: url('../../img_rtl/quests/renameVillage.png')
}

.questWrapper .questImage .shopButton {
	background-image: url('../../img_rtl/quests/shopButton.png')
}

.questWrapper .questImage .statistics {
	background-image: url('../../img_rtl/quests/statistics.png')
}

.questWrapper .questImage .map {
	background-image: url('../../img_rtl/quests/map.png')
}

.questWrapper .questImage .messages {
	background-image: url('../../img_rtl/quests/messages.png')
}

.questWrapper .questImage .reports {
	background-image: url('../../img_rtl/quests/reports.png')
}

.questWrapper .questImage .newVillage {
	background-image: url('../../img_rtl/quests/newVillage.png')
}

.questWrapper .questImage .upgrade_vid1 {
	background-image: url('../../img_rtl/quests/upgrade_vid1.png')
}

.questWrapper .questImage .upgrade_vid2 {
	background-image: url('../../img_rtl/quests/upgrade_vid2.png')
}

.questWrapper .questImage .upgrade_vid3 {
	background-image: url('../../img_rtl/quests/upgrade_vid3.png')
}

.questWrapper .questImage .upgrade_vid6 {
	background-image: url('../../img_rtl/quests/upgrade_vid6.png')
}

.questWrapper .questImage .upgrade_vid7 {
	background-image: url('../../img_rtl/quests/upgrade_vid7.png')
}

.questWrapper .questImage .warehouse_vid1 {
	background-image: url('../../img_rtl/quests/warehouse_vid1.png')
}

.questWrapper .questImage .warehouse_vid2 {
	background-image: url('../../img_rtl/quests/warehouse_vid2.png')
}

.questWrapper .questImage .warehouse_vid3 {
	background-image: url('../../img_rtl/quests/warehouse_vid3.png')
}

.questWrapper .questImage .warehouse_vid6 {
	background-image: url('../../img_rtl/quests/warehouse_vid6.png')
}

.questWrapper .questImage .warehouse_vid7 {
	background-image: url('../../img_rtl/quests/warehouse_vid7.png')
}

.questWrapper .questImage .granary_vid1 {
	background-image: url('../../img_rtl/quests/granary_vid1.png')
}

.questWrapper .questImage .granary_vid2 {
	background-image: url('../../img_rtl/quests/granary_vid2.png')
}

.questWrapper .questImage .granary_vid3 {
	background-image: url('../../img_rtl/quests/granary_vid3.png')
}

.questWrapper .questImage .granary_vid6 {
	background-image: url('../../img_rtl/quests/granary_vid6.png')
}

.questWrapper .questImage .granary_vid7 {
	background-image: url('../../img_rtl/quests/granary_vid7.png')
}

.questWrapper .questImage .cranny_vid1 {
	background-image: url('../../img_rtl/quests/cranny_vid1.png')
}

.questWrapper .questImage .cranny_vid2 {
	background-image: url('../../img_rtl/quests/cranny_vid2.png')
}

.questWrapper .questImage .cranny_vid3 {
	background-image: url('../../img_rtl/quests/cranny_vid3.png')
}

.questWrapper .questImage .cranny_vid6 {
	background-image: url('../../img_rtl/quests/cranny_vid6.png')
}

.questWrapper .questImage .cranny_vid7 {
	background-image: url('../../img_rtl/quests/cranny_vid7.png')
}

.questWrapper .questImage .barracks_vid1 {
	background-image: url('../../img_rtl/quests/barracks_vid1.png')
}

.questWrapper .questImage .barracks_vid2 {
	background-image: url('../../img_rtl/quests/barracks_vid2.png')
}

.questWrapper .questImage .barracks_vid3 {
	background-image: url('../../img_rtl/quests/barracks_vid3.png')
}

.questWrapper .questImage .barracks_vid6 {
	background-image: url('../../img_rtl/quests/barracks_vid6.png')
}

.questWrapper .questImage .barracks_vid7 {
	background-image: url('../../img_rtl/quests/barracks_vid7.png')
}

.questWrapper .questImage .marketplace_vid1 {
	background-image: url('../../img_rtl/quests/marketplace_vid1.png')
}

.questWrapper .questImage .marketplace_vid2 {
	background-image: url('../../img_rtl/quests/marketplace_vid2.png')
}

.questWrapper .questImage .marketplace_vid3 {
	background-image: url('../../img_rtl/quests/marketplace_vid3.png')
}

.questWrapper .questImage .marketplace_vid6 {
	background-image: url('../../img_rtl/quests/marketplace_vid6.png')
}

.questWrapper .questImage .marketplace_vid7 {
	background-image: url('../../img_rtl/quests/marketplace_vid7.png')
}

.questWrapper .questImage .wall_vid1 {
	background-image: url('../../img_rtl/quests/wall_vid1.png')
}

.questWrapper .questImage .wall_vid2 {
	background-image: url('../../img_rtl/quests/wall_vid2.png')
}

.questWrapper .questImage .wall_vid3 {
	background-image: url('../../img_rtl/quests/wall_vid3.png')
}

.questWrapper .questImage .wall_vid6 {
	background-image: url('../../img_rtl/quests/wall_vid6.png')
}

.questWrapper .questImage .wall_vid7 {
	background-image: url('../../img_rtl/quests/wall_vid7.png')
}

.questWrapper .questImage .academy_vid1 {
	background-image: url('../../img_rtl/quests/academy_vid1.png')
}

.questWrapper .questImage .academy_vid2 {
	background-image: url('../../img_rtl/quests/academy_vid2.png')
}

.questWrapper .questImage .academy_vid3 {
	background-image: url('../../img_rtl/quests/academy_vid3.png')
}

.questWrapper .questImage .academy_vid6 {
	background-image: url('../../img_rtl/quests/academy_vid6.png')
}

.questWrapper .questImage .academy_vid7 {
	background-image: url('../../img_rtl/quests/academy_vid7.png')
}

.questWrapper .questImage .mainBuilding_vid1 {
	background-image: url('../../img_rtl/quests/mainBuilding_vid1.png')
}

.questWrapper .questImage .mainBuilding_vid2 {
	background-image: url('../../img_rtl/quests/mainBuilding_vid2.png')
}

.questWrapper .questImage .mainBuilding_vid3 {
	background-image: url('../../img_rtl/quests/mainBuilding_vid3.png')
}

.questWrapper .questImage .mainBuilding_vid6 {
	background-image: url('../../img_rtl/quests/mainBuilding_vid6.png')
}

.questWrapper .questImage .mainBuilding_vid7 {
	background-image: url('../../img_rtl/quests/mainBuilding_vid7.png')
}

.questWrapper .questImage .grainMill_vid1 {
	background-image: url('../../img_rtl/quests/grainMill_vid1.png')
}

.questWrapper .questImage .grainMill_vid2 {
	background-image: url('../../img_rtl/quests/grainMill_vid2.png')
}

.questWrapper .questImage .grainMill_vid3 {
	background-image: url('../../img_rtl/quests/grainMill_vid3.png')
}

.questWrapper .questImage .grainMill_vid6 {
	background-image: url('../../img_rtl/quests/grainMill_vid6.png')
}

.questWrapper .questImage .grainMill_vid7 {
	background-image: url('../../img_rtl/quests/grainMill_vid7.png')
}

.questWrapper .questImage .smithy_vid1 {
	background-image: url('../../img_rtl/quests/smithy_vid1.png')
}

.questWrapper .questImage .smithy_vid2 {
	background-image: url('../../img_rtl/quests/smithy_vid2.png')
}

.questWrapper .questImage .smithy_vid3 {
	background-image: url('../../img_rtl/quests/smithy_vid3.png')
}

.questWrapper .questImage .smithy_vid6 {
	background-image: url('../../img_rtl/quests/smithy_vid6.png')
}

.questWrapper .questImage .smithy_vid7 {
	background-image: url('../../img_rtl/quests/smithy_vid7.png')
}

.questWrapper .questImage .smithyCloseup_vid1 {
	background-image: url('../../img_rtl/quests/smithyCloseup_vid1.png')
}

.questWrapper .questImage .smithyCloseup_vid2 {
	background-image: url('../../img_rtl/quests/smithyCloseup_vid2.png')
}

.questWrapper .questImage .smithyCloseup_vid3 {
	background-image: url('../../img_rtl/quests/smithyCloseup_vid3.png')
}

.questWrapper .questImage .smithyCloseup_vid6 {
	background-image: url('../../img_rtl/quests/smithyCloseup_vid6.png')
}

.questWrapper .questImage .smithyCloseup_vid7 {
	background-image: url('../../img_rtl/quests/smithyCloseup_vid7.png')
}

.questWrapper .questImage .government_vid1 {
	background-image: url('../../img_rtl/quests/government_vid1.png')
}

.questWrapper .questImage .government_vid2 {
	background-image: url('../../img_rtl/quests/government_vid2.png')
}

.questWrapper .questImage .government_vid3 {
	background-image: url('../../img_rtl/quests/government_vid3.png')
}

.questWrapper .questImage .government_vid6 {
	background-image: url('../../img_rtl/quests/government_vid6.png')
}

.questWrapper .questImage .government_vid7 {
	background-image: url('../../img_rtl/quests/government_vid7.png')
}

.questWrapper .questImage .embassy_vid1 {
	background-image: url('../../img_rtl/quests/embassy_vid1.png')
}

.questWrapper .questImage .embassy_vid2 {
	background-image: url('../../img_rtl/quests/embassy_vid2.png')
}

.questWrapper .questImage .embassy_vid3 {
	background-image: url('../../img_rtl/quests/embassy_vid3.png')
}

.questWrapper .questImage .embassy_vid6 {
	background-image: url('../../img_rtl/quests/embassy_vid6.png')
}

.questWrapper .questImage .embassy_vid7 {
	background-image: url('../../img_rtl/quests/embassy_vid7.png')
}

.questWrapper .questImage .stable_vid1 {
	background-image: url('../../img_rtl/quests/stable_vid1.png')
}

.questWrapper .questImage .stable_vid2 {
	background-image: url('../../img_rtl/quests/stable_vid2.png')
}

.questWrapper .questImage .stable_vid3 {
	background-image: url('../../img_rtl/quests/stable_vid3.png')
}

.questWrapper .questImage .stable_vid6 {
	background-image: url('../../img_rtl/quests/stable_vid6.png')
}

.questWrapper .questImage .stable_vid7 {
	background-image: url('../../img_rtl/quests/stable_vid7.png')
}

.questWrapper .questImage .townHall_vid1 {
	background-image: url('../../img_rtl/quests/townHall_vid1.png')
}

.questWrapper .questImage .townHall_vid2 {
	background-image: url('../../img_rtl/quests/townHall_vid2.png')
}

.questWrapper .questImage .townHall_vid3 {
	background-image: url('../../img_rtl/quests/townHall_vid3.png')
}

.questWrapper .questImage .townHall_vid6 {
	background-image: url('../../img_rtl/quests/townHall_vid6.png')
}

.questWrapper .questImage .townHall_vid7 {
	background-image: url('../../img_rtl/quests/townHall_vid7.png')
}

.questWrapper .questImage .ironMine {
	background-image: url('../../img_rtl/quests/ironMine.png')
}

.questWrapper .questImage .infantry1_vid1 {
	background-image: url('../../img_rtl/quests/infantry1_vid1.png')
}

.questWrapper .questImage .infantry1_vid2 {
	background-image: url('../../img_rtl/quests/infantry1_vid2.png')
}

.questWrapper .questImage .infantry1_vid3 {
	background-image: url('../../img_rtl/quests/infantry1_vid3.png')
}

.questWrapper .questImage .infantry1_vid6 {
	background-image: url('../../img_rtl/quests/infantry1_vid6.png')
}

.questWrapper .questImage .infantry1_vid7 {
	background-image: url('../../img_rtl/quests/infantry1_vid7.png')
}

.questWrapper .questImage .infantry2_vid1 {
	background-image: url('../../img_rtl/quests/infantry2_vid1.png')
}

.questWrapper .questImage .infantry2_vid2 {
	background-image: url('../../img_rtl/quests/infantry2_vid2.png')
}

.questWrapper .questImage .infantry2_vid3 {
	background-image: url('../../img_rtl/quests/infantry2_vid3.png')
}

.questWrapper .questImage .infantry2_vid6 {
	background-image: url('../../img_rtl/quests/infantry2_vid6.png')
}

.questWrapper .questImage .infantry2_vid7 {
	background-image: url('../../img_rtl/quests/infantry2_vid7.png')
}

.questWrapper .questImage .settler_vid1 {
	background-image: url('../../img_rtl/quests/settler_vid1.png')
}

.questWrapper .questImage .settler_vid2 {
	background-image: url('../../img_rtl/quests/settler_vid2.png')
}

.questWrapper .questImage .settler_vid3 {
	background-image: url('../../img_rtl/quests/settler_vid3.png')
}

.questWrapper .questImage .settler_vid6 {
	background-image: url('../../img_rtl/quests/settler_vid6.png')
}

.questWrapper .questImage .settler_vid7 {
	background-image: url('../../img_rtl/quests/settler_vid7.png')
}

div.bigSpeechBubble {
	background: url('../../img_rtl/round/speechBubble/speechBalloonLarge-rtl.png');
	width: 55px;
	height: 44px;
	margin-top: 60px;
	margin-right: -80px;
}

.bigSpeechBubble img {
	width: 30px;
	height: 30px;
	position: absolute;
	right: 6px;

}

#regionContainer #regionNeighborDetailsWithMap {
	position: relative;
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: 1fr auto;
	grid-template-columns: 1fr auto;
	margin-bottom: 10px
}

#regionContainer #regionNeighborDetailsWithMap div:first-of-type {
	padding-left: 10px;
	-ms-grid-column: 1;
	grid-column-start: 1
}

#regionContainer #regionNeighborDetailsWithMap div.regionMapContainer {
	position: relative;
	-ms-grid-column: 2;
	grid-column-start: 2
}

#regionContainer #regionNeighborDetailsWithMap div.regionMapContainer #regionMinimap {
	position: relative;
	top: auto;
	right: auto;
	left: auto;
	z-index: 1
}

#regionContainer #regionNeighborDetailsWithMap div.regionMapContainer.factionsOverlay {
	border: 1px solid #333;
	border-radius: 3px
}

#regionContainer #regionNeighborDetailsWithMap div.regionMapContainer.factionsOverlay img {
	border-radius: 3px
}

#regionContainer #regionNeighborDetailsWithMap div.regionMapContainer.factionsOverlay:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	z-index: 2;
	background-image: url('../../img_rtl/region/regionDetailsMap_small.png');
	width: 185px;
	height: 185px
}

#regionContainer #regionNeighborDetailsWithMap div.regionMapContainer.factionsOverlay svg {
	background-color: transparent
}

#regionContainer svg.regionsInEurope {
	position: absolute;
	right: 0;
	top: 0;
	z-index: 2;
	background-color: rgba(242, 242, 242, 0.55)
}

#regionContainer svg.regionsInEurope g {
	cursor: pointer;
	transition-duration: 150ms;
	stroke: transparent;
	stroke-width: 2px
}

#regionContainer svg.regionsInEurope g.active {
	fill: #991915;
	stroke: #f8c000
}

#regionContainer svg.regionsInEurope g:hover {
	stroke: #f2f2f2
}

#regionContainer svg.regionsInEurope g.highlight {
	stroke: #f2f2f2;
	filter: url("#regionBrightness")
}

#regionContainer svg.regionsInEurope g.copyFront {
	pointer-events: none
}

#regionContainer a svg.regionsInEurope g {
	pointer-events: none
}

#regionContainer #neighboringRegions tbody tr td {
	transition-duration: 150ms
}

#regionContainer #neighboringRegions tbody tr td:nth-child(1),
#regionContainer #neighboringRegions tbody tr td:nth-child(4) {
	text-align: center
}

#regionContainer #neighboringRegions tbody tr td:nth-child(2),
#regionContainer #neighboringRegions tbody tr td:nth-child(3) {
	text-align: left
}

#regionContainer #neighboringRegions tbody tr.highlight td {
	background-color: #e7f0ca
}

#regionContainer #regionDetailContent {
	position: relative;
	float: right
}

#regionContainer #regionDetailContent.inTreasury {
	width: 348px
}

#regionContainer #regionDetailContent .lTop {
	float: right;
	clear: right;
	padding-top: 10px;
	max-width: 50%
}

#regionContainer #regionDetailContent .rTop {
	float: left;
	clear: left;
	padding-top: 10px
}

#regionContainer #regionDetailContent .lTop.withIcon,
#regionContainer #regionDetailContent .rTop.withIcon {
	line-height: 22px
}

#regionContainer #regionDetailContent .lTop a.regionSettleIcon {
	width: 22px;
	height: 22px;
	background-image: url('../../img_rtl/region/icons/region_info_icon.png');
	position: relative;
	display: inline-block
}

#regionContainer #regionDetailContent .lBottom {
	float: right;
	clear: right;
	padding-top: 10px;
	padding-bottom: 10px;
	max-width: 50%
}

#regionContainer #regionDetailContent .rBottom {
	float: left;
	clear: left;
	padding-top: 10px;
	padding-bottom: 10px;
	max-width: 50%
}

#regionContainer #regionDetailContent table {
	width: 348px;
	margin-top: 10px
}

#regionContainer #regionDetailContent:not(.regionInfo) table td {
	text-align: center
}

#regionContainer #regionDetailContent table td.allianceTag {
	white-space: nowrap
}

#regionContainer #regionDetailContent table tr.none td {
	background-color: #efefef
}

#regionContainer #regionDetailContent table tr.allyNotInTop td,
#regionContainer #regionDetailContent table tr.allyNotInTop td a {
	color: silver
}

#regionContainer #regionMapContainer {
	position: absolute;
	left: 24px;
	top: 210px;
	z-index: 300
}

.victoryArtefactGatherBlock {
	height: 200px;
	display: table
}

.territoryStatistics .victoryArtefactGatherBlock:first-child {
	float: right
}

.territoryStatistics .victoryArtefactGatherBlock:not(:first-child) {
	padding-right: 15px
}

.victoryArtefactGatherBlock #ancientPowerStatus {
	display: table-cell;
	vertical-align: middle
}

.victoryArtefactGatherBlock #regionPieChart {
	text-align: center;
	display: table-cell;
	vertical-align: middle
}

.victoryArtefactGatherBlock #regionPieChartAgenda {
	text-align: center;
	display: table-cell;
	vertical-align: middle;
	background-color: #fff;
	padding: 0
}

.victoryArtefactGatherBlock #regionPieChartAgenda table {
	background-color: #fff
}

.victoryArtefactGatherBlock #regionPieChartAgenda table tbody td {
	line-height: 16px;
	padding: 0 7px 0 7px
}

#regionContainer #regionDetailContent.regionInfo table {
	width: 554px;
	text-align: center
}

#regionContainer #regionDetailContent.regionInfo table td {
	text-align: center
}

#regionDetailContent.regionInfo .territorialControl {
	width: 120px
}

.progressBarContainer .progressBar {
	background-color: #fff;
	height: 8px;
	border: 1px solid #c6c6c6;
	padding: 1px;
	margin: 1px
}

.progressBarContainer .bar {
	height: 100%;
	float: right
}

.progressBarContainer .bar.green {
	background-color: #006900
}

.progressBarContainer .progressBarText {
	position: relative;
	float: right;
	padding-bottom: 5px
}

.progressBarContainer .progressBarNumbers {
	position: relative;
	float: left
}

#statisticsV2 #resourceRank:after,
#statisticsV2 #resourceRank .resourceBarChartContainer:after,
#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChart:after,
#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChart .barContainer .positive:after,
#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChart .barContainer .negative:after,
#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChartLegend:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0
}

#combatSimulator .results .combatStatistics table .inlineIcon,
#statisticsV2 .inlineIcon {
	display: -ms-inline-grid;
	display: inline-grid;
	-ms-grid-columns: auto auto;
	grid-template-columns: auto auto
}

#combatSimulator .results .combatStatistics table .inlineIcon i,
#statisticsV2 .inlineIcon i,
#combatSimulator .results .combatStatistics table .inlineIcon svg,
#statisticsV2 .inlineIcon svg {
	-ms-grid-column: 1;
	grid-column-start: 1;
	-ms-grid-row: 1;
	grid-row-start: 1;
	margin-left: 5px;
	-ms-grid-row-align: center;
	align-self: center
}

#combatSimulator .results .combatStatistics table .inlineIcon span,
#statisticsV2 .inlineIcon span {
	-ms-grid-column: 2;
	grid-column-start: 2;
	-ms-grid-row: 1;
	grid-row-start: 1;
	-ms-grid-row-align: center;
	align-self: center;
	display: inline-block
}

#tasks .task .progress button .collectedCheckmark {
	background-image: linear-gradient(to bottom, #cba467 5%, #f3e2ae 13%, #efbf7b 32%, #aa8050 48%, #835e35 72%, #ad8a54 93%, #d7b672 100%)
}

#tasks .task.achieved {
	background-image: linear-gradient(to bottom, #8fb74f 5%, #add076 13%, #add076 32%, #addd61 48%, #5b7a2a 72%, #618030 93%, #7fa246 100%)
}

#tasks .taskDetailview .taskDescription .imageFrame,
#tasks .task,
#tasks .task .progress .progressBar .bar,
#tasks .rewardBonus {
	background-image: linear-gradient(to bottom, #cba467 5%, #f3e2ae 13%, #efbf7b 32%, #aa8050 48%, #835e35 72%, #ad8a54 93%, #d7b672 100%);
	border: 1px solid #34220d;
	border-radius: 4px
}

#tasks .taskDetailview .taskDescription .imageFrame:before,
#tasks .task:before,
#tasks .task .progress .progressBar .bar:before,
#tasks .rewardBonus:before {
	content: "";
	position: absolute;
	top: 2px;
	left: 2px;
	bottom: 2px;
	right: 2px;
	background-color: #664e40;
	border: solid 1px #44321d;
	border-radius: 1px
}

.scene .iconButton {
	float: none;
	background-image: none
}

.scene * {
	box-sizing: border-box
}

.scene *:after,
.scene *:before {
	background-repeat: no-repeat;
	background-position: top right;
	box-sizing: border-box
}

.scene input[type="text"],
.scene input[type="number"] {
	background-position: initial
}

.scene i.artefact_buildingMaster {
	background-image: url('../../img_rtl/scenes/General/artefact/buildingMasterBonus-rtl.png');
	width: 16px;
	height: 16px
}

.scene i.artefact_spy {
	background-image: url('../../img_rtl/scenes/General/artefact/spyBonus-rtl.png');
	width: 16px;
	height: 16px
}

.scene i.hero_offBonus {
	background-image: url('../../img_rtl/scenes/General/hero/offBonus-rtl.png');
	width: 16px;
	height: 16px
}

.scene i.hero_defBonus {
	background-image: url('../../img_rtl/scenes/General/hero/defBonus-rtl.png');
	width: 16px;
	height: 16px
}

.scene i.hero_health {
	background-image: url('../../img_rtl/scenes/General/hero/health-rtl.png');
	width: 16px;
	height: 16px
}

.scene i.hero_strength {
	background-image: url('../../img_rtl/scenes/General/hero/strength-rtl.png');
	width: 16px;
	height: 16px
}

.scene i.hero_horse {
	background-image: url('../../img_rtl/scenes/General/hero/horse-rtl.png');
	width: 16px;
	height: 16px
}

.scene i.hero_bag {
	background-image: url('../../img_rtl/scenes/General/hero/bag-rtl.png');
	width: 16px;
	height: 16px
}

.scene i.hero_handL {
	background-image: url('../../img_rtl/scenes/General/hero/handL.png');
	width: 15px;
	height: 16px
}

.scene i.hero_handR {
	background-image: url('../../img_rtl/scenes/General/hero/handR.png');
	width: 15px;
	height: 16px
}

.scene i.hero_torso {
	background-image: url('../../img_rtl/scenes/General/hero/torso-rtl.png');
	width: 16px;
	height: 15px
}

.scene i.trap {
	background-image: url('../../img_rtl/scenes/General/troops/trap_small.png');
	width: 16px;
	height: 16px
}

.scene i.troopCount {
	background-image: url('../../img_rtl/scenes/General/troops/troopCount_small.png');
	width: 15px;
	height: 16px
}

.scene i.troopLevel {
	background-image: url('../../img_rtl/scenes/General/troops/troopLevel_small.png');
	width: 16px;
	height: 15px
}

.scene i.troopDead {
	background-image: url('../../img_rtl/scenes/General/troops/troopDead_small.png');
	width: 16px;
	height: 16px
}

.scene i.troopWounded {
	background-image: url('../../img_rtl/scenes/General/troops/troopWounded_small.png');
	width: 15px;
	height: 16px
}

.scene i.celebration_small {
	background-image: url('../../img_rtl/scenes/General/misc/celebration_small.png');
	width: 12px;
	height: 16px
}

.scene i.celebration_medium {
	background-image: url('../../img_rtl/scenes/General/misc/celebration_medium.png');
	width: 20px;
	height: 24px
}

.scene i.target {
	background-image: url('../../img_rtl/scenes/General/misc/target-rtl.png');
	width: 14px;
	height: 14px
}

.scene i.trade_small {
	background-image: url('../../img_rtl/scenes/General/misc/trade_small.png');
	width: 16px;
	height: 16px
}

.scene i.trade_medium {
	background-image: url('../../img_rtl/scenes/General/misc/trade_medium.png');
	width: 26px;
	height: 24px
}

.scene i.player_medium {
	background-image: url('../../img_rtl/scenes/General/misc/player_medium.png');
	width: 14px;
	height: 24px
}

.scene i.player_large {
	background-image: url('../../img_rtl/scenes/General/misc/player_large.png');
	width: 30px;
	height: 56px
}

.scene i.time_medium {
	background-image: url('../../img_rtl/scenes/General/misc/time_medium.png');
	width: 24px;
	height: 24px
}

.scene i.bounty_small {
	background-image: url('../../img_rtl/scenes/General/combat/bounty_small.png');
	width: 14px;
	height: 16px
}

.scene i.bounty_medium {
	background-image: url('../../img_rtl/scenes/General/combat/bounty_medium.png');
	width: 24px;
	height: 24px
}

.scene i.defenseCavalry_small {
	background-image: url('../../img_rtl/scenes/General/combat/defenseCavalry_small.png');
	width: 14px;
	height: 16px
}

.scene i.defenseInfantry_small {
	background-image: url('../../img_rtl/scenes/General/combat/defenseInfantry_small.png');
	width: 14px;
	height: 16px
}

.scene .tabContainer .tabHeader {
	display: -ms-grid;
	display: grid;
	justify-content: start
}

.scene .tabContainer .tabHeader .tab {
	-ms-grid-row: 1;
	grid-row-start: 1;
	grid-column-start: auto;
	-ms-grid-row-align: end;
	align-self: end;
	border: 1px solid #ddc6a2;
	border-bottom: 0;
	display: -ms-grid;
	display: grid;
	cursor: pointer;
	transition: padding .2s
}

.scene .tabContainer .tabHeader .tab:nth-child(1) {
	-ms-grid-column: 1
}

.scene .tabContainer .tabHeader .tab:nth-child(2) {
	-ms-grid-column: 2
}

.scene .tabContainer .tabHeader .tab:nth-child(3) {
	-ms-grid-column: 3
}

.scene .tabContainer .tabHeader .tab:nth-child(4) {
	-ms-grid-column: 4
}

.scene .tabContainer .tabHeader .tab:nth-child(5) {
	-ms-grid-column: 5
}

.scene .tabContainer .tabHeader .tab i,
.scene .tabContainer .tabHeader .tab span {
	-ms-grid-row: 1;
	grid-row-start: 1;
	grid-column-start: auto;
	-ms-grid-row-align: center;
	align-self: center;
	display: inline-block
}

.scene .tabContainer .tabHeader .tab i:nth-child(1),
.scene .tabContainer .tabHeader .tab span:nth-child(1) {
	-ms-grid-column: 1
}

.scene .tabContainer .tabHeader .tab i:nth-child(2),
.scene .tabContainer .tabHeader .tab span:nth-child(2) {
	-ms-grid-column: 2
}

.scene .tabContainer .tabHeader .tab i:nth-child(3),
.scene .tabContainer .tabHeader .tab span:nth-child(3) {
	-ms-grid-column: 3
}

.scene .tabContainer .tabHeader .tab i:nth-child(4),
.scene .tabContainer .tabHeader .tab span:nth-child(4) {
	-ms-grid-column: 4
}

.scene .tabContainer .tabHeader .tab i:nth-child(5),
.scene .tabContainer .tabHeader .tab span:nth-child(5) {
	-ms-grid-column: 5
}

.scene .tabContainer .tabHeader .tab i {
	margin-right: 5px
}

.scene .tabContainer .tabHeader .tab:nth-child(n+2) {
	margin-right: 3px
}

.scene .tabContainer .tabHeader .tab.selected {
	position: relative;
	z-index: 3;
	padding: 7px 10px;
	background-color: #fcf2da
}

.scene .tabContainer .tabHeader .tab:not(.selected) {
	padding: 7px 10px 2px;
	background-color: #f2e5c6
}

.scene .tabContainer .tabHeader .tab:hover:not(.selected) {
	padding-bottom: 7px
}

.scene .tabContainer .tabContent {
	position: relative;
	z-index: 2;
	margin-top: -1px;
	border: 1px solid #ddc6a2
}

.scene .tabContainer .tabContent .header {
	background-color: #fcf2da;
	padding: 5px
}

.scene .tabContainer .tabContent .body {
	background-color: #fff9eb;
	padding: 5px
}

.scene .iconButton {
	display: inline-block;
	position: relative;
	width: 26px;
	height: 26px;
	overflow: hidden;
	border-radius: 3px;
	border: 1px solid #cfcfcf;
	border-bottom-color: #b6b6b6;
	text-align: center
}

.scene .iconButton span {
	position: relative;
	z-index: 2;
	color: #333;
	font-weight: normal;
	line-height: 26px
}

.scene .iconButton i {
	position: relative;
	z-index: 3;
	width: 100%;
	height: 100%;
	background-position: center
}

.scene .iconButton:not(.disabled) {
	background-color: #fafafa
}

.scene .iconButton:not(.disabled) svg {
	position: relative;
	z-index: 3
}

.scene .iconButton:not(.disabled) svg path {
	fill: #5f5f64
}

.scene .iconButton:not(.disabled):before {
	content: "";
	position: absolute;
	top: 1px;
	left: 1px;
	bottom: 1px;
	right: 1px;
	border: 1px solid #e2e2e2;
	background-color: #fafafa
}

.scene .iconButton:not(.disabled):after {
	opacity: .5;
	transform: rotate(-10deg);
	content: "";
	position: absolute;
	top: -5px;
	left: -5px;
	bottom: -5px;
	right: -5px;
	background-image: linear-gradient(to bottom, rgba(223, 223, 223, 0) 45%, #dfdfdf 55%, #e6e6e6)
}

.scene .iconButton:not(.disabled):active,
.scene .iconButton:not(.disabled).active {
	background-color: #add966;
	box-shadow: inset 1px 1px 3px rgba(0, 0, 0, 0.5)
}

.scene .iconButton:not(.disabled):active:before,
.scene .iconButton:not(.disabled):active:after,
.scene .iconButton:not(.disabled).active:before,
.scene .iconButton:not(.disabled).active:after {
	display: none
}

.scene .iconButton:not(.disabled):active:hover,
.scene .iconButton:not(.disabled).active:hover {
	background-color: #add966
}

.scene .iconButton.round {
	border-radius: 50%
}

.scene .iconButton.round:not(.disabled):before {
	border-radius: 50%
}

.scene .iconButton:hover:not(.disabled) {
	background-color: #7cb029
}

.scene .iconButton.disabled {
	background: #919191;
	cursor: not-allowed;
	pointer-events: none
}

.scene .iconButton.disabled svg path {
	fill: #fff
}

#combatSimulator i.bigTribe1:not(.inactive) {
	background-image: url('../../img_rtl/scenes/CombatSimulator/tribes/roman.png');
	width: 55px;
	height: 63px
}

#combatSimulator i.bigTribe1.inactive {
	background-image: url('../../img_rtl/scenes/CombatSimulator/tribes/roman_inactive.png');
	width: 36px;
	height: 43px
}

#combatSimulator i.smallTribe1 {
	background-image: url('../../img_rtl/scenes/CombatSimulator/tribes/roman_small.png');
	width: 37px;
	height: 37px
}

#combatSimulator i.bigTribe2:not(.inactive) {
	background-image: url('../../img_rtl/scenes/CombatSimulator/tribes/teuton.png');
	width: 57px;
	height: 59px
}

#combatSimulator i.bigTribe2.inactive {
	background-image: url('../../img_rtl/scenes/CombatSimulator/tribes/teuton_inactive.png');
	width: 47px;
	height: 41px
}

#combatSimulator i.smallTribe2 {
	background-image: url('../../img_rtl/scenes/CombatSimulator/tribes/teuton_small.png');
	width: 37px;
	height: 37px
}

#combatSimulator i.bigTribe3:not(.inactive) {
	background-image: url('../../img_rtl/scenes/CombatSimulator/tribes/gaul.png');
	width: 57px;
	height: 62px
}

#combatSimulator i.bigTribe3.inactive {
	background-image: url('../../img_rtl/scenes/CombatSimulator/tribes/gaul_inactive.png');
	width: 43px;
	height: 45px
}

#combatSimulator i.smallTribe3 {
	background-image: url('../../img_rtl/scenes/CombatSimulator/tribes/gaul_small.png');
	width: 37px;
	height: 37px
}

#combatSimulator i.bigTribe4:not(.inactive) {
	background-image: url('../../img_rtl/scenes/CombatSimulator/tribes/nature.png');
	width: 57px;
	height: 52px
}

#combatSimulator i.bigTribe4.inactive {
	background-image: url('../../img_rtl/scenes/CombatSimulator/tribes/nature_inactive.png');
	width: 44px;
	height: 37px
}

#combatSimulator i.smallTribe4 {
	background-image: url('../../img_rtl/scenes/CombatSimulator/tribes/nature_small.png');
	width: 37px;
	height: 37px
}

#combatSimulator i.bigTribe5:not(.inactive) {
	background-image: url('../../img_rtl/scenes/CombatSimulator/tribes/natar.png');
	width: 57px;
	height: 51px
}

#combatSimulator i.bigTribe5.inactive {
	background-image: url('../../img_rtl/scenes/CombatSimulator/tribes/natar_inactive.png');
	width: 43px;
	height: 35px
}

#combatSimulator i.bigTribe6:not(.inactive) {
	background-image: url('../../img_rtl/scenes/CombatSimulator/tribes/egyptian.png');
	width: 57px;
	height: 58px
}

#combatSimulator i.bigTribe6.inactive {
	background-image: url('../../img_rtl/scenes/CombatSimulator/tribes/egyptian_inactive.png');
	width: 47px;
	height: 40px
}

#combatSimulator i.smallTribe6 {
	background-image: url('../../img_rtl/scenes/CombatSimulator/tribes/egyptian_small.png');
	width: 37px;
	height: 37px
}

#combatSimulator i.bigTribe7:not(.inactive) {
	background-image: url('../../img_rtl/scenes/CombatSimulator/tribes/hun.png');
	width: 57px;
	height: 60px
}

#combatSimulator i.bigTribe7.inactive {
	background-image: url('../../img_rtl/scenes/CombatSimulator/tribes/hun_inactive.png');
	width: 49px;
	height: 45px
}

#combatSimulator i.smallTribe7 {
	background-image: url('../../img_rtl/scenes/CombatSimulator/tribes/hun_small.png');
	width: 37px;
	height: 37px
}

#combatSimulator i.allyBonus {
	background-image: url('../../img_rtl/scenes/CombatSimulator/general/allyBonus-rtl.png');
	width: 13px;
	height: 16px
}

#combatSimulator i.shield {
	background-image: url('../../img_rtl/scenes/CombatSimulator/heroEquipment/shield-rtl.png');
	width: 14px;
	height: 16px
}

#combatSimulator i.horn {
	background-image: url('../../img_rtl/scenes/CombatSimulator/heroEquipment/horn-rtl.png');
	width: 16px;
	height: 15px
}

#combatSimulator i.scaleArmour {
	background-image: url('../../img_rtl/scenes/CombatSimulator/heroEquipment/scaleArmour-rtl.png');
	width: 16px;
	height: 15px
}

#combatSimulator i.breastPlate {
	background-image: url('../../img_rtl/scenes/CombatSimulator/heroEquipment/breastPlate-rtl.png');
	width: 16px;
	height: 15px
}

#combatSimulator i.segmentedArmour {
	background-image: url('../../img_rtl/scenes/CombatSimulator/heroEquipment/segmentedArmour-rtl.png');
	width: 16px;
	height: 15px
}

#combatSimulator i.armourOfHealth {
	background-image: url('../../img_rtl/scenes/CombatSimulator/heroEquipment/armourOfHealth-rtl.png');
	width: 16px;
	height: 15px
}

#combatSimulator i.bandage {
	background-image: url('../../img_rtl/scenes/CombatSimulator/heroEquipment/bandage-rtl.png');
	width: 16px;
	height: 16px
}

#combatSimulator i.smallBandage {
	background-image: url('../../img_rtl/scenes/CombatSimulator/heroEquipment/smallBandage-rtl.png');
	width: 16px;
	height: 16px
}

.rtl #combatSimulator svg.icon {
	transform: scale(-1, 1)
}

#combatSimulator .description {
	margin-top: 0;
	text-align: center
}

#combatSimulator .switchRoleWrapper {
	text-align: left;
	margin-bottom: 10px
}

#combatSimulator .switchRoleWrapper .switch {
	color: #f2f2f2
}

#combatSimulator .switchRoleWrapper .switch.defender {
	padding: 4px 20px;
	border: 1px solid #213745;
	background-image: linear-gradient(to bottom, #75a1bd, #4f84a6);
	box-shadow: inset 2px 0 1px -1px #477794, inset -2px 0 1px -1px #477794, inset 0 3px 1px -1px #d6e3eb, inset 0 -3px 1px -1px rgba(48, 80, 100, 0.6);
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5)
}

#combatSimulator .switchRoleWrapper .switch.defender:hover:not(.disabled):not(:disabled) {
	background-color: #86adc5;
	border-color: #3d6680;
	box-shadow: inset 2px 0 1px -1px #477794, inset -2px 0 1px -1px #477794, inset 0 3px 1px -1px #d6e3eb, inset 0 -3px 1px -1px rgba(48, 80, 100, 0.6), inset 0 20px 25px -10px rgba(255, 255, 255, 0.7)
}

#combatSimulator .switchRoleWrapper .switch.defender:active:not(.disabled):not(:disabled) {
	background-image: linear-gradient(to top, #86adc5, #4f84a6);
	box-shadow: inset 2px 0 1px -1px #477794, inset -2px 0 1px -1px #477794;
	color: #294556
}

#combatSimulator .switchRoleWrapper .switch.attacker {
	padding: 4px 20px;
	border: 1px solid #4a1c1d;
	background-image: linear-gradient(to bottom, #c66c6e, #b14446);
	box-shadow: inset 2px 0 1px -1px #9e3d3f, inset -2px 0 1px -1px #9e3d3f, inset 0 3px 1px -1px #eed3d3, inset 0 -3px 1px -1px rgba(107, 41, 43, 0.6);
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5)
}

#combatSimulator .switchRoleWrapper .switch.attacker:hover:not(.disabled):not(:disabled) {
	background-color: #cd7e80;
	border-color: #883536;
	box-shadow: inset 2px 0 1px -1px #9e3d3f, inset -2px 0 1px -1px #9e3d3f, inset 0 3px 1px -1px #eed3d3, inset 0 -3px 1px -1px rgba(107, 41, 43, 0.6), inset 0 20px 25px -10px rgba(255, 255, 255, 0.7)
}

#combatSimulator .switchRoleWrapper .switch.attacker:active:not(.disabled):not(:disabled) {
	background-image: linear-gradient(to top, #cd7e80, #b14446);
	box-shadow: inset 2px 0 1px -1px #9e3d3f, inset -2px 0 1px -1px #9e3d3f;
	color: #5c2425
}

#combatSimulator #simulatePin {
	position: relative;
	margin-top: 100px;
	text-align: center
}

#combatSimulator #simulatePin .simulateWrapper {
	position: fixed;
	z-index: 5;
	bottom: 0;
	padding: 10px 0;
	width: 564px;
	margin-right: -6px;
	border-top: 2px solid #9b9999;
	border-bottom: 2px solid #9b9999;
	background-image: linear-gradient(to top, #e7e7e7, white)
}

@media screen and (max-width:620px) {
	.mobileOptimized #combatSimulator #simulatePin .simulateWrapper {
		bottom: 130px
	}
}

#combatSimulator #simulatePin .simulateWrapper.pinned {
	position: absolute;
	bottom: 0
}

#combatSimulator #simulatePin .simulate {
	display: inline-block;
	min-width: 40%;
	font-size: 1.5rem;
	text-transform: uppercase;
	pointer-events: auto;
	padding: 8px 20px;
	text-align: center;
	height: auto;
	line-height: 24px
}

#combatSimulator .bonus {
	padding: 0 5px;
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: 1fr auto;
	grid-template-columns: 1fr auto;
	-ms-grid-rows: 39px;
	grid-template-rows: 39px;
	align-items: center
}

#combatSimulator .bonus.hidden {
	visibility: hidden
}

#combatSimulator .bonus .buildings {
	-ms-grid-row: 1;
	grid-row-start: 1;
	-ms-grid-column: 1;
	grid-column-start: 1;
	-ms-grid-column-align: start;
	justify-self: start;
	-ms-grid-row-align: center;
	align-self: center
}

#combatSimulator .bonus .buildings label {
	margin-left: 10px
}

#combatSimulator .bonus .artefacts {
	-ms-grid-row: 1;
	grid-row-start: 1;
	-ms-grid-column: 2;
	grid-column-start: 2;
	-ms-grid-column-align: end;
	justify-self: end;
	-ms-grid-row-align: center;
	align-self: center;
	position: relative;
	z-index: 3
}

#combatSimulator .bonus .artefacts label {
	margin-right: 10px
}

#combatSimulator .bonus i {
	margin-left: 5px
}

#combatSimulator .bonus input {
	width: 20px;
	font-size: 12px
}

.ie #combatSimulator .bonus input {
	width: 24px
}

#combatSimulator .bonus select {
	width: 60px
}

#combatSimulator .attacker .bonus .buildings {
	-ms-grid-column-align: end;
	justify-self: end
}

#combatSimulator .heroAttributes {
	border-top: 1px solid #e8e4dc;
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: 1fr auto;
	grid-template-columns: 1fr auto;
	-ms-grid-rows: 33px;
	grid-template-rows: 33px;
	align-items: center;
	padding: 8px 5px
}

#combatSimulator .heroAttributes.hidden * {
	visibility: hidden
}

#combatSimulator .heroAttributes label {
	padding-right: 10px;
	line-height: 100%
}

#combatSimulator .heroAttributes input {
	vertical-align: middle
}

#combatSimulator .heroAttributes input[type=text] {
	width: 33px
}

#combatSimulator .heroAttributes .calculated {
	vertical-align: middle;
	margin-right: 5px
}

#combatSimulator .heroAttributes .stats,
#combatSimulator .heroAttributes .equipment {
	-ms-grid-row: 1;
	grid-row-start: 1
}

#combatSimulator .heroAttributes .stats>span,
#combatSimulator .heroAttributes .equipment>span {
	vertical-align: middle
}

#combatSimulator .heroAttributes .stats {
	-ms-grid-column: 1;
	grid-column-start: 1;
	-ms-grid-column-align: start;
	justify-self: start
}

#combatSimulator .heroAttributes .stats i {
	margin-left: 3px;
	vertical-align: middle
}

#combatSimulator .heroAttributes .equipment {
	-ms-grid-column: 2;
	grid-column-start: 2;
	-ms-grid-column-align: end;
	justify-self: end
}

#combatSimulator .heroAttributes .equipment .title {
	margin-left: 5px
}

#combatSimulator .heroAttributes .equipment .slot {
	padding: 3px;
	cursor: pointer;
	width: 22px;
	height: 22px;
	text-align: center
}

#combatSimulator .heroAttributes .equipment .slot i {
	vertical-align: middle
}

#combatSimulator .heroAttributes .equipment .slot:hover {
	box-shadow: 0 0 1px 1px #b09674;
	background-color: rgba(223, 196, 149, 0.2);
	border-radius: 5px
}

#combatSimulator .heroAttributes .equipment .equipContainer {
	display: inline-block;
	position: relative
}

#combatSimulator .heroAttributes .equipment .equipContainer .overlay {
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
	z-index: 6
}

#combatSimulator .heroAttributes .equipment .equipContainer>span {
	cursor: pointer
}

#combatSimulator .heroAttributes .equipment .equipContainer .dropdown.opened {
	position: absolute;
	top: 25px;
	left: 0;
	z-index: 37;
	padding: 10px 0;
	background-color: #fcf2da;
	border: 1px solid #ddc6a2;
	white-space: nowrap
}

#combatSimulator .heroAttributes .equipment .equipContainer .dropdown.opened.dropUp {
	top: auto;
	bottom: 25px
}

#combatSimulator .heroAttributes .equipment .equipContainer .dropdown.closed {
	display: none
}

#combatSimulator .heroAttributes .equipment .equipContainer .dropdown .group {
	color: #61332b;
	line-height: 1.4em
}

#combatSimulator .heroAttributes .equipment .equipContainer .dropdown .group~.group {
	margin-top: 10px
}

#combatSimulator .heroAttributes .equipment .equipContainer .dropdown .group .title {
	text-transform: uppercase;
	font-weight: bold;
	line-height: 1.9em;
	padding: 0 10px 0 15px
}

#combatSimulator .heroAttributes .equipment .equipContainer .dropdown .group .title i {
	margin-left: 5px;
	vertical-align: text-bottom
}

#combatSimulator .heroAttributes .equipment .equipContainer .dropdown .group .entry {
	padding: 2px 20px
}

#combatSimulator .heroAttributes .equipment .equipContainer .dropdown .group .entry input {
	vertical-align: text-bottom;
	margin-top: 2px;
	margin-left: 5px
}

#combatSimulator .heroAttributes .equipment .equipContainer .dropdown .group .entry .checkmark {
	width: 1em;
	height: 1em;
	margin-left: 3px;
	vertical-align: text-top;
	fill: transparent;
	stroke: #61332b;
	stroke-width: 4;
	stroke-dasharray: 40;
	stroke-dashoffset: 40;
	transition: stroke-dashoffset .3s ease-out
}

.rtl #combatSimulator .heroAttributes .equipment .equipContainer .dropdown .group .entry .checkmark {
	transform: none
}

#combatSimulator .heroAttributes .equipment .equipContainer .dropdown .group .entry.selected {
	background-color: #b09674
}

#combatSimulator .heroAttributes .equipment .equipContainer .dropdown .group .entry.selected .checkmark {
	stroke-dashoffset: 0;
	transition: stroke-dashoffset .2s ease-in
}

#combatSimulator .heroAttributes .equipment .equipContainer .dropdown .group .entry.selected:not(:hover) {
	color: white
}

#combatSimulator .heroAttributes .equipment .equipContainer .dropdown .group .entry.selected:not(:hover) .checkmark {
	stroke: white
}

#combatSimulator .heroAttributes .equipment .equipContainer .dropdown .group .entry:not(.owned):not(:hover):not(.selected) {
	color: rgba(97, 51, 43, 0.4)
}

#combatSimulator .heroAttributes .equipment .equipContainer .dropdown .group .entry:hover {
	background-color: #f2e5c6;
	cursor: pointer
}

#combatSimulator .heroAttributes .equipment .equipContainer .dropdown.bag .entry i {
	margin-left: 5px;
	vertical-align: text-bottom
}

#combatSimulator .movement {
	position: absolute;
	right: 10px;
	top: 10px;
	z-index: 2
}

#combatSimulator .movement label {
	margin-left: 15px
}

#combatSimulator .movement label input {
	margin-left: 5px
}

#combatSimulator .role {
	position: relative;
	border: 1px solid #ddc6a2
}

#combatSimulator .role label i {
	vertical-align: text-top
}

#combatSimulator .role .header {
	position: relative;
	z-index: 2;
	padding: 0 5px;
	display: -ms-grid;
	display: grid;
	align-items: center;
	justify-content: space-between
}

#combatSimulator .role .header h2,
#combatSimulator .role .header h3 {
	color: #f2f2f2
}

#combatSimulator .role .header h2 {
	font-size: 1.5em;
	-ms-grid-row: 1;
	grid-row-start: 1;
	-ms-grid-column: 2;
	grid-column-start: 2;
	-ms-grid-row-align: center;
	align-self: center
}

#combatSimulator .role .header .iconButton.clear {
	-ms-grid-column-align: end;
	justify-self: end;
	-ms-grid-row: 1;
	grid-row-start: 1;
	-ms-grid-row-align: center;
	align-self: center
}

#combatSimulator .role .header .iconButton.clear svg {
	width: 18px;
	height: 18px;
	margin: 3px
}

#combatSimulator .role:not(.reinforcement) h2 {
	text-transform: uppercase
}

#combatSimulator .role .content {
	position: relative;
	background-color: #fff9eb;
	padding: 0 5px
}

#combatSimulator .role.attacker,
#combatSimulator .role.defender {
	padding: 0 5px 5px;
	background-color: #fcf2da
}

#combatSimulator .role.attacker .header,
#combatSimulator .role.defender .header {
	-ms-grid-rows: 36px;
	grid-template-rows: 36px;
	-ms-grid-columns: 60px 1fr 80px 60px;
	grid-template-columns: 60px 1fr 80px 60px;
	margin: -1px -6px 5px
}

#combatSimulator .role.attacker .header .roleIcon,
#combatSimulator .role.defender .header .roleIcon {
	-ms-grid-row: 1;
	grid-row-start: 1;
	-ms-grid-column: 1;
	grid-column-start: 1;
	-ms-grid-row-align: center;
	align-self: center
}

#combatSimulator .role.attacker .header .roleIcon.svgAttack,
#combatSimulator .role.defender .header .roleIcon.svgAttack {
	width: 45px;
	height: 51px
}

#combatSimulator .role.attacker .header .roleIcon.svgDefend,
#combatSimulator .role.defender .header .roleIcon.svgDefend {
	width: 43px;
	height: 48px
}

#combatSimulator .role.attacker .header .villageSelection,
#combatSimulator .role.defender .header .villageSelection {
	-ms-grid-row: 1;
	grid-row-start: 1;
	-ms-grid-column: 3;
	grid-column-start: 3;
	-ms-grid-row-align: center;
	align-self: center;
	margin-right: 20px
}

#combatSimulator .role.attacker .header .villageSelection>*,
#combatSimulator .role.defender .header .villageSelection>* {
	display: inline-block;
	vertical-align: middle
}

#combatSimulator .role.attacker .header .villageSelection select,
#combatSimulator .role.defender .header .villageSelection select {
	margin-left: 10px;
	max-width: 200px
}

#combatSimulator .role.attacker .header .villageSelection select .empty.hidden,
#combatSimulator .role.defender .header .villageSelection select .empty.hidden {
	display: none
}

#combatSimulator .role.attacker .header .villageSelection .reload svg,
#combatSimulator .role.defender .header .villageSelection .reload svg {
	width: 17px;
	height: 17px;
	margin: 3px
}

#combatSimulator .role.attacker .header .rolePopulation,
#combatSimulator .role.defender .header .rolePopulation {
	-ms-grid-row: 1;
	grid-row-start: 1;
	-ms-grid-column: 3;
	grid-column-start: 3;
	-ms-grid-row-align: center;
	align-self: center;
	display: inline-block
}

#combatSimulator .role.attacker .header .rolePopulation>*,
#combatSimulator .role.defender .header .rolePopulation>* {
	display: inline-block;
	vertical-align: middle
}

#combatSimulator .role.attacker .header .rolePopulation i,
#combatSimulator .role.defender .header .rolePopulation i {
	margin-left: 5px
}

#combatSimulator .role.attacker .header .rolePopulation input,
#combatSimulator .role.defender .header .rolePopulation input {
	width: 45px;
	font-size: 12px
}

#combatSimulator .role.attacker .header .iconButton.clear,
#combatSimulator .role.defender .header .iconButton.clear {
	-ms-grid-column: 4;
	grid-column-start: 4
}

#combatSimulator .role.attacker .header.you,
#combatSimulator .role.defender .header.you {
	-ms-grid-columns: 65px auto 1fr 80px 60px;
	grid-template-columns: 65px auto 1fr 80px 60px
}

#combatSimulator .role.attacker .header.you .rolePopulation,
#combatSimulator .role.defender .header.you .rolePopulation {
	-ms-grid-column: 4;
	grid-column-start: 4
}

#combatSimulator .role.attacker .header.you .iconButton.clear,
#combatSimulator .role.defender .header.you .iconButton.clear {
	-ms-grid-column: 5;
	grid-column-start: 5
}

#combatSimulator .role.attacker .header.you~.content .troopIcons i.unit,
#combatSimulator .role.defender .header.you~.content .troopIcons i.unit {
	cursor: pointer
}

#combatSimulator .role.attacker .content,
#combatSimulator .role.defender .content {
	border: 1px solid #dfc495;
	box-shadow: 0 0 10px 2px #dfc495
}

#combatSimulator .role.attacker .header {
	background-color: #a33f41
}

#combatSimulator .role.defender .header,
#combatSimulator .role.reinforcement .header {
	background-color: #8cb1c8
}

#combatSimulator .role.reinforcement {
	margin: -1px 5px 0
}

#combatSimulator .role.reinforcement .header {
	-ms-grid-rows: 28px;
	grid-template-rows: 28px;
	-ms-grid-columns: 45px auto 30px 1fr;
	grid-template-columns: 45px auto 30px 1fr;
	margin: -1px 0 0
}

#combatSimulator .role.reinforcement .header .iconButton.delete {
	-ms-grid-row: 1;
	grid-row-start: 1;
	-ms-grid-column: 3;
	grid-column-start: 3;
	margin-right: 20px
}

#combatSimulator .role.reinforcement .header .iconButton.delete svg {
	width: 16px;
	height: 16px;
	margin: 4px
}

#combatSimulator .role.reinforcement .header .iconButton.clear {
	-ms-grid-column: 4;
	grid-column-start: 4
}

#combatSimulator .tribeSelection {
	position: relative;
	z-index: 1;
	top: 1px
}

#combatSimulator .tribeSelection .tribeWrapper {
	width: 100%;
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	justify-content: space-around;
	align-items: flex-end
}

#combatSimulator .tribeSelection .tribeWrapper div {
	position: relative;
	text-align: center;
	display: inline-block
}

#combatSimulator .tribeSelection .tribeWrapper div:hover {
	cursor: pointer
}

#combatSimulator .tribeSelection.attack .tribeWrapper,
#combatSimulator .tribeSelection.defense .tribeWrapper {
	height: 63px
}

#combatSimulator .tribeSelection.attack .tribeWrapper svg,
#combatSimulator .tribeSelection.defense .tribeWrapper svg {
	display: none
}

#combatSimulator .tribeSelection.attack .tribeWrapper div,
#combatSimulator .tribeSelection.defense .tribeWrapper div {
	width: 77px;
	padding: 0 10px
}

#combatSimulator .tribeSelection.attack .tribeWrapper div:before,
#combatSimulator .tribeSelection.defense .tribeWrapper div:before {
	content: "";
	position: absolute;
	top: auto;
	left: 0;
	bottom: 0;
	right: 0;
	height: 0;
	background-image: linear-gradient(to top, rgba(223, 196, 149, 0.8), rgba(223, 196, 149, 0));
	transition: all .3s ease-out
}

#combatSimulator .tribeSelection.attack .tribeWrapper div i,
#combatSimulator .tribeSelection.defense .tribeWrapper div i {
	position: relative
}

#combatSimulator .tribeSelection.attack .tribeWrapper div.active,
#combatSimulator .tribeSelection.defense .tribeWrapper div.active {
	cursor: default
}

#combatSimulator .tribeSelection.attack .tribeWrapper div.inactive,
#combatSimulator .tribeSelection.defense .tribeWrapper div.inactive {
	cursor: pointer
}

#combatSimulator .tribeSelection.attack .tribeWrapper div.inactive:hover:before,
#combatSimulator .tribeSelection.defense .tribeWrapper div.inactive:hover:before {
	height: 63px
}

#combatSimulator .tribeSelection.reinforcement {
	position: relative;
	margin: -1px 5px 0;
	border: 1px solid #dfc495;
	border-top-color: #e8e4dc;
	background-color: #fcf2da
}

.roleReinforcement~#combatSimulator .tribeSelection.reinforcement {
	margin-top: -2px
}

#combatSimulator .tribeSelection.reinforcement .tribeWrapper {
	width: 95%;
	margin: 0 auto
}

#combatSimulator .tribeSelection.reinforcement .tribeWrapper div {
	padding: 0 10px;
	color: #9b9999
}

#combatSimulator .tribeSelection.reinforcement .tribeWrapper div svg {
	position: absolute;
	top: 1px;
	right: 11px;
	opacity: 1;
	width: 35px;
	height: 35px;
	transition: all .1s
}

#combatSimulator .tribeSelection.reinforcement .tribeWrapper div svg circle {
	fill: #c3dff0
}

#combatSimulator .tribeSelection.reinforcement .tribeWrapper div svg line {
	stroke-width: 1;
	stroke: #fff
}

#combatSimulator .tribeSelection.reinforcement .tribeWrapper div:not(:hover) svg {
	opacity: 0
}

#combatSimulator .bonus~.troops,
#combatSimulator .movement~.troops {
	border-top: 1px solid #e8e4dc
}

#combatSimulator .troops {
	width: 100%;
	padding: 5px 0 10px
}

#combatSimulator .troops table th,
#combatSimulator .troops table td {
	padding: 3px 2px
}

#combatSimulator .troops table th {
	text-align: right
}

#combatSimulator .troops table td {
	text-align: center
}

#combatSimulator .troops input {
	vertical-align: middle
}

#combatSimulator .troops input[type=text] {
	width: 100%
}

#combatSimulator .troops input.unit9,
#combatSimulator .troops input.unit10 {
	width: 25px
}

#combatSimulator .troops .hero.hidden {
	visibility: hidden
}

#combatSimulator .troops td.celebration {
	text-align: right
}

#combatSimulator .troops td.celebration i {
	vertical-align: middle;
	margin-left: 3px
}

#combatSimulator .troops .cataLevels {
	position: relative;
	width: 100%;
	height: 0
}

#combatSimulator .troops .cataLevels.hidden {
	visibility: hidden
}

#combatSimulator .troops .cataLevels:before {
	content: "";
	position: absolute;
	top: 0;
	right: calc(50% - 1px);
	width: 1px;
	background-color: #e8e4dc;
	height: 15px
}

#combatSimulator .troops .cataLevels .cata1,
#combatSimulator .troops .cataLevels .cata2 {
	position: absolute;
	top: 4px;
	background-color: #fff9eb
}

#combatSimulator .troops .cataLevels .cata1 {
	right: -23px
}

#combatSimulator .troops .cataLevels .cata1 input {
	margin-right: 2px
}

#combatSimulator .troops .cataLevels .cata2 {
	left: -23px
}

#combatSimulator .troops .cataLevels .cata2 input {
	margin-left: 2px
}

#combatSimulator .troops .cataLevels i.target {
	width: 14px;
	height: 14px;
	position: relative;
	top: 4px
}

#combatSimulator .troops .cataLevels input {
	width: 23px
}

#combatSimulator .troops .cataLevels input:disabled {
	cursor: not-allowed
}

#combatSimulator .results {
	padding-top: 35px;
	position: relative
}

#combatSimulator .results #applyLosses {
	float: left;
	margin-top: 15px;
	padding-left: 36px
}

#combatSimulator .results #applyLosses svg.svgArrowShort {
	width: 16px;
	height: 12px;
	fill: #544e44;
	display: inline-block;
	position: absolute;
	top: 6px;
	left: 17px
}

#combatSimulator .results .separator {
	position: relative;
	text-align: center;
	margin-bottom: 35px;
	color: #9b9999
}

#combatSimulator .results .separator:before {
	content: "";
	position: absolute;
	right: 0;
	top: 7px;
	border-bottom: 1px solid #9b9999
}

#combatSimulator .results .separator.long:before {
	left: 0
}

#combatSimulator .results .separator.short:before {
	left: 35px
}

#combatSimulator .results .separator .title {
	position: relative;
	display: inline-block;
	background-color: #fff;
	padding: 0 5px;
	font-size: 1.2rem
}

#combatSimulator .results .separator .iconButton {
	position: absolute;
	left: 0;
	top: -6px
}

#combatSimulator .results .separator .iconButton svg {
	width: 15px;
	height: 15px;
	fill: #fff;
	margin: 5px
}

#combatSimulator .results .separator .iconButton svg.collapse {
	transform: scaleX(-1)
}

.rtl #combatSimulator .results .separator .iconButton svg.collapse {
	transform: scaleX(1)
}

#combatSimulator .results .separator .iconButton:after {
	content: "";
	position: absolute;
	right: -6px;
	width: 5px;
	height: 100%;
	background-color: #fff
}

#combatSimulator .results .result {
	background-color: #fff9eb;
	border: 1px solid #dfc495
}

#combatSimulator .results .result .header {
	position: relative;
	z-index: 3;
	display: -ms-grid;
	display: grid;
	align-items: center;
	justify-content: space-between
}

#combatSimulator .results .result .header h2 {
	color: #f2f2f2
}

#combatSimulator .results .result .content {
	min-width: 100%;
	position: relative;
	display: inline-block
}

#combatSimulator .results .result .content table {
	width: 100%;
	border-collapse: collapse
}

#combatSimulator .results .result .content table th,
#combatSimulator .results .result .content table td {
	box-sizing: content-box;
	font-size: 14px;
	padding: 5px 3px;
	white-space: nowrap
}

#combatSimulator .results .result .content table th {
	width: 16px
}

#combatSimulator .results .result .content table td {
	text-align: left;
	width: 42px
}

#combatSimulator .results .result .content table td.u9,
#combatSimulator .results .result .content table td.u10 {
	width: 35px
}

#combatSimulator .results .result .content table td.uhero {
	width: auto
}

#combatSimulator .results .result .content table .troopsLoss td,
#combatSimulator .results .result .content table .troopsCaptured td,
#combatSimulator .results .result .content table .troopsWounded td {
	color: #d40000
}

#combatSimulator .results .result .content table .troopsResult {
	background-color: #fcf2da;
	color: #228b22
}

#combatSimulator .results .result .content table .troopsRevived {
	color: #228b22
}

#combatSimulator .results .result .content table .combatReportLine td {
	text-align: right
}

#combatSimulator .results .result .content table .combatReportLine td span {
	white-space: normal;
	display: inline-block;
	max-width: 95%;
	margin-right: 4px
}

#combatSimulator .results .result .content table .combatReportLine i {
	margin-left: 5px
}

#combatSimulator .results .result .content table .combatReportLine i.manual {
	cursor: pointer
}

#combatSimulator .results .result .content table .combatReportLine .negative {
	color: #d40000
}

#combatSimulator .results .result .content table .additionalInfo td {
	text-align: right
}

#combatSimulator .results .result .content table .additionalInfo td i {
	vertical-align: text-bottom;
	margin-left: 5px
}

#combatSimulator .results .result .content table .additionalInfo td span {
	font-weight: bold
}

#combatSimulator .results .result .content table .additionalInfo td span.negative {
	color: #d40000
}

#combatSimulator .results .result .content.extended {
	position: relative;
	min-width: 650px;
	background-color: #fff9eb;
	border: 1px solid #9b9999;
	z-index: 36;
	right: 50%;
	transform: translateX(50%)
}

@media screen and (max-width:620px) {
	.mobileOptimized #combatSimulator .results .result .content.extended {
		right: 0;
		transform: none;
		min-width: 0;
		max-width: 100%;
		overflow: auto;
		border: 0
	}
}

#combatSimulator .results .result .content.extended table td {
	width: 63px
}

#combatSimulator .results .result .content.extended table td.u9,
#combatSimulator .results .result .content.extended table td.u10 {
	width: 45px
}

#combatSimulator .results .result.attack .header,
#combatSimulator .results .result.defense .header {
	-ms-grid-columns: 100px 1fr 165px;
	grid-template-columns: 100px 1fr 165px;
	-ms-grid-rows: 36px;
	grid-template-rows: 36px;
	z-index: 35
}

#combatSimulator .results .result.attack .header .tribeIcon,
#combatSimulator .results .result.defense .header .tribeIcon {
	-ms-grid-row: 1;
	grid-row-start: 1;
	-ms-grid-column: 1;
	grid-column-start: 1;
	position: absolute;
	right: 0;
	bottom: 0
}

#combatSimulator .results .result.attack .header .roleIcon,
#combatSimulator .results .result.defense .header .roleIcon {
	-ms-grid-row: 1;
	grid-row-start: 1;
	-ms-grid-column: 1;
	grid-column-start: 1;
	position: absolute;
	bottom: -4px;
	right: 45px
}

#combatSimulator .results .result.attack .header .roleIcon.svgAttack,
#combatSimulator .results .result.defense .header .roleIcon.svgAttack {
	width: 40px;
	height: 46px
}

#combatSimulator .results .result.attack .header .roleIcon.svgDefend,
#combatSimulator .results .result.defense .header .roleIcon.svgDefend {
	width: 40px;
	height: 45px
}

#combatSimulator .results .result.attack .header h2,
#combatSimulator .results .result.defense .header h2 {
	-ms-grid-row: 1;
	grid-row-start: 1;
	-ms-grid-column: 2;
	grid-column-start: 2;
	-ms-grid-row-align: center;
	align-self: center;
	text-transform: uppercase
}

#combatSimulator .results .result.attack .header .outcome,
#combatSimulator .results .result.defense .header .outcome {
	-ms-grid-row: 1;
	grid-row-start: 1;
	-ms-grid-column: 3;
	grid-column-start: 3;
	-ms-grid-row-align: center;
	align-self: center
}

#combatSimulator .results .result.attack .header .outcome .arrowWrapper,
#combatSimulator .results .result.defense .header .outcome .arrowWrapper {
	position: relative;
	width: 39px;
	height: 36px;
	overflow: hidden
}

#combatSimulator .results .result.attack .header .outcome .arrowWrapper .outcomeArrow,
#combatSimulator .results .result.defense .header .outcome .arrowWrapper .outcomeArrow {
	width: 40px;
	height: 38px;
	position: relative;
	top: -1px;
	right: -2px;
	stroke: rgba(0, 0, 0, 0.2);
	stroke-width: .75
}

.rtl #combatSimulator .results .result.attack .header .outcome .arrowWrapper .outcomeArrow,
.rtl #combatSimulator .results .result.defense .header .outcome .arrowWrapper .outcomeArrow {
	transform: scale(-1, 1)
}

#combatSimulator .results .result.attack .header .outcome .outcomeIcons,
#combatSimulator .results .result.defense .header .outcome .outcomeIcons {
	position: absolute;
	left: 10px;
	bottom: -6px
}

#combatSimulator .results .result.attack .header .outcome .outcomeIcons svg,
#combatSimulator .results .result.defense .header .outcome .outcomeIcons svg {
	position: absolute;
	bottom: 0
}

#combatSimulator .results .result.attack .header .outcome .outcomeIcons .svgAttack,
#combatSimulator .results .result.attack .header .outcome .outcomeIcons .svgAttackLost,
#combatSimulator .results .result.defense .header .outcome .outcomeIcons .svgAttack,
#combatSimulator .results .result.defense .header .outcome .outcomeIcons .svgAttackLost {
	left: 0;
	width: 50px;
	height: 60px
}

#combatSimulator .results .result.attack .header .outcome .outcomeIcons .svgDefend,
#combatSimulator .results .result.attack .header .outcome .outcomeIcons .svgDefendLost,
#combatSimulator .results .result.defense .header .outcome .outcomeIcons .svgDefend,
#combatSimulator .results .result.defense .header .outcome .outcomeIcons .svgDefendLost {
	left: 0;
	width: 48px;
	height: 60px
}

#combatSimulator .results .result.attack .header .outcome .outcomeIcons .svgSkull,
#combatSimulator .results .result.defense .header .outcome .outcomeIcons .svgSkull {
	left: -7px;
	width: 28px;
	height: 35px
}

#combatSimulator .results .result.attack .content,
#combatSimulator .results .result.defense .content {
	padding: 5px 10px
}

#combatSimulator .results .result.attack .header {
	background-color: #a33f41
}

#combatSimulator .results .result.attack .header .outcome {
	background-color: #7e3132
}

#combatSimulator .results .result.attack .header .outcome svg {
	fill: #a33f41
}

#combatSimulator .results .result.defense {
	margin-top: 25px
}

#combatSimulator .results .result.defense .header,
#combatSimulator .results .result.reinforcement .header {
	background-color: #8cb1c8
}

#combatSimulator .results .result.defense .header .outcome,
#combatSimulator .results .result.reinforcement .header .outcome {
	background-color: #6a9ab8
}

#combatSimulator .results .result.defense .header .outcome svg,
#combatSimulator .results .result.reinforcement .header .outcome svg {
	fill: #8cb1c8
}

#combatSimulator .results .result.reinforcement {
	width: calc(100% - 10px);
	margin: -1px 5px 0
}

#combatSimulator .results .result.reinforcement .header {
	-ms-grid-columns: 70px 1fr;
	grid-template-columns: 70px 1fr;
	-ms-grid-rows: 26px;
	grid-template-rows: 26px
}

#combatSimulator .results .result.reinforcement .header i.tribeIcon {
	position: absolute;
	bottom: -5px;
	right: 5px
}

#combatSimulator .results .result.reinforcement .header .extendView {
	position: absolute;
	left: -25px;
	top: 8px
}

#combatSimulator .results .result.reinforcement .content {
	padding: 5px
}

#combatSimulator .results .result.reinforcement .content.tribe4 .content td.uhero,
#combatSimulator .results .result.reinforcement .content.tribe5 .content td.uhero {
	visibility: hidden
}

#combatSimulator .results .combatStatistics {
	margin-top: 25px;
	border: 1px solid #ddc6a2
}

#combatSimulator .results .combatStatistics .header {
	height: 36px;
	line-height: 36px;
	background-color: #778243;
	border-bottom: 1px solid #ddc6a2
}

#combatSimulator .results .combatStatistics .header h2 {
	color: #f2f2f2;
	text-transform: uppercase;
	font-size: 1.5em;
	margin: 0 10px
}

#combatSimulator .results .combatStatistics table {
	border-collapse: collapse;
	background-color: #fff9eb
}

#combatSimulator .results .combatStatistics table th,
#combatSimulator .results .combatStatistics table td {
	line-height: 24px;
	padding: 2px 5px
}

#combatSimulator .results .combatStatistics table th:nth-child(2),
#combatSimulator .results .combatStatistics table td:nth-child(2) {
	border-left: 1px solid #ddc6a2;
	border-right: 1px solid #ddc6a2
}

#combatSimulator .results .combatStatistics table th {
	text-align: right
}

#combatSimulator .results .combatStatistics table thead th {
	font-weight: bold;
	background-color: #fcf2da
}

#combatSimulator .results .combatStatistics table tbody tr:nth-child(even) th,
#combatSimulator .results .combatStatistics table tbody tr:nth-child(even) td {
	background-color: #fcf2da
}

#combatSimulator .results .combatStatistics table tbody td {
	width: 30%
}

#reactDialogWrapper {
	width: 100%;
	height: 100%;
	position: absolute;
	z-index: 500;
	pointer-events: none
}

#reactDialogWrapper .reactDialog {
	width: 100%;
	height: 100%;
	position: fixed;
	background-color: rgba(0, 0, 0, 0.7);
	visibility: hidden;
	opacity: 0;
	transition-duration: 500ms;
	text-align: center;
	overflow: auto;
	pointer-events: auto
}

#reactDialogWrapper .reactDialog.visible {
	opacity: 1;
	visibility: visible
}

#reactDialogWrapper .reactDialog:before {
	content: "";
	display: inline-block;
	height: 100%;
	vertical-align: middle
}

#reactDialogWrapper .reactDialog .dialogBody {
	display: inline-block;
	vertical-align: middle;
	text-align: right;
	width: auto;
	min-width: 600px;
	max-width: 95%;
	background-color: #e8e4dc;
	box-shadow: 0 0 50px rgba(0, 0, 0, 0.8);
	border-radius: 3px;
	position: relative;
	transition-duration: 500ms;
	transform: scale(0.5);
	opacity: 0;
	margin: 2.5% auto;
	padding: 20px
}

#reactDialogWrapper .reactDialog .dialogBody .loading {
	width: 16px;
	height: 16px;
	background-image: url('../../img_rtl/map/loading.gif');
	margin: 0 auto
}

#reactDialogWrapper .reactDialog.visible .dialogBody {
	transform: scale(1);
	opacity: 1
}

#statisticsV2 i.gameworld_large {
	background-image: url('../../img_rtl/scenes/Statistics/general/gameworld_large.png');
	width: 64px;
	height: 64px
}

#statisticsV2 i.alliance_medium {
	background-image: url('../../img_rtl/scenes/Statistics/general/alliance_medium.png');
	width: 20px;
	height: 24px
}

#statisticsV2 i.alliance_large {
	background-image: url('../../img_rtl/scenes/Statistics/general/alliance_large.png');
	width: 52px;
	height: 64px
}

#statisticsV2 table td {
	text-align: right
}

#statisticsV2 h4 {
	padding: 0 46px 0 0;
	background-color: #c4e18a;
	border: solid 1px #587c1e;
	height: 30px;
	line-height: 28px;
	margin-bottom: 30px;
	position: relative
}

#statisticsV2 h4 i {
	position: absolute;
	top: -15px;
	right: -15px
}

#statisticsV2 .openedClosedSwitch {
	width: 17px;
	height: 17px;
	position: absolute;
	z-index: 1;
	padding: 0;
	left: 8px;
	margin-top: 6px
}

#statisticsV2 .chartWithLegend {
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: 43% 57%;
	grid-template-columns: 43% 57%
}

#statisticsV2 .chartWithLegend .legendContainer {
	margin-bottom: 30px;
	-ms-grid-column: 1;
	grid-column-start: 1
}

#statisticsV2 .chartWithLegend .legendContainer .legendTabs {
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: auto auto;
	grid-template-columns: auto auto;
	width: 98%
}

#statisticsV2 .chartWithLegend .legendContainer .legendTabs .tab {
	-ms-grid-row: 1;
	grid-row-start: 1;
	-ms-grid-column: 1;
	grid-column-start: 1;
	position: relative;
	top: 1px;
	z-index: 2;
	border: 1px solid #d8d7d8;
	border-bottom: 0;
	border-radius: 4px 4px 0 0;
	padding: 10px;
	color: #333;
	font-weight: normal
}

#statisticsV2 .chartWithLegend .legendContainer .legendTabs .tab:last-of-type {
	margin-right: 5px;
	-ms-grid-column: 2;
	grid-column-start: 2
}

#statisticsV2 .chartWithLegend .legendContainer .legendTabs .tab.active {
	background-color: #fbfafb;
	z-index: 3
}

#statisticsV2 .chartWithLegend .legendContainer .legendTabs .tab:not(.active) {
	background-color: #d2d2d1;
	z-index: 1;
	cursor: pointer;
	transition-duration: 250ms
}

#statisticsV2 .chartWithLegend .legendContainer .legendTabs .tab:not(.active):hover {
	background-color: #e7e7e7
}

#statisticsV2 .chartWithLegend .legendContainer .legendTabs .tab:not(.active):active {
	background-color: #f2f2f2
}

#statisticsV2 .chartWithLegend .legendContainer .legendTabs .tab i {
	vertical-align: bottom
}

#statisticsV2 .chartWithLegend .legendContainer .simpleLegend {
	position: relative;
	z-index: 2;
	width: 98%;
	min-height: 190px;
	background-color: #fbfafb;
	border: solid 1px #d8d7d8;
	border-radius: 4px;
	padding: 10px 5px
}

#statisticsV2 .chartWithLegend .legendContainer .simpleLegend table thead th {
	text-align: right;
	padding-right: 10px
}

#statisticsV2 .chartWithLegend .legendContainer .legendTabs~.simpleLegend {
	border-radius: 0 0 4px 4px
}

#statisticsV2 .chartWithLegend.chartIncluded {
	-ms-grid-columns: 100%;
	grid-template-columns: 100%
}

#statisticsV2 .chartWithLegend.chartIncluded .legendTabs {
	display: flex
}

#statisticsV2 .chartWithLegend.chartIncluded .legendTabs .tab {
	display: inline-block;
	flex-grow: 0;
	flex-basis: 23%
}

#statisticsV2 .chartWithLegend .chartContainer {
	-ms-grid-column: 2;
	grid-column-start: 2
}

#statisticsV2 .chartWithLegend .chartContainer .chartTitle {
	position: absolute;
	width: 100%;
	text-align: center;
	padding-top: 6px
}

#statisticsV2 .chartWithLegend .chartContainer div {
	position: relative
}

#statisticsV2 .chartWithLegend .chartContainer p {
	margin: 5px 0
}

#statisticsV2 .recharts-wrapper svg {
	overflow: visible
}

.ie #statisticsV2 .recharts-wrapper svg {
	overflow: hidden
}

#statisticsV2 .recharts-wrapper .recharts-tooltip-wrapper {
	z-index: 205 !important
}

#statisticsV2 .recharts-wrapper .recharts-tooltip-wrapper .recharts-default-tooltip {
	background-color: rgba(0, 0, 0, 0.8) !important;
	border: none !important;
	border-radius: 4px;
	padding: 4px 9px 4px 9px !important
}

#statisticsV2 .recharts-wrapper .recharts-tooltip-wrapper .recharts-default-tooltip li {
	color: #ddd !important;
	padding: 0 !important;
	font-size: 12px
}

#statisticsV2 .recharts-wrapper .recharts-tooltip-wrapper .recharts-default-tooltip .recharts-tooltip-item-name,
#statisticsV2 .recharts-wrapper .recharts-tooltip-wrapper .recharts-default-tooltip .recharts-tooltip-item-separator {
	display: none
}

.rtl #statisticsV2 .recharts-wrapper .recharts-tooltip-wrapper {
	right: 300px
}

.rtl #statisticsV2 .raidChart .recharts-wrapper .recharts-tooltip-wrapper,
.rtl #statisticsV2 .tradeChart .recharts-wrapper .recharts-tooltip-wrapper {
	right: 200px
}

#statisticsV2 #serverProgression {
	margin-bottom: 30px
}

#statisticsV2 #serverProgression h4 {
	margin: 0;
	z-index: 2
}

#statisticsV2 #serverProgression h4 i.serverProgression {
	background-image: url('../../img_rtl/scenes/Statistics/serverProgression/serverProgressionTitle_large.png');
	width: 54px;
	height: 54px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine {
	margin-bottom: 100px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine {
	position: relative;
	background-image: url('../../img_rtl/scenes/Statistics/serverProgression/timeline/timelineBackground.png');
	width: 554px;
	height: 136px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .serverNumbers {
	position: absolute;
	top: 5px;
	left: 5px;
	text-align: right
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .serverNumbers .counter {
	position: relative;
	text-align: center;
	display: inline-block
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .serverNumbers .counter i {
	position: absolute
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .serverNumbers .counter.activatedPlayers {
	min-width: 30px;
	margin-left: 10px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .serverNumbers .counter.activatedPlayers i {
	right: calc(50% - (30px / 2))
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .serverNumbers .counter.serverTime {
	min-width: 53px;
	margin-left: 15px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .serverNumbers .counter.serverTime i {
	right: calc(50% - (53px / 2));
	background-image: url('../../img_rtl/scenes/Statistics/serverProgression/timeline/serverAge_large.png');
	width: 53px;
	height: 54px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .serverNumbers .counter span {
	position: relative;
	z-index: 2;
	line-height: 64px;
	font-weight: bold;
	font-size: 25px;
	color: #f2f2f2;
	text-shadow: 1px 0 3px #000, 1px 1px 3px #000, 0 1px 3px #000, -1px 1px 3px #000, -1px 0 3px #000, -1px -1px 3px #000, 0 -1px 3px #000, 1px -1px 3px #000
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine {
	position: absolute;
	bottom: -65px;
	left: -1px;
	right: -1px;
	display: -ms-grid;
	display: grid
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine:before,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine:after {
	content: "";
	background-size: auto 14px;
	height: 16px;
	position: absolute;
	top: 44px;
	right: 2px;
	left: 2px;
	background-repeat: repeat-x;
	border: 1px solid #333
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine:before {
	z-index: 1;
	background-image: url('../../img_rtl/scenes/Statistics/serverProgression/timeline/timelineBarLocked.png')
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine:after {
	z-index: 2;
	background-image: url('../../img_rtl/scenes/Statistics/serverProgression/timeline/timelineBarUnlocked.png')
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine.itemCount3 {
	-ms-grid-columns: 64px 1fr 64px 1fr 64px;
	grid-template-columns: 64px 1fr 64px 1fr 64px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine.itemCount3.unlocked1:after {
	display: none
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine.itemCount3.unlocked2:after {
	left: 50%
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine.itemCount6 {
	-ms-grid-columns: 64px 1fr 64px 1fr 64px 1fr 64px 1fr 64px 1fr 64px;
	grid-template-columns: 64px 1fr 64px 1fr 64px 1fr 64px 1fr 64px 1fr 64px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine.itemCount6.unlocked1:after {
	display: none
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine.itemCount6.unlocked2:after {
	left: 80%
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine.itemCount6.unlocked3:after {
	left: 60%
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine.itemCount6.unlocked4:after {
	left: 40%
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine.itemCount6.unlocked5:after {
	left: 20%
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step {
	position: relative;
	z-index: 3;
	text-align: center;
	display: -ms-inline-grid;
	display: inline-grid;
	-ms-grid-columns: 64px;
	grid-template-columns: 64px;
	-ms-grid-rows: 95px 20px;
	grid-template-rows: 95px 20px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step:nth-of-type(1) {
	-ms-grid-column: 1;
	grid-column-start: 1
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step:nth-of-type(2) {
	-ms-grid-column: 3;
	grid-column-start: 3
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step:nth-of-type(3) {
	-ms-grid-column: 5;
	grid-column-start: 5
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step:nth-of-type(4) {
	-ms-grid-column: 7;
	grid-column-start: 7
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step:nth-of-type(5) {
	-ms-grid-column: 9;
	grid-column-start: 9
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step:nth-of-type(6) {
	-ms-grid-column: 11;
	grid-column-start: 11
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step i {
	-ms-grid-row: 1;
	grid-row-start: 1;
	position: relative
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step .description {
	-ms-grid-row: 2;
	grid-row-start: 2;
	width: 80px;
	-ms-grid-row-align: self-end;
	align-self: self-end;
	-ms-grid-column-align: center;
	justify-self: center
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step .description .description,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step .description #militaryStrengthRank .villageList .name,
#statisticsV2 #militaryStrengthRank .villageList #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step .description .name {
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	direction: rtl
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step i.secondVillage,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step i.fourthVillage {
	right: -2px;
	top: 19px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step i.secondVillage .tribe1,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step i.secondVillage .tribe6,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step i.fourthVillage .tribe1,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step i.fourthVillage .tribe6 {
	right: 0
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step i.artifacts {
	top: 19px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step i.constructionPlans {
	top: 19px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step i.firstWWLevelOne {
	top: 18px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step i.firstWWLevelOne.tribe1 {
	top: -1px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step i.firstWWLevelOne.tribe2 {
	top: 12px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step i.firstWWLevelOne.tribe3 {
	top: 8px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step i.firstWWLevelOne.tribe6,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step i.firstWWLevelOne.tribe7 {
	top: 10px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step i.serverEnd {
	right: -2px;
	top: 19px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step:not(.achieved) i.start,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step:not(.unlocked) i.start {
	background-image: url('../../img_rtl/scenes/Statistics/serverProgression/timeline/serverStartLocked_large.png');
	width: 87px;
	height: 95px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step:not(.achieved) i.secondVillage,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step:not(.achieved) i.fourthVillage,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step:not(.unlocked) i.secondVillage,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step:not(.unlocked) i.fourthVillage {
	background-image: url('../../img_rtl/scenes/Statistics/serverProgression/timeline/secondVillageLocked_large.png');
	width: 69px;
	height: 64px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step:not(.achieved) i.artifacts,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step:not(.unlocked) i.artifacts {
	background-image: url('../../img_rtl/scenes/Statistics/serverProgression/timeline/artifactsLocked_large.png');
	width: 64px;
	height: 64px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step:not(.achieved) i.constructionPlans,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step:not(.unlocked) i.constructionPlans {
	background-image: url('../../img_rtl/scenes/Statistics/serverProgression/timeline/constructionPlansLocked_large.png');
	width: 64px;
	height: 64px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step:not(.achieved) i.firstWWLevelOne,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step:not(.unlocked) i.firstWWLevelOne {
	background-image: url('../../img_rtl/scenes/Statistics/serverProgression/timeline/firstWWLocked_large.png');
	width: 64px;
	height: 65px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step:not(.achieved) i.serverEnd,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step:not(.unlocked) i.serverEnd {
	background-image: url('../../img_rtl/scenes/Statistics/serverProgression/timeline/serverEndLocked_large.png');
	width: 78px;
	height: 64px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.achieved i.start,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.unlocked i.start {
	background-image: url('../../img_rtl/scenes/Statistics/serverProgression/timeline/serverStart_large.png');
	width: 87px;
	height: 95px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.achieved i.secondVillage,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.achieved i.fourthVillage,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.unlocked i.secondVillage,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.unlocked i.fourthVillage {
	background-image: url('../../img_rtl/scenes/Statistics/serverProgression/timeline/secondVillage_large.png');
	width: 69px;
	height: 64px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.achieved i.secondVillage.tribe1,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.achieved i.fourthVillage.tribe1,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.unlocked i.secondVillage.tribe1,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.unlocked i.fourthVillage.tribe1 {
	background-image: url('../../img_rtl/scenes/Statistics/serverProgression/timeline/secondVillage_tribe1_large.png');
	width: 64px;
	height: 64px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.achieved i.secondVillage.tribe2,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.achieved i.fourthVillage.tribe2,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.unlocked i.secondVillage.tribe2,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.unlocked i.fourthVillage.tribe2 {
	background-image: url('../../img_rtl/scenes/Statistics/serverProgression/timeline/secondVillage_tribe2_large.png');
	width: 67px;
	height: 64px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.achieved i.secondVillage.tribe3,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.achieved i.fourthVillage.tribe3,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.unlocked i.secondVillage.tribe3,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.unlocked i.fourthVillage.tribe3 {
	background-image: url('../../img_rtl/scenes/Statistics/serverProgression/timeline/secondVillage_tribe3_large.png');
	width: 68px;
	height: 64px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.achieved i.secondVillage.tribe6,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.achieved i.fourthVillage.tribe6,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.unlocked i.secondVillage.tribe6,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.unlocked i.fourthVillage.tribe6 {
	background-image: url('../../img_rtl/scenes/Statistics/serverProgression/timeline/secondVillage_tribe6_large.png');
	width: 65px;
	height: 64px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.achieved i.secondVillage.tribe7,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.achieved i.fourthVillage.tribe7,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.unlocked i.secondVillage.tribe7,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.unlocked i.fourthVillage.tribe7 {
	background-image: url('../../img_rtl/scenes/Statistics/serverProgression/timeline/secondVillage_tribe7_large.png');
	width: 68px;
	height: 64px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.achieved i.artifacts,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.unlocked i.artifacts {
	background-image: url('../../img_rtl/scenes/Statistics/serverProgression/timeline/artifacts_large.png');
	width: 64px;
	height: 64px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.achieved i.artifacts.tribe1,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.unlocked i.artifacts.tribe1 {
	background-image: url('../../img_rtl/scenes/Statistics/serverProgression/timeline/artifacts_tribe1_large.png');
	width: 64px;
	height: 64px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.achieved i.artifacts.tribe2,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.unlocked i.artifacts.tribe2 {
	background-image: url('../../img_rtl/scenes/Statistics/serverProgression/timeline/artifacts_tribe2_large.png');
	width: 64px;
	height: 64px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.achieved i.artifacts.tribe3,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.unlocked i.artifacts.tribe3 {
	background-image: url('../../img_rtl/scenes/Statistics/serverProgression/timeline/artifacts_tribe3_large.png');
	width: 64px;
	height: 64px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.achieved i.artifacts.tribe6,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.unlocked i.artifacts.tribe6 {
	background-image: url('../../img_rtl/scenes/Statistics/serverProgression/timeline/artifacts_tribe6_large.png');
	width: 64px;
	height: 64px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.achieved i.artifacts.tribe7,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.unlocked i.artifacts.tribe7 {
	background-image: url('../../img_rtl/scenes/Statistics/serverProgression/timeline/artifacts_tribe7_large.png');
	width: 64px;
	height: 64px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.achieved i.constructionPlans,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.unlocked i.constructionPlans {
	background-image: url('../../img_rtl/scenes/Statistics/serverProgression/timeline/constructionPlans_large.png');
	width: 64px;
	height: 64px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.achieved i.firstWWLevelOne,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.unlocked i.firstWWLevelOne {
	background-image: url('../../img_rtl/scenes/Statistics/serverProgression/timeline/firstWW_large.png');
	width: 64px;
	height: 65px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.achieved i.firstWWLevelOne.tribe1,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.unlocked i.firstWWLevelOne.tribe1 {
	background-image: url('../../img_rtl/scenes/Statistics/serverProgression/timeline/firstWW_tribe1_large.png');
	width: 64px;
	height: 84px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.achieved i.firstWWLevelOne.tribe2,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.unlocked i.firstWWLevelOne.tribe2 {
	background-image: url('../../img_rtl/scenes/Statistics/serverProgression/timeline/firstWW_tribe2_large.png');
	width: 64px;
	height: 71px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.achieved i.firstWWLevelOne.tribe3,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.unlocked i.firstWWLevelOne.tribe3 {
	background-image: url('../../img_rtl/scenes/Statistics/serverProgression/timeline/firstWW_tribe3_large.png');
	width: 64px;
	height: 75px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.achieved i.firstWWLevelOne.tribe6,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.unlocked i.firstWWLevelOne.tribe6 {
	background-image: url('../../img_rtl/scenes/Statistics/serverProgression/timeline/firstWW_tribe6_large.png');
	width: 64px;
	height: 73px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.achieved i.firstWWLevelOne.tribe7,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.unlocked i.firstWWLevelOne.tribe7 {
	background-image: url('../../img_rtl/scenes/Statistics/serverProgression/timeline/firstWW_tribe7_large.png');
	width: 64px;
	height: 73px
}

#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.achieved i.serverEnd,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step.unlocked i.serverEnd {
	background-image: url('../../img_rtl/scenes/Statistics/serverProgression/timeline/serverEnd_large.png');
	width: 78px;
	height: 64px
}

#statisticsV2 #serverProgression #serverProgressionTribeDistribution .chartContainer {
	margin-top: -40px
}

#statisticsV2 #serverProgression #serverProgressionTribeDistribution i.distribution {
	background-image: url('../../img_rtl/scenes/Statistics/serverProgression/tribeDistribution_medium.png');
	width: 21px;
	height: 22px;
	vertical-align: middle
}

#statisticsV2 #serverProgression #serverProgressionTribeDistribution .simpleLegend table {
	margin: 0 auto;
	width: calc(100% - 5px)
}

#statisticsV2 #serverProgression #serverProgressionTribeDistribution .simpleLegend table thead td {
	padding-bottom: 15px;
	padding-right: 0
}

#statisticsV2 #serverProgression #serverProgressionTribeDistribution .simpleLegend table tbody tr td {
	padding: 0
}

#statisticsV2 #serverProgression #serverProgressionTribeDistribution .simpleLegend table tbody tr td:first-of-type img {
	float: none
}

#statisticsV2 #serverProgression #serverProgressionTribeDistribution .simpleLegend table tbody tr td:last-of-type {
	text-align: left;
	vertical-align: bottom
}

#statisticsV2 #serverProgression #serverProgressionTribeDistribution .simpleLegend table tbody tr td:last-of-type span {
	display: inline-block;
	position: relative;
	padding-left: 15px
}

#statisticsV2 #serverProgression #serverProgressionTribeDistribution .simpleLegend table tbody tr td:last-of-type span:after {
	content: "";
	display: inline-block;
	width: 10px;
	height: 10px;
	left: 0;
	bottom: calc(50% - 5px);
	position: absolute
}

#statisticsV2 #serverProgression #serverProgressionTribeDistribution .simpleLegend table tbody tr td:last-of-type span.v1:after {
	background-color: #96323d
}

#statisticsV2 #serverProgression #serverProgressionTribeDistribution .simpleLegend table tbody tr td:last-of-type span.v2:after {
	background-color: #428291
}

#statisticsV2 #serverProgression #serverProgressionTribeDistribution .simpleLegend table tbody tr td:last-of-type span.v3:after {
	background-color: #de7e1b
}

#statisticsV2 #serverProgression #serverProgressionTribeDistribution .simpleLegend table tbody tr td:last-of-type span.v6:after {
	background-color: #3e559a
}

#statisticsV2 #serverProgression #serverProgressionTribeDistribution .simpleLegend table tbody tr td:last-of-type span.v7:after {
	background-color: #674876
}

#statisticsV2 #populationRank {
	margin-bottom: 30px;
	position: relative
}

#statisticsV2 #populationRank h4 i.populationRank {
	background-image: url('../../img_rtl/scenes/Statistics/populationRank/populationRankTitle_large.png');
	width: 54px;
	height: 54px
}

#statisticsV2 #populationRank .ServerAllianceRank {
	margin-top: 24px
}

#statisticsV2 #populationRank .recharts-wrapper {
	margin-top: -4px
}

.ltr #statisticsV2 #populationRank .recharts-wrapper {
	margin-right: -28px
}

.rtl #statisticsV2 #populationRank .recharts-wrapper {
	margin-right: 10px
}

#statisticsV2 .ServerAllianceRank {
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: 50% 50%;
	grid-template-columns: 50% 50%;
	height: 100px
}

#statisticsV2 .ServerAllianceRank .typeWrapper {
	position: relative;
	self-align: end
}

#statisticsV2 .ServerAllianceRank .typeWrapper:first-of-type {
	-ms-grid-column: 1;
	grid-column-start: 1
}

#statisticsV2 .ServerAllianceRank .typeWrapper:last-of-type {
	-ms-grid-column: 2;
	grid-column-start: 2
}

#statisticsV2 .ServerAllianceRank .buttonWrapper {
	text-align: center;
	position: relative;
	z-index: 1
}

#statisticsV2 .ServerAllianceRank .buttonWrapper>div {
	margin-bottom: 10px;
	height: 2em
}

#statisticsV2 .ServerAllianceRank .rankDisplay {
	width: 100%;
	height: 64px;
	line-height: 64px;
	text-align: center;
	font-weight: bold;
	font-size: 25px;
	position: absolute;
	bottom: 0;
	z-index: 2;
	color: #f2f2f2;
	text-shadow: 1px 0 3px #000, 1px 1px 3px #000, 0 1px 3px #000, -1px 1px 3px #000, -1px 0 3px #000, -1px -1px 3px #000, 0 -1px 3px #000, 1px -1px 3px #000
}

#statisticsV2 .ServerAllianceRank .disabled {
	opacity: .5
}

#statisticsV2 .ServerAllianceRank i {
	position: relative;
	z-index: 2
}

#statisticsV2 #militaryStrengthRank {
	position: relative
}

#statisticsV2 #militaryStrengthRank h4 i.militaryStrengthRank {
	background-image: url('../../img_rtl/scenes/Statistics/militaryStrengthRank/militaryStrengthRankTitle_large.png');
	width: 54px;
	height: 54px
}

#statisticsV2 #militaryStrengthRank .ServerAllianceRank {
	border-bottom: 1px solid #d8d7d8;
	padding-bottom: 20px;
	margin-bottom: 30px;
	margin-top: 14px;
	height: calc(100px + 20px)
}

#statisticsV2 #militaryStrengthRank .villageList td {
	padding: 1px 3px;
	line-height: 26px
}

#statisticsV2 #militaryStrengthRank .villageList .rank {
	width: 1%
}

#statisticsV2 #militaryStrengthRank .villageList .name {
	max-width: 1px
}

#statisticsV2 #militaryStrengthRank .villageList .name #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step .description,
#statisticsV2 #serverProgression #serverProgressionTimeLine #timeLine .timeLine .step #militaryStrengthRank .villageList .name .description,
#statisticsV2 #militaryStrengthRank .villageList .name .name {
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	direction: rtl
}

#statisticsV2 #militaryStrengthRank .villageList .strength {
	text-align: left;
	width: 1%
}

#statisticsV2 #militaryStrengthRank .chartWithLegend .chartContainer .strengthRankChart .worse,
#statisticsV2 #militaryStrengthRank .chartWithLegend .chartContainer .strengthRankChart .better {
	width: 75px;
	min-height: 100%;
	position: absolute;
	padding-top: 115px;
	z-index: 202
}

#statisticsV2 #militaryStrengthRank .chartWithLegend .chartContainer .strengthRankChart .worse.better,
#statisticsV2 #militaryStrengthRank .chartWithLegend .chartContainer .strengthRankChart .better.better {
	right: 5px
}

#statisticsV2 #militaryStrengthRank .chartWithLegend .chartContainer .strengthRankChart .worse.worse,
#statisticsV2 #militaryStrengthRank .chartWithLegend .chartContainer .strengthRankChart .better.worse {
	left: 0
}

#statisticsV2 #militaryStrengthRank .chartWithLegend .chartContainer .chartDetails {
	top: -20px;
	border-radius: 4px;
	padding: 0 10px;
	text-align: center
}

#statisticsV2 #militaryStrengthRank .chartWithLegend .chartContainer .chartDetails div:not(.inlineIcon) {
	margin: 10px 0
}

#statisticsV2 #militaryStrengthRank .chartWithLegend .chartContainer .chartDetails .strength {
	font-size: 2em
}

#statisticsV2 #militaryStrengthRank .chartWithLegend .chartContainer .chartDetails .strength i {
	margin-left: 5px;
	vertical-align: middle
}

#statisticsV2 #militaryStrengthRank .chartWithLegend .chartContainer .chartDetails .strength i+span {
	line-height: 24px;
	vertical-align: middle
}

#statisticsV2 #militaryStrengthRank .chartWithLegend .chartContainer .chartDetails .name {
	font-weight: bold
}

#statisticsV2 #militaryStrengthRank .chartWithLegend .chartContainer .chartDetails .rankDisplay {
	position: absolute;
	top: -158px;
	right: calc(50% - 26px);
	background-image: url('../../img_rtl/scenes/Statistics/general/rank_large.png');
	width: 55px;
	height: 47px;
	line-height: 47px;
	text-align: center;
	vertical-align: middle;
	font-weight: bold;
	font-size: 15px;
	z-index: 201
}

#statisticsV2 #resourceRank {
	position: relative
}

#statisticsV2 #resourceRank h4 i.resourceRank {
	background-image: url('../../img_rtl/scenes/Statistics/resourceRank/resourceRankTitle_large.png');
	width: 54px;
	height: 54px
}

#statisticsV2 #resourceRank .resourceBarChartContainer {
	margin-right: 3px;
	margin-bottom: 30px
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChart {
	width: 41.5%;
	float: right
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChart .balance {
	height: 99px;
	width: 30.5%;
	line-height: 33px;
	padding-right: 7px;
	padding-left: 4px;
	float: left
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChart .balance div {
	height: 33px;
	font-size: 135%;
	text-align: right;
	opacity: 0;
	transition-duration: 250ms;
	white-space: nowrap;
	overflow: visible
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChart .balance div.positive {
	color: #eda932;
	transition-delay: 1000ms;
	padding-right: 5px
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChart .balance div.positive.total {
	color: #afe375
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChart .balance div.negative {
	color: #c35742;
	transition-delay: 2000ms;
	padding-right: 5px
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChart .balance div.negative>span {
	display: inline-block;
	position: absolute;
	margin-right: -10px
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChart .balance div.negative.total {
	color: red
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChart .balance div.total {
	position: relative;
	transition-delay: 2500ms
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChart .positive .raid {
	background-color: #eda932
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChart .positive .trade {
	background-color: #f4c97e
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChart .positive .production {
	background-color: #fbebd0
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChart .negative {
	margin-top: 5px
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChart .negative .raid {
	background-color: #c35742
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChart .negative .trade {
	background-color: #d48879
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChart .barContainer {
	width: 67%;
	float: right
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChart .barContainer .positive,
#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChart .barContainer .negative {
	transform: scaleX(0) translateZ(0);
	transform-origin: right;
	transition-duration: 1000ms;
	transition-timing-function: ease-out
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChart .barContainer .positive span,
#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChart .barContainer .negative span {
	display: inline-block;
	float: right;
	height: 33px
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChart .barContainer .positive.negative,
#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChart .barContainer .negative.negative {
	transform-origin: left;
	transition-delay: 1000ms
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChart .barContainer .positive.negative span.raid,
#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChart .barContainer .negative.negative span.raid {
	float: left;
	position: relative
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChart .barContainer .positive.negative span.raid:before,
#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChart .barContainer .negative.negative span.raid:before {
	display: block;
	content: "";
	height: 71px;
	width: 0;
	border-right: solid 2px #333;
	position: absolute;
	bottom: 0;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	-moz-backface-visibility: hidden
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChart .barContainer .positive.negative span.trade,
#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChart .barContainer .negative.negative span.trade {
	float: left
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChart.animated .balance div {
	opacity: 1
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChart.animated .barContainer .positive,
#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChart.animated .barContainer .negative {
	transform: scaleX(1) translateZ(0)
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChartLegend {
	width: 56.5%;
	margin-right: 2%;
	float: right;
	padding-right: 25px;
	border-collapse: collapse
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChartLegend td {
	font-size: 12px;
	text-align: left;
	line-height: 12px;
	padding: 0;
	white-space: nowrap
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChartLegend td.value {
	width: 1%;
	padding-right: 5px
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChartLegend td.indicators {
	width: 30px
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChartLegend td.indicators span.resourceIndicator {
	display: inline-block;
	width: 8px;
	height: 8px;
	position: relative;
	top: -1px
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChartLegend td.indicators svg.checkmark {
	display: inline-block;
	margin-right: 3px;
	width: 1em;
	height: 1em;
	fill: transparent;
	stroke-width: 4px;
	stroke-dasharray: 40;
	stroke-dashoffset: 0;
	transition: stroke-dashoffset .3s ease-out
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChartLegend td.indicators svg.checkmark.invisible {
	stroke-dashoffset: 40px
}

.rtl #statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChartLegend td.indicators svg.checkmark {
	transform: none
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChartLegend tr.positive.raid span.resourceIndicator {
	background-color: #eda932
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChartLegend tr.positive.raid svg.checkmark {
	stroke: #eda932
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChartLegend tr.positive.trade span.resourceIndicator {
	background-color: #f4c97e
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChartLegend tr.positive.trade svg.checkmark {
	stroke: #f4c97e
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChartLegend tr.positive.production span.resourceIndicator {
	background-color: #fbebd0
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChartLegend tr.positive.production svg.checkmark {
	stroke: #fbebd0
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChartLegend tr.negative.raid td {
	padding-top: 10px
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChartLegend tr.negative.raid td span.resourceIndicator {
	background-color: #c35742
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChartLegend tr.negative.raid td svg.checkmark {
	stroke: #c35742
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChartLegend tr.negative.trade span.resourceIndicator {
	background-color: #d48879
}

#statisticsV2 #resourceRank .resourceBarChartContainer .resourceBarChartLegend tr.negative.trade svg.checkmark {
	stroke: #d48879
}

#statisticsV2 #resourceRank .chartWithLegend {
	margin-bottom: 20px
}

#statisticsV2 #resourceRank .chartWithLegend .legendContainer {
	margin-top: 15px
}

#statisticsV2 #resourceRank .chartWithLegend .legendContainer .simpleLegend .ServerAllianceRank {
	margin-top: 24px
}

#statisticsV2 #resourceRank .chartWithLegend .chartContainer {
	position: relative
}

#statisticsV2 #resourceRank .chartWithLegend .chartContainer .dataSwitchButtons {
	width: auto;
	position: absolute;
	z-index: 2;
	left: 0
}

#statisticsV2 #resourceRank .chartWithLegend .chartContainer .dataSwitchButtons .iconButton {
	margin-right: 5px;
	padding: 4px
}

#statisticsV2 #resourceRank .chartWithLegend .chartContainer .chartTitle~.recharts-wrapper {
	top: 30px;
	margin-bottom: 30px
}

#statisticsV2 #resourceRank .chartWithLegend .chartContainer .raidChart,
#statisticsV2 #resourceRank .chartWithLegend .chartContainer .tradeChart {
	z-index: 1
}

#statisticsV2 #resourceRank .chartWithLegend .chartContainer .raidChart .lost,
#statisticsV2 #resourceRank .chartWithLegend .chartContainer .raidChart .won,
#statisticsV2 #resourceRank .chartWithLegend .chartContainer .tradeChart .lost,
#statisticsV2 #resourceRank .chartWithLegend .chartContainer .tradeChart .won {
	width: 75px;
	min-height: 100%;
	position: absolute;
	padding-top: 143px;
	z-index: 202
}

#statisticsV2 #resourceRank .chartWithLegend .chartContainer .raidChart .lost p,
#statisticsV2 #resourceRank .chartWithLegend .chartContainer .raidChart .won p,
#statisticsV2 #resourceRank .chartWithLegend .chartContainer .tradeChart .lost p,
#statisticsV2 #resourceRank .chartWithLegend .chartContainer .tradeChart .won p {
	position: relative;
	z-index: 202;
	margin: 3px 0
}

#statisticsV2 #resourceRank .chartWithLegend .chartContainer .raidChart .lost .svgArrow,
#statisticsV2 #resourceRank .chartWithLegend .chartContainer .raidChart .won .svgArrow,
#statisticsV2 #resourceRank .chartWithLegend .chartContainer .tradeChart .lost .svgArrow,
#statisticsV2 #resourceRank .chartWithLegend .chartContainer .tradeChart .won .svgArrow {
	width: 22px;
	height: 22px;
	display: inline-block;
	vertical-align: middle;
	position: relative;
	z-index: -1;
	top: -3px
}

#statisticsV2 #resourceRank .chartWithLegend .chartContainer .raidChart .lost .svgArrow+span,
#statisticsV2 #resourceRank .chartWithLegend .chartContainer .raidChart .won .svgArrow+span,
#statisticsV2 #resourceRank .chartWithLegend .chartContainer .tradeChart .lost .svgArrow+span,
#statisticsV2 #resourceRank .chartWithLegend .chartContainer .tradeChart .won .svgArrow+span {
	display: inline-block;
	vertical-align: middle
}

#statisticsV2 #resourceRank .chartWithLegend .chartContainer .raidChart .lost i.bounty,
#statisticsV2 #resourceRank .chartWithLegend .chartContainer .raidChart .lost i.trade,
#statisticsV2 #resourceRank .chartWithLegend .chartContainer .raidChart .won i.bounty,
#statisticsV2 #resourceRank .chartWithLegend .chartContainer .raidChart .won i.trade,
#statisticsV2 #resourceRank .chartWithLegend .chartContainer .tradeChart .lost i.bounty,
#statisticsV2 #resourceRank .chartWithLegend .chartContainer .tradeChart .lost i.trade,
#statisticsV2 #resourceRank .chartWithLegend .chartContainer .tradeChart .won i.bounty,
#statisticsV2 #resourceRank .chartWithLegend .chartContainer .tradeChart .won i.trade {
	width: 16px;
	height: 16px;
	vertical-align: middle
}

#statisticsV2 #resourceRank .chartWithLegend .chartContainer .raidChart .lost.lost,
#statisticsV2 #resourceRank .chartWithLegend .chartContainer .raidChart .won.lost,
#statisticsV2 #resourceRank .chartWithLegend .chartContainer .tradeChart .lost.lost,
#statisticsV2 #resourceRank .chartWithLegend .chartContainer .tradeChart .won.lost {
	right: 5px
}

#statisticsV2 #resourceRank .chartWithLegend .chartContainer .raidChart .lost.won,
#statisticsV2 #resourceRank .chartWithLegend .chartContainer .raidChart .won.won,
#statisticsV2 #resourceRank .chartWithLegend .chartContainer .tradeChart .lost.won,
#statisticsV2 #resourceRank .chartWithLegend .chartContainer .tradeChart .won.won {
	left: 0
}

#statisticsV2 #resourceRank .chartWithLegend .chartContainer .raidChart.raidChart .lost .svgArrow,
#statisticsV2 #resourceRank .chartWithLegend .chartContainer .tradeChart.raidChart .lost .svgArrow {
	fill: #c35742
}

#statisticsV2 #resourceRank .chartWithLegend .chartContainer .raidChart.raidChart .lost .svgArrow.disabled,
#statisticsV2 #resourceRank .chartWithLegend .chartContainer .tradeChart.raidChart .lost .svgArrow.disabled {
	fill: #f2f2f2
}

#statisticsV2 #resourceRank .chartWithLegend .chartContainer .raidChart.raidChart .won .svgArrow,
#statisticsV2 #resourceRank .chartWithLegend .chartContainer .tradeChart.raidChart .won .svgArrow {
	fill: #eda932;
	transform: rotate(180deg)
}

#statisticsV2 #resourceRank .chartWithLegend .chartContainer .raidChart.raidChart .won .svgArrow.disabled,
#statisticsV2 #resourceRank .chartWithLegend .chartContainer .tradeChart.raidChart .won .svgArrow.disabled {
	fill: #f2f2f2
}

#statisticsV2 #resourceRank .chartWithLegend .chartContainer .raidChart.tradeChart .lost .svgArrow,
#statisticsV2 #resourceRank .chartWithLegend .chartContainer .tradeChart.tradeChart .lost .svgArrow {
	fill: #d48879
}

#statisticsV2 #resourceRank .chartWithLegend .chartContainer .raidChart.tradeChart .lost .svgArrow.disabled,
#statisticsV2 #resourceRank .chartWithLegend .chartContainer .tradeChart.tradeChart .lost .svgArrow.disabled {
	fill: #f2f2f2
}

#statisticsV2 #resourceRank .chartWithLegend .chartContainer .raidChart.tradeChart .won .svgArrow,
#statisticsV2 #resourceRank .chartWithLegend .chartContainer .tradeChart.tradeChart .won .svgArrow {
	fill: #f4c97e;
	transform: rotate(180deg)
}

#statisticsV2 #resourceRank .chartWithLegend .chartContainer .raidChart.tradeChart .won .svgArrow.disabled,
#statisticsV2 #resourceRank .chartWithLegend .chartContainer .tradeChart.tradeChart .won .svgArrow.disabled {
	fill: #f2f2f2
}

.rtl #statisticsV2 #resourceRank .chartWithLegend .chartContainer .raidChart .lost.lost {
	right: 0
}

#statisticsV2 #culturePointsRank {
	position: relative
}

#statisticsV2 #culturePointsRank i.helmet_medium {
	background-image: url('../../img_rtl/scenes/Statistics/culturePointsRank/helmet_medium.png');
	width: 22px;
	height: 24px
}

#statisticsV2 #culturePointsRank i.reward_medium {
	background-image: url('../../img_rtl/scenes/Statistics/culturePointsRank/reward_medium.png');
	width: 26px;
	height: 22px
}

#statisticsV2 #culturePointsRank h4 i.culturePointsRank {
	background-image: url('../../img_rtl/scenes/Statistics/culturePointsRank/culturePointsRankTitle_large.png');
	width: 54px;
	height: 54px
}

#statisticsV2 #culturePointsRank .ServerAllianceRank {
	margin-bottom: 30px;
	margin-top: 14px
}

#statisticsV2 #culturePointsRank .culturePointsHeader {
	position: relative
}

#statisticsV2 #culturePointsRank .culturePointsHeader .openedClosedSwitch {
	left: 9px
}

#statisticsV2 #culturePointsRank .culturePointsHeader .dataSwitchButtons {
	display: flex;
	position: absolute;
	left: 40px;
	top: 3px;
	margin-top: -1px
}

#statisticsV2 #culturePointsRank .culturePointsHeader .dataSwitchButtons a.iconButton {
	align-content: center;
	padding: 4px
}

#statisticsV2 #culturePointsRank .culturePointsHeader .dataSwitchButtons a.iconButton:not(:last-child) {
	margin: 0 0 0 8px
}

#statisticsV2 #culturePointsRank .culturePointsHeader .dataSwitchButtons a.iconButton i.distribution {
	background-image: url('../../img_rtl/scenes/Statistics/culturePointsRank/distribution_small.png');
	width: 16px;
	height: 16px
}

#statisticsV2 #culturePointsRank .culturePointsHeader .dataSwitchButtons a.iconButton i.progression {
	background-image: url('../../img_rtl/scenes/Statistics/culturePointsRank/progression_small.png');
	width: 16px;
	height: 16px
}

#statisticsV2 #culturePointsRank .cpProduction {
	margin-top: 35px;
	padding-top: 15px;
	border-top: solid 1px #d2d2d1;
	text-align: center
}

#statisticsV2 #culturePointsRank .chartWithLegend .chartContainer .culturePointsRankChart .worse,
#statisticsV2 #culturePointsRank .chartWithLegend .chartContainer .culturePointsRankChart .better {
	width: 75px;
	min-height: 100%;
	position: absolute;
	padding-top: 115px;
	z-index: 202
}

#statisticsV2 #culturePointsRank .chartWithLegend .chartContainer .culturePointsRankChart .worse.better,
#statisticsV2 #culturePointsRank .chartWithLegend .chartContainer .culturePointsRankChart .better.better {
	right: 5px
}

#statisticsV2 #culturePointsRank .chartWithLegend .chartContainer .culturePointsRankChart .worse.worse,
#statisticsV2 #culturePointsRank .chartWithLegend .chartContainer .culturePointsRankChart .better.worse {
	left: 0
}

#statisticsV2 #cpProgressionChart {
	position: relative
}

#statisticsV2 #cpProgressionChart .chartTitle {
	position: absolute;
	left: 32px;
	top: 15px
}

.ltr #statisticsV2 #cpProgressionChart .recharts-wrapper {
	margin-right: -15px;
	margin-top: 15px
}

#statisticsV2 #cpDistributionChart .chartTitle~.recharts-wrapper {
	top: 30px;
	margin-bottom: 30px
}

#statisticsV2 #cpDistributionChart .simpleLegend table tr td:first-of-type {
	text-align: center;
	padding: 4px 5px 4px 4px
}

#statisticsV2 #cpDistributionChart .simpleLegend table tr td:last-of-type {
	text-align: left
}

#statisticsV2 #cpDistributionChart .simpleLegend table tr td:last-of-type span {
	display: inline-block
}

#statisticsV2 #cpDistributionChart .simpleLegend table tr:last-of-type td {
	font-size: 16px
}

#statisticsV2 #cpDistributionChart .simpleLegend table tr:last-of-type td:first-of-type {
	text-align: left
}

#statisticsV2 #cpDistributionChart .simpleLegend table tr:last-of-type td:last-of-type {
	font-weight: bold
}

#statisticsV2 #cpDistributionChart .simpleLegend table span {
	position: relative;
	padding-left: 15px
}

#statisticsV2 #cpDistributionChart .simpleLegend table span:after {
	content: "";
	display: inline-block;
	width: 10px;
	height: 10px;
	left: 0;
	bottom: calc(50% - 5px);
	position: absolute
}

#statisticsV2 #cpDistributionChart .simpleLegend table span.buildings:after {
	background-color: #ffd667
}

#statisticsV2 #cpDistributionChart .simpleLegend table span.celebrations:after {
	background-color: #dd2e45
}

#statisticsV2 #cpDistributionChart .simpleLegend table span.helmet:after {
	background-color: #31a1ed
}

#statisticsV2 #cpDistributionChart .simpleLegend table span.items:after {
	background-color: #31a1ed
}

#statisticsV2 #cpDistributionChart .simpleLegend table span.rewards:after {
	background-color: #a9d18e
}

#statisticsV2 #cpDistributionChart .simpleLegend table span.allianceBonus:after {
	background-color: #8ea3d1
}

#statisticsV2 #cpRankComparison .legendContainer {
	margin-bottom: 0
}

#statisticsV2 #cpRankComparison .chartContainer {
	position: relative
}

#statisticsV2 #cpRankComparison .chartContainer .rankDisplay {
	position: absolute;
	top: calc(50% - 23px);
	right: calc(50% - 26px);
	background-image: url('../../img_rtl/scenes/Statistics/general/rank_large.png');
	width: 55px;
	height: 47px;
	line-height: 47px;
	text-align: center;
	vertical-align: middle;
	font-weight: bold;
	font-size: 15px;
	z-index: 2
}

#center #contentOuterContainer .contentContainer #content.tasks {
	background-color: #f4efe4
}

#tasks {
	color: #5e463a
}

#tasks .divider {
	background-image: url('../../img_rtl/scenes/Tasks/divider.png');
	width: 220px;
	height: 10px;
	width: auto;
	background-position: center
}

#tasks .taskDetailview .taskDescription {
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: 200px 1fr;
	grid-template-columns: 200px 1fr;
	margin-bottom: 20px
}

#tasks .taskDetailview .taskDescription .imageFrame {
	-ms-grid-column: 1;
	grid-column-start: 1;
	-ms-grid-row: 1;
	grid-row-start: 1;
	width: 161px;
	height: 161px;
	margin-right: 10px;
	border-radius: 50%;
	position: relative;
	box-shadow: 0 3px 6px rgba(52, 34, 13, 0.3)
}

#tasks .taskDetailview .taskDescription .imageFrame:before {
	position: absolute;
	top: 7px;
	left: 7px;
	bottom: 7px;
	right: 7px;
	border-radius: 50%
}

#tasks .taskDetailview .taskDescription .imageFrame .taskImage {
	border-radius: 50%;
	position: absolute;
	top: 8px;
	left: 8px;
	bottom: 8px;
	right: 8px;
	width: auto;
	height: auto
}

#tasks .taskDetailview .taskDescription .description {
	-ms-grid-column: 2;
	grid-column-start: 2;
	-ms-grid-row: 1;
	grid-row-start: 1;
	-ms-grid-row-align: center;
	align-self: center
}

#tasks .taskDetailview .taskDescription .description .title {
	font-size: 16px;
	font-weight: bold;
	margin-bottom: 10px
}

#tasks .taskDetailview .buttonWrapper {
	text-align: center;
	margin: 20px 0 10px
}

#tasks .task {
	position: relative;
	z-index: 36;
	margin-bottom: 10px;
	padding: 3px;
	display: -ms-grid;
	display: grid;
	transition: opacity 333.33333ms 2200ms
}

#tasks .task:before {
	background-image: url('../../img_rtl/scenes/Tasks/taskBackground.jpg');
	background-position: center
}

#tasks .task>div {
	position: relative
}

#tasks .task .taskImage {
	-ms-grid-column: 1;
	grid-column-start: 1;
	border-left: 1px solid #afa38d
}

#tasks .task .title {
	font-size: 16px;
	font-weight: bold;
	margin: 0 10px
}

#tasks .task .rewards {
	margin-right: 10px
}

#tasks .task .rewards>div {
	display: inline-block
}

#tasks .task .rewards .reward {
	box-sizing: border-box;
	position: relative;
	display: inline-block;
	height: 23px;
	border: 1px solid #a2947b;
	background-color: #b7ad97;
	border-radius: 8px;
	line-height: 21px;
	padding: 0 34px 0 5px
}

#tasks .task .rewards .reward i {
	position: absolute;
	top: 50%;
	transform-origin: top;
	transform: translateY(-50%)
}

#tasks .task .rewards .reward+.animationObject {
	height: 23px;
	line-height: 21px;
	padding: 0 34px 0 5px;
	margin: -28px 16px;
	pointer-events: none;
	position: absolute
}

#tasks .task .rewards .reward+.animationObject .reward {
	position: absolute;
	z-index: 37;
	right: 0;
	margin: 0;
	border: 1px solid #fff9eb;
	filter: drop-shadow(0 0 5px #000)
}

#tasks .task .rewards .reward.resources {
	margin: 5px 16px 5px 5px
}

#tasks .task .rewards .reward.resources i {
	right: -16px
}

#tasks .task .rewards .reward.resources+.animationObject .reward {
	transform: scale(0)
}

#tasks .task .rewards .reward.resources.animated {
	animation: splitResources 100ms ease-out forwards;
	z-index: 36
}

@keyframes splitResources {
	0% {
		transform: scale(1)
	}

	50%,
	61% {
		transform: scale(0.5);
		opacity: 1
	}

	100% {
		transform: scale(1);
		opacity: 0
	}
}

#tasks .task .rewards .reward.experience {
	margin: 5px 9px 5px 5px;
	opacity: 1;
	transition: opacity 250ms ease-out
}

#tasks .task .rewards .reward.experience i {
	right: -9px
}

#tasks .task .rewards .reward.experience+.animationObject .reward {
	right: -8px;
	opacity: 0;
	transition: opacity 250ms ease-out
}

#tasks .task .rewards .reward.experience.animated {
	opacity: 0
}

#tasks .task .rewards .reward.experience.animated+.animationObject .reward {
	opacity: 1
}

#tasks .task .progress {
	-ms-grid-row-align: center;
	align-self: center
}

#tasks .task .progress button {
	width: 130px;
	transition: width 333.33333ms, margin 333.33333ms
}

#tasks .task .progress button>div {
	transition-duration: 333.33333ms
}

#tasks .task .progress button .collectedCheckmark {
	width: 38px;
	height: 38px;
	position: absolute;
	z-index: 3;
	right: calc(50% - 19px);
	bottom: -2px;
	border-radius: 50%;
	border: solid 1px #34220d;
	opacity: 0;
	transform: scale(0) rotate(180deg);
	pointer-events: none
}

#tasks .task .progress button .collectedCheckmark:before {
	content: "";
	position: absolute;
	right: -2px;
	bottom: 2px;
	z-index: 3;
	background-image: url('../../img_rtl/scenes/Tasks/collected.png');
	width: 45px;
	height: 43px;
	transform: scale(0);
	transform-origin: center bottom
}

#tasks .task .progress button .collectedCheckmark:after {
	content: "";
	position: absolute;
	top: 3px;
	left: 3px;
	bottom: 3px;
	right: 3px;
	background-color: #765a4a;
	border-radius: 50%;
	box-shadow: inset 0 0 1px #34220d
}

#tasks .task .progress button.collected {
	pointer-events: none;
	user-select: none;
	overflow: visible
}

#tasks .task .progress button.collected:after {
	content: attr(data-text-collected);
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	z-index: 2;
	box-sizing: border-box;
	background-color: #b6ac96;
	padding: 11px 10px 8px;
	color: transparent;
	font-weight: bold;
	transform: scaleX(0);
	transform-origin: center;
	animation: collectedAnimation 2000ms ease-out forwards
}

@keyframes collectedAnimation {
	0% {
		transform: scaleX(0);
		color: transparent
	}

	15%,
	75% {
		transform: scaleX(1);
		color: transparent
	}

	80%,
	100% {
		transform: scaleX(1);
		color: #402b13
	}
}

#tasks .task .progress button.collected>div {
	color: transparent;
	padding: 9px 20px 0
}

#tasks .task .progress button.collected .collectedCheckmark {
	animation: checkmarkAnimationContainer 2000ms ease-out forwards
}

@keyframes checkmarkAnimationContainer {
	0% {
		transform: scale(0) rotate(180deg);
		opacity: 0
	}

	10% {
		transform: scale(1) rotate(-30deg);
		opacity: 1
	}

	20% {
		transform: scale(1) rotate(10deg)
	}

	35%,
	55% {
		transform: scale(1) rotate(0);
		opacity: 1
	}

	65% {
		transform: scale(1.3) rotate(0);
		opacity: 1
	}

	80% {
		transform: scale(0) rotate(0);
		opacity: 1
	}
}

#tasks .task .progress button.collected .collectedCheckmark:before {
	animation: checkmarkAnimationIcon 666.66667ms ease-out forwards;
	filter: drop-shadow(2px 2px 3px rgba(0, 0, 0, 0.5))
}

@keyframes checkmarkAnimationIcon {

	0%,
	45% {
		transform: scale(0) translateY(25px);
		filter: drop-shadow(2px 2px 3px rgba(0, 0, 0, 0.5))
	}

	75% {
		transform: scale(1.15);
		filter: drop-shadow(5px 5px 3px rgba(0, 0, 0, 0.5))
	}

	100% {
		transform: scale(1);
		filter: none
	}
}

#tasks .task .progress button.preventAnimation:after {
	animation: none;
	transform: scaleX(1);
	color: #402b13
}

#tasks .task .progress button.preventAnimation .collectedCheckmark,
#tasks .task .progress button.preventAnimation .collectedCheckmark:before {
	animation: none
}

#tasks .task .progress .progressBar {
	display: -ms-grid;
	display: grid;
	-ms-grid-rows: 1fr 1fr 1fr;
	grid-template-rows: 1fr 1fr 1fr;
	height: 73px
}

#tasks .task .progress .progressBar .bar {
	-ms-grid-row: 2;
	grid-row-start: 2;
	position: relative;
	-ms-grid-row-align: center;
	align-self: center;
	box-sizing: border-box;
	width: 130px;
	height: 18px;
	padding: 3px;
	border-radius: 10px
}

#tasks .task .progress .progressBar .bar:before {
	border-radius: 7px
}

#tasks .task .progress .progressBar .bar .decoration {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	z-index: 2
}

#tasks .task .progress .progressBar .bar .decoration:before,
#tasks .task .progress .progressBar .bar .decoration:after {
	content: "";
	position: absolute;
	background-image: url('../../img_rtl/scenes/Tasks/progressBarDecoration.png');
	width: 10px;
	height: 18px;
	top: -1px
}

#tasks .task .progress .progressBar .bar .decoration:before {
	right: 1px
}

#tasks .task .progress .progressBar .bar .decoration:after {
	left: 1px;
	transform: scaleX(-1)
}

#tasks .task .progress .progressBar .bar .filling {
	position: relative;
	background-image: linear-gradient(to top, #5c831e 0, #5d8f0d 45.26%, #7f9f32 72.08%, #a0ae56 100%);
	border: 1px solid #6cb708;
	border-top-color: #f5f8ef;
	height: 8px
}

#tasks .task .progress .progressBar .label {
	-ms-grid-row: 3;
	grid-row-start: 3;
	width: 130px;
	-ms-grid-row-align: start;
	align-self: start;
	padding-top: 3px;
	text-align: center
}

#tasks .task.group {
	height: 73px;
	-ms-grid-columns: 74px 110px 1fr 140px;
	grid-template-columns: 74px 110px 1fr 140px;
	-ms-grid-rows: 1fr;
	grid-template-rows: 1fr;
	cursor: pointer;
	transition: opacity 333.33333ms 2200ms, box-shadow .4s .15s
}

#tasks .task.group>div {
	-ms-grid-row: 1;
	grid-row-start: 1
}

#tasks .task.group .taskImage {
	-ms-grid-row: 1;
	grid-row-start: 1
}

#tasks .task.group .title {
	-ms-grid-column: 2;
	grid-column-start: 2;
	-ms-grid-row-align: center;
	align-self: center;
	position: relative
}

#tasks .task.group .titleDecoration {
	-ms-grid-column: 2;
	grid-column-start: 2;
	position: relative
}

#tasks .task.group .titleDecoration:before,
#tasks .task.group .titleDecoration:after {
	content: "";
	background-color: #f7f1db;
	transition-property: left;
	transition-duration: .4s;
	transition-timing-function: ease-out;
	transition-delay: .15s
}

#tasks .task.group .titleDecoration:before {
	position: absolute;
	top: 0;
	left: 5px;
	bottom: 0;
	right: 0
}

#tasks .task.group .titleDecoration:after {
	width: 52px;
	height: 52px;
	position: absolute;
	left: -47px;
	transform: rotate(-45deg);
	transform-origin: top right
}

#tasks .task.group .rewards {
	-ms-grid-column: 3;
	grid-column-start: 3;
	-ms-grid-row-align: center;
	align-self: center
}

#tasks .task.group .progress {
	-ms-grid-column: 4;
	grid-column-start: 4
}

#tasks .task.group:hover,
#tasks .task.group.collected {
	box-shadow: 0 0 5px 3px #beae9a
}

#tasks .task.group:hover .titleDecoration:before,
#tasks .task.group.collected .titleDecoration:before {
	left: -323px
}

#tasks .task.group:hover .titleDecoration:after,
#tasks .task.group.collected .titleDecoration:after {
	left: -375px
}

#tasks .task.group.populationProgress .progress .label span:first-child,
#tasks .task.group.populationProgressInVillage .progress .label span:first-child,
#tasks .task.group.culturePointsProductionProgress .progress .label span:first-child,
#tasks .task.group.culturePointsProductionProgressInVillage .progress .label span:first-child {
	display: none
}

#tasks .task.level {
	height: 107px;
	-ms-grid-columns: 107px 1fr 140px;
	grid-template-columns: 107px 1fr 140px;
	-ms-grid-rows: 1fr 1fr;
	grid-template-rows: 1fr 1fr
}

#tasks .task.level .taskImage {
	grid-row: 1 / 3;
	-ms-grid-row: 1;
	-ms-grid-row-span: 2
}

#tasks .task.level .title {
	-ms-grid-column: 2;
	grid-column-start: 2;
	-ms-grid-row: 1;
	grid-row-start: 1;
	-ms-grid-row-align: center;
	align-self: center
}

#tasks .task.level .titleDecoration {
	display: none
}

#tasks .task.level .rewards {
	-ms-grid-column: 2;
	grid-column-start: 2;
	-ms-grid-row: 2;
	grid-row-start: 2
}

#tasks .task.level .progress {
	-ms-grid-column: 3;
	grid-column-start: 3;
	grid-row: 1 / 3;
	-ms-grid-row: 1;
	-ms-grid-row-span: 2
}

#tasks .task.open .progress button {
	display: none
}

#tasks .task.achieved .progress .progressBar {
	display: none
}

#tasks .task.collected {
	opacity: .5
}

#tasks .task.collected .progress .progressBar {
	display: none
}

#tasks .taskImage {
	position: relative;
	overflow: hidden
}

#tasks .taskImage:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	z-index: 1;
	background-image: url('../../img_rtl/scenes/Tasks/type/background.jpg');
	background-size: cover
}

#tasks .taskImage img {
	position: absolute;
	z-index: 2
}

#tasks .taskImage.group {
	width: 73px;
	height: 73px
}

#tasks .taskImage.group img.resourceBuildingsLevelOfOneOfTheBuildings {
	background-image: url('../../img_rtl/scenes/Tasks/type/oneEachResource_group.jpg');
	width: 73px;
	height: 73px
}

#tasks .taskImage.group img.resourceBuildingsAllLevels {
	background-image: url('../../img_rtl/scenes/Tasks/type/allResources_group.jpg');
	width: 73px;
	height: 73px
}

#tasks .taskImage.group img.populationProgress,
#tasks .taskImage.group img.populationProgressInVillage {
	background-image: url('../../img_rtl/scenes/Tasks/type/population_group.jpg');
	width: 73px;
	height: 73px
}

#tasks .taskImage.group img.culturePointsProductionProgress,
#tasks .taskImage.group img.culturePointsProductionProgressInVillage {
	background-image: url('../../img_rtl/scenes/Tasks/type/culture_group.jpg');
	width: 73px;
	height: 73px
}

#tasks .taskImage.group img.loyalty {
	background-image: url('../../img_rtl/scenes/Tasks/type/loyalty_group.jpg');
	width: 73px;
	height: 73px
}

#tasks .taskImage.group img.building {
	bottom: -5px;
	right: -20px
}

#tasks .taskImage.group img.building.g1 {
	background-image: url('../../img_rtl/scenes/Tasks/type/g1_group.jpg');
	width: 73px;
	height: 73px;
	bottom: 0;
	right: 0
}

#tasks .taskImage.group img.building.g2 {
	background-image: url('../../img_rtl/scenes/Tasks/type/g2_group.jpg');
	width: 73px;
	height: 73px;
	bottom: 0;
	right: 0
}

#tasks .taskImage.group img.building.g3 {
	background-image: url('../../img_rtl/scenes/Tasks/type/g3_group.jpg');
	width: 73px;
	height: 73px;
	bottom: 0;
	right: 0
}

#tasks .taskImage.group img.building.g4 {
	background-image: url('../../img_rtl/scenes/Tasks/type/g4_group.jpg');
	width: 73px;
	height: 73px;
	bottom: 0;
	right: 0
}

#tasks .taskImage.group img.building.g31 {
	background-image: url('../../img_rtl/scenes/Tasks/type/g31_group.png');
	width: 73px;
	height: 73px;
	bottom: 0;
	right: 0
}

#tasks .taskImage.group img.building.g32 {
	background-image: url('../../img_rtl/scenes/Tasks/type/g32_group.png');
	width: 73px;
	height: 73px;
	bottom: 0;
	right: 0
}

#tasks .taskImage.group img.building.g33 {
	background-image: url('../../img_rtl/scenes/Tasks/type/g33_group.png');
	width: 73px;
	height: 73px;
	bottom: 0;
	right: 0
}

#tasks .taskImage.group img.building.g42 {
	background-image: url('../../img_rtl/scenes/Tasks/type/g42_group.png');
	width: 73px;
	height: 73px;
	bottom: 0;
	right: 0
}

#tasks .taskImage.group img.building.g43 {
	background-image: url('../../img_rtl/scenes/Tasks/type/g43_group.png');
	width: 73px;
	height: 73px;
	bottom: 0;
	right: 0
}

#tasks .taskImage.group img.building.g5 {
	right: -15px
}

#tasks .taskImage.group img.building.g6 {
	right: -26px
}

#tasks .taskImage.group img.building.g8 {
	bottom: -26px;
	right: -25px
}

#tasks .taskImage.group img.building.g9 {
	right: -26px
}

#tasks .taskImage.group img.building.g10 {
	right: -18px
}

#tasks .taskImage.group img.building.g11 {
	bottom: -15px
}

#tasks .taskImage.group img.building.g15 {
	right: -30px
}

#tasks .taskImage.group img.building.g16 {
	bottom: -20px;
	right: -50px
}

#tasks .taskImage.group img.building.g18 {
	right: -32px
}

#tasks .taskImage.group img.building.g19 {
	bottom: 0
}

#tasks .taskImage.group img.building.g20 {
	bottom: -10px;
	right: -25px
}

#tasks .taskImage.group img.building.g21 {
	bottom: 3px
}

#tasks .taskImage.group img.building.g22 {
	right: -26px
}

#tasks .taskImage.group img.building.g23 {
	bottom: 0
}

#tasks .taskImage.group img.building.g24 {
	right: -18px
}

#tasks .taskImage.group img.building.g26 {
	right: -15px;
	bottom: 0
}

#tasks .taskImage.level {
	width: 107px;
	height: 107px
}

#tasks .taskImage.level img.resourceBuildingsLevelOfOneOfTheBuildings {
	background-image: url('../../img_rtl/scenes/Tasks/type/oneEachResource_level.jpg');
	width: 107px;
	height: 107px
}

#tasks .taskImage.level img.resourceBuildingsAllLevels {
	background-image: url('../../img_rtl/scenes/Tasks/type/allResources_level.jpg');
	width: 107px;
	height: 107px
}

#tasks .taskImage.level img.populationProgress,
#tasks .taskImage.level img.populationProgressInVillage {
	background-image: url('../../img_rtl/scenes/Tasks/type/population_level.jpg');
	width: 107px;
	height: 107px
}

#tasks .taskImage.level img.culturePointsProductionProgress,
#tasks .taskImage.level img.culturePointsProductionProgressInVillage {
	background-image: url('../../img_rtl/scenes/Tasks/type/culture_level.jpg');
	width: 107px;
	height: 107px
}

#tasks .taskImage.level img.loyalty {
	background-image: url('../../img_rtl/scenes/Tasks/type/loyalty_level.jpg');
	width: 107px;
	height: 107px
}

#tasks .taskImage.level img.building {
	bottom: -10px;
	right: -25px
}

#tasks .taskImage.level img.building.g1 {
	background-image: url('../../img_rtl/scenes/Tasks/type/g1_level.jpg');
	width: 107px;
	height: 107px;
	bottom: 0;
	right: 0
}

#tasks .taskImage.level img.building.g2 {
	background-image: url('../../img_rtl/scenes/Tasks/type/g2_level.jpg');
	width: 107px;
	height: 107px;
	bottom: 0;
	right: 0
}

#tasks .taskImage.level img.building.g3 {
	background-image: url('../../img_rtl/scenes/Tasks/type/g3_level.jpg');
	width: 107px;
	height: 107px;
	bottom: 0;
	right: 0
}

#tasks .taskImage.level img.building.g4 {
	background-image: url('../../img_rtl/scenes/Tasks/type/g4_level.jpg');
	width: 107px;
	height: 107px;
	bottom: 0;
	right: 0
}

#tasks .taskImage.level img.building.g31 {
	background-image: url('../../img_rtl/scenes/Tasks/type/g31_level.png');
	width: 107px;
	height: 107px;
	bottom: 0;
	right: 0
}

#tasks .taskImage.level img.building.g32 {
	background-image: url('../../img_rtl/scenes/Tasks/type/g32_level.png');
	width: 107px;
	height: 107px;
	bottom: 0;
	right: 0
}

#tasks .taskImage.level img.building.g33 {
	background-image: url('../../img_rtl/scenes/Tasks/type/g33_level.png');
	width: 107px;
	height: 107px;
	bottom: 0;
	right: 0
}

#tasks .taskImage.level img.building.g42 {
	background-image: url('../../img_rtl/scenes/Tasks/type/g42_level.png');
	width: 107px;
	height: 107px;
	bottom: 0;
	right: 0
}

#tasks .taskImage.level img.building.g43 {
	background-image: url('../../img_rtl/scenes/Tasks/type/g43_level.png');
	width: 107px;
	height: 107px;
	bottom: 0;
	right: 0
}

#tasks .taskImage.level img.building.g6 {
	bottom: -11px;
	right: -35px
}

#tasks .taskImage.level img.building.g7 {
	bottom: -6px;
	right: -33px
}

#tasks .taskImage.level img.building.g8 {
	bottom: -38px;
	right: -42px
}

#tasks .taskImage.level img.building.g9 {
	bottom: -9px;
	right: -36px
}

#tasks .taskImage.level img.building.g10 {
	right: -31px
}

#tasks .taskImage.level img.building.g11 {
	bottom: -24px;
	right: -33px
}

#tasks .taskImage.level img.building.g15 {
	bottom: -7px;
	right: -51px
}

#tasks .taskImage.level img.building.g16 {
	bottom: -1px;
	right: -54px
}

#tasks .taskImage.level img.building.g17 {
	bottom: -8px
}

#tasks .taskImage.level img.building.g18 {
	bottom: -11px;
	right: -48px
}

#tasks .taskImage.level img.building.g19 {
	bottom: -4px;
	right: -44px
}

#tasks .taskImage.level img.building.g20 {
	bottom: -15px;
	right: -32px
}

#tasks .taskImage.level img.building.g21 {
	bottom: -2px
}

#tasks .taskImage.level img.building.g22 {
	bottom: -3px;
	right: -38px
}

#tasks .taskImage.level img.building.g23 {
	bottom: 0;
	right: -35px
}

#tasks .taskImage.level img.building.g25 {
	bottom: -7px;
	right: -35px
}

#tasks .taskImage.level img.building.g26 {
	bottom: -1px;
	right: -25px
}

#tasks .taskImage.description img.resourceBuildingsLevelOfOneOfTheBuildings {
	background-image: url('../../img_rtl/scenes/Tasks/type/oneEachResource_description.jpg');
	width: 145px;
	height: 145px
}

#tasks .taskImage.description img.resourceBuildingsAllLevels {
	background-image: url('../../img_rtl/scenes/Tasks/type/allResources_description.jpg');
	width: 145px;
	height: 145px
}

#tasks .taskImage.description img.populationProgress,
#tasks .taskImage.description img.populationProgressInVillage {
	background-image: url('../../img_rtl/scenes/Tasks/type/population_description.jpg');
	width: 145px;
	height: 145px
}

#tasks .taskImage.description img.culturePointsProductionProgress,
#tasks .taskImage.description img.culturePointsProductionProgressInVillage {
	background-image: url('../../img_rtl/scenes/Tasks/type/culture_description.jpg');
	width: 145px;
	height: 145px
}

#tasks .taskImage.description img.loyalty {
	background-image: url('../../img_rtl/scenes/Tasks/type/loyalty_description.jpg');
	width: 145px;
	height: 145px
}

#tasks .taskImage.description img.building {
	bottom: 15px;
	right: -15px
}

#tasks .taskImage.description img.building.g1 {
	background-image: url('../../img_rtl/scenes/Tasks/type/g1_description.jpg');
	width: 145px;
	height: 145px;
	bottom: 0;
	right: 0
}

#tasks .taskImage.description img.building.g2 {
	background-image: url('../../img_rtl/scenes/Tasks/type/g2_description.jpg');
	width: 145px;
	height: 145px;
	bottom: 0;
	right: 0
}

#tasks .taskImage.description img.building.g3 {
	background-image: url('../../img_rtl/scenes/Tasks/type/g3_description.jpg');
	width: 145px;
	height: 145px;
	bottom: 0;
	right: 0
}

#tasks .taskImage.description img.building.g4 {
	background-image: url('../../img_rtl/scenes/Tasks/type/g4_description.jpg');
	width: 145px;
	height: 145px;
	bottom: 0;
	right: 0
}

#tasks .taskImage.description img.building.g31 {
	background-image: url('../../img_rtl/g/upgradeView2019/buildingIllustrations/roman/g31.png');
	width: 241px;
	height: 160px
}

#tasks .taskImage.description img.building.g32 {
	background-image: url('../../img_rtl/g/upgradeView2019/buildingIllustrations/teuton/g32.png');
	width: 241px;
	height: 160px
}

#tasks .taskImage.description img.building.g33 {
	background-image: url('../../img_rtl/g/upgradeView2019/buildingIllustrations/gaul/g33.png');
	width: 241px;
	height: 160px
}

#tasks .taskImage.description img.building.g42 {
	background-image: url('../../img_rtl/g/upgradeView2019/buildingIllustrations/egyptian/g42.png');
	width: 241px;
	height: 160px
}

#tasks .taskImage.description img.building.g43 {
	background-image: url('../../img_rtl/g/upgradeView2019/buildingIllustrations/hun/g43.png');
	width: 241px;
	height: 160px
}

#tasks .taskImage.description img.building.g6 {
	bottom: -1px;
	right: -18px
}

#tasks .taskImage.description img.building.g7 {
	bottom: 8px;
	right: -9px
}

#tasks .taskImage.description img.building.g8 {
	bottom: -5px;
	right: -18px
}

#tasks .taskImage.description img.building.g11 {
	bottom: 5px;
	right: -9px
}

#tasks .taskImage.description img.building.g15 {
	right: -23px
}

#tasks .taskImage.description img.building.g16 {
	bottom: 4px;
	right: -20px
}

#tasks .taskImage.description img.building.g20 {
	bottom: 6px;
	right: -13px
}

#tasks .taskImage.description img.building.g24 {
	bottom: 8px;
	right: -12px
}

#tasks .taskImage.description img.building.g31 {
	bottom: -7px;
	right: -67px
}

#tasks .taskImage.description img.building.g32 {
	bottom: -13px;
	right: -59px
}

#tasks .taskImage.description img.building.g33 {
	bottom: -7px;
	right: -58px
}

#tasks .taskImage.description img.building.g42 {
	bottom: -19px;
	right: -58px
}

#tasks .taskImage.description img.building.g43 {
	bottom: -7px;
	right: -67px
}

#tasks .rewardBonus {
	position: relative;
	margin-top: 10px;
	padding: 3px;
	display: flex
}

#tasks .rewardBonus:before {
	background-image: url('../../img_rtl/scenes/Tasks/bonusBackground.jpg')
}

#tasks .rewardBonus>div {
	position: relative
}

#tasks .rewardBonus .heroLevel,
#tasks .rewardBonus .nextLevel {
	font-weight: bold;
	display: -ms-inline-grid;
	display: inline-grid;
	-ms-grid-rows: 1fr 25px;
	grid-template-rows: 1fr 25px
}

#tasks .rewardBonus .heroLevel .level,
#tasks .rewardBonus .nextLevel .level {
	text-align: center;
	color: #f2f2f2;
	text-shadow: 1px 0 0 #9a2d02, 1px 1px 0 #9a2d02, 0 1px 0 #9a2d02, -1px 1px 0 #9a2d02, -1px 0 0 #9a2d02, -1px -1px 0 #9a2d02, 0 -1px 0 #9a2d02, 1px -1px 0 #9a2d02;
	-ms-grid-row-align: center;
	align-self: center;
	-ms-grid-column-align: center;
	justify-self: center;
	-ms-grid-row: 1;
	grid-row-start: 1
}

#tasks .rewardBonus .heroLevel .description,
#tasks .rewardBonus .nextLevel .description {
	white-space: nowrap;
	-ms-grid-column-align: center;
	justify-self: center;
	-ms-grid-row-align: center;
	align-self: center;
	-ms-grid-row: 2;
	grid-row-start: 2
}

#tasks .rewardBonus .heroLevel {
	padding: 5px 30px 5px 10px
}

#tasks .rewardBonus .heroLevel .level {
	background-image: url('../../img_rtl/scenes/Tasks/heroLevel.png');
	width: 78px;
	height: 79px;
	line-height: 79px;
	padding-top: 1px;
	font-size: 24px
}

#tasks .rewardBonus .rewardInfo {
	flex-grow: 1;
	padding: 5px 10px;
	display: -ms-inline-grid;
	display: inline-grid;
	-ms-grid-rows: 50px 1fr;
	grid-template-rows: 50px 1fr
}

#tasks .rewardBonus .rewardInfo h4 {
	color: #5e463a;
	-ms-grid-row-align: end;
	align-self: end;
	-ms-grid-row: 1;
	grid-row-start: 1
}

#tasks .rewardBonus .rewardInfo div {
	-ms-grid-row: 2;
	grid-row-start: 2
}

#tasks .rewardBonus .nextLevel {
	padding: +5px 10px 5px 30px
}

#tasks .rewardBonus .nextLevel .level {
	background-image: url('../../img_rtl/scenes/Tasks/heroNextLevel.png');
	width: 58px;
	height: 58px;
	line-height: 58px;
	font-size: 23px
}

#tasks .pagination {
	text-align: center
}

#tasks .pagination button {
	padding: 0;
	display: inline-block;
	vertical-align: top;
	box-sizing: content-box;
	background-clip: content-box;
	background-origin: content-box
}

#tasks .pagination button.back,
#tasks .pagination button.forward {
	width: 34px;
	height: 41px
}

#tasks .pagination button.back:not(.disabled):hover,
#tasks .pagination button.back:not(.disabled):focus,
#tasks .pagination button.forward:not(.disabled):hover,
#tasks .pagination button.forward:not(.disabled):focus {
	background-position: 0 50%
}

#tasks .pagination button.back:not(.disabled):active,
#tasks .pagination button.forward:not(.disabled):active {
	background-position: 0 100%
}

#tasks .pagination button.back.disabled,
#tasks .pagination button.forward.disabled {
	opacity: .5;
	pointer-events: none
}

#tasks .pagination button.back {
	background-image: url('../../img_rtl/hud/content/scrollFrom.png');
	padding-left: 10px
}

#tasks .pagination button.forward {
	background-image: url('../../img_rtl/hud/content/scrollTo.png');
	padding-right: 10px
}

#tasks .pagination button.page {
	width: 29px;
	height: 29px;
	padding: 10px 5px 0;
	background-image: url('../../img_rtl/scenes/Tasks/paginationPages_unselected.png')
}

#tasks .pagination button.page.selected {
	background-image: url('../../img_rtl/scenes/Tasks/paginationPages_selected.png');
	pointer-events: none
}

#tasks .pagination button.page:not(.selected):hover,
#tasks .pagination button.page:not(.selected):focus {
	background-position: 0 50%
}

#tasks .pagination button.page:not(.selected):active {
	background-position: 0 100%
}

#contextualHelp {
	position: absolute;
	width: 100%;
	min-width: 1280px;
	height: 100%;
	z-index: 6000;
	pointer-events: none
}

@media screen and (max-width:620px) {
	.mobileOptimized #contextualHelp {
		display: none
	}
}

#contextualHelp.overlay {
	z-index: 999999
}

#contextualHelp * {
	box-sizing: border-box
}

#contextualHelp .contextualHelp {
	display: -ms-inline-grid;
	display: inline-grid;
	position: absolute;
	z-index: 1;
	opacity: 1;
	transition: visibility 150ms, opacity 150ms
}

#contextualHelp .contextualHelp.teasing {
	position: fixed
}

#contextualHelp .contextualHelp.hide {
	visibility: hidden;
	opacity: 0;
	pointer-events: none
}

#contextualHelp .contextualHelp .arrowContainer {
	width: 40px;
	height: calc(100% - 54px);
	margin-top: 27px;
	position: relative
}

#contextualHelp .contextualHelp .arrowContainer svg.pointingArrow {
	width: 40px;
	height: 40px;
	fill: rgba(51, 51, 51, 0.9);
	position: absolute;
	z-index: 5;
	margin-top: -20px
}

#contextualHelp .contextualHelp .helpBody {
	width: 350px;
	min-height: 80px;
	word-break: break-word;
	display: inline-block;
	padding: 30px 25px 25px;
	background-color: rgba(51, 51, 51, 0.9);
	color: #f2f2f2;
	border-radius: 7px;
	position: relative;
	z-index: 2;
	border: solid 2px #caa46d;
	border-top-color: #ffe1aa;
	border-bottom-color: #907151;
	box-shadow: 0 0 0 1px #1b1a1a, 0 0 0 1px #1b1a1a inset;
	pointer-events: auto
}

#contextualHelp .contextualHelp .helpBody:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	border-radius: 6px;
	z-index: 3;
	box-shadow: 0 -1px 0 0 #a3835a
}

#contextualHelp .contextualHelp .helpBody:after {
	content: "";
	position: absolute;
	top: -2px;
	left: -2px;
	bottom: -2px;
	right: -2px;
	border-radius: 6px;
	z-index: 3;
	box-shadow: 0 -1px 0 0 #a3835a inset
}

#contextualHelp .contextualHelp .helpBody .progress {
	width: calc(100% - 2px);
	height: 5px;
	position: absolute;
	top: 1px;
	right: 1px;
	z-index: -1;
	display: flex
}

#contextualHelp .contextualHelp .helpBody .progress div {
	background-color: #c9b59a;
	flex: 1;
	transition-duration: 250ms
}

#contextualHelp .contextualHelp .helpBody .progress div:not(:last-of-type) {
	margin-left: 1px
}

#contextualHelp .contextualHelp .helpBody .progress div:first-of-type {
	border-top-right-radius: 5px
}

#contextualHelp .contextualHelp .helpBody .progress div:last-of-type {
	border-top-left-radius: 5px
}

#contextualHelp .contextualHelp .helpBody .progress div.active {
	background-color: #f0e1cc
}

#contextualHelp .contextualHelp .helpBody nav {
	z-index: 4;
	height: 35px;
	margin-top: 25px;
	position: relative
}

#contextualHelp .contextualHelp .helpBody nav.hide {
	display: none
}

#contextualHelp .contextualHelp .helpBody nav svg {
	width: 12px;
	height: 17px;
	margin-top: 7px;
	transform: translateX(0);
	transition-duration: 150ms;
	transition-timing-function: ease-out;
	cursor: pointer;
	position: absolute
}

#contextualHelp .contextualHelp .helpBody nav svg.chevronBack {
	top: 0;
	right: 0
}

#contextualHelp .contextualHelp .helpBody nav svg.chevronForward {
	top: 0;
	left: 0
}

.rtl #contextualHelp .contextualHelp .helpBody nav svg {
	transform: scale(-1, 1)
}

#contextualHelp .contextualHelp .helpBody nav svg path {
	fill: transparent;
	stroke: #d2bda1;
	stroke-width: 4px;
	stroke-linecap: round;
	stroke-linejoin: round;
	transition-duration: 150ms
}

#contextualHelp .contextualHelp .helpBody nav svg:not(.disabled):hover path,
#contextualHelp .contextualHelp .helpBody nav svg:not(.disabled):focus path {
	stroke: #f0e1cc
}

#contextualHelp .contextualHelp .helpBody nav svg:not(.disabled):active path {
	stroke: #c9b59a
}

#contextualHelp .contextualHelp .helpBody nav button.textButtonV1 {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 0;
	background-color: #d2bda1;
	transition-duration: 150ms
}

#contextualHelp .contextualHelp .helpBody nav button.textButtonV1:hover,
#contextualHelp .contextualHelp .helpBody nav button.textButtonV1:focus {
	background-color: #f0e1cc
}

#contextualHelp .contextualHelp .helpBody nav button.textButtonV1:active {
	background-color: #c9b59a
}

#contextualHelp .contextualHelp .helpBody .teaser:not(.hide)+nav {
	display: none
}

#contextualHelp .contextualHelp.above .arrowContainer,
#contextualHelp .contextualHelp.below .arrowContainer {
	width: calc(100% - 54px);
	height: 40px;
	margin-top: 0;
	margin-right: 27px
}

#contextualHelp .contextualHelp.above {
	-ms-grid-columns: auto;
	grid-template-columns: auto
}

#contextualHelp .contextualHelp.above .arrowContainer {
	order: 2;
	-ms-grid-row: 2;
	grid-row-start: 2;
	margin-top: -2px
}

#contextualHelp .contextualHelp.above .arrowContainer svg.pointingArrow {
	transform: rotate(-90deg);
	margin-right: -22px;
	margin-top: 0;
	top: -2px;
	stroke: #907151
}

.rtl.ie #contextualHelp .contextualHelp.above .arrowContainer svg.pointingArrow {
	transform: rotate(90deg)
}

#contextualHelp .contextualHelp.below {
	-ms-grid-columns: auto;
	grid-template-columns: auto
}

#contextualHelp .contextualHelp.below .helpBody {
	-ms-grid-row: 2;
	grid-row-start: 2
}

#contextualHelp .contextualHelp.below .arrowContainer {
	margin-bottom: -2px
}

#contextualHelp .contextualHelp.below .arrowContainer svg.pointingArrow {
	transform: rotate(90deg);
	margin-right: -20px;
	top: 2px;
	margin-top: 0;
	stroke: #ffe1aa
}

.rtl.ie #contextualHelp .contextualHelp.below .arrowContainer svg.pointingArrow {
	transform: rotate(-90deg)
}

#contextualHelp .contextualHelp.before {
	-ms-grid-columns: auto 40px;
	grid-template-columns: auto 40px
}

#contextualHelp .contextualHelp.before .helpBody {
	-ms-grid-row: 1;
	grid-row-start: 1;
	-ms-grid-column: 1;
	grid-column-start: 1
}

#contextualHelp .contextualHelp.before .arrowContainer {
	order: 2;
	-ms-grid-row: 1;
	grid-row-start: 1;
	-ms-grid-column: 2;
	grid-column-start: 2;
	margin-right: -2px
}

#contextualHelp .contextualHelp.before .arrowContainer svg.pointingArrow {
	transform: scale(-1, -1);
	left: 2px;
	stroke: #caa46d
}

.rtl #contextualHelp .contextualHelp.before .arrowContainer svg.pointingArrow {
	transform: none
}

#contextualHelp .contextualHelp.after {
	-ms-grid-columns: 40px auto;
	grid-template-columns: 40px auto
}

#contextualHelp .contextualHelp.after .helpBody {
	-ms-grid-row: 1;
	grid-row-start: 1;
	-ms-grid-column: 2;
	grid-column-start: 2
}

#contextualHelp .contextualHelp.after .arrowContainer {
	-ms-grid-row: 1;
	grid-row-start: 1;
	-ms-grid-column: 1;
	grid-column-start: 1;
	margin-right: 2px
}

#contextualHelp .contextualHelp.after .arrowContainer svg.pointingArrow {
	stroke: #caa46d
}

.rtl #contextualHelp .contextualHelp.after .arrowContainer svg.pointingArrow {
	transform: scale(-1, -1)
}

#marketingBonusGoldPopup .bonusDisplayBox {
	width: 547px;
	background-color: #e1d2b2;
	position: relative;
	margin: 10px auto;
	border: solid 1px #998975;
	z-index: 1;
	text-align: center;
	font-weight: bold;
	font-size: 21px;
	padding-bottom: 100px;
	top: 50px;
	opacity: 0;
	transform: scale(0.8);
	animation: reveal 1000ms 500ms forwards
}

#marketingBonusGoldPopup .bonusDisplayBox:before,
#marketingBonusGoldPopup .bonusDisplayBox:after {
	content: "";
	display: block;
	position: absolute
}

#marketingBonusGoldPopup .bonusDisplayBox:before {
	position: absolute;
	top: 3px;
	left: 3px;
	bottom: 3px;
	right: 3px;
	background-image: url('../../img_rtl/views/marketingBonusGoldPopup/illustration.png');
	background-repeat: no-repeat;
	background-position: bottom
}

#marketingBonusGoldPopup .bonusDisplayBox:after {
	position: absolute;
	top: 2px;
	left: 2px;
	bottom: 2px;
	right: 2px;
	border: solid 1px #998975;
	background-color: #e1d2b2;
	z-index: -1
}

#marketingBonusGoldPopup .bonusDisplayBox p {
	opacity: 0
}

#marketingBonusGoldPopup .bonusDisplayBox p.intro {
	animation: reveal 1000ms 1500ms forwards
}

#marketingBonusGoldPopup .bonusDisplayBox p.goldAmount {
	margin-top: 25px;
	margin-bottom: 25px;
	animation: reveal 500ms 2500ms forwards, zoom 1000ms 3000ms forwards
}

#marketingBonusGoldPopup .bonusDisplayBox p.outro {
	animation: reveal 1000ms 4500ms forwards
}

#marketingBonusGoldPopup .bonusDisplayBox .centeredContainer {
	width: 330px;
	margin: 0 auto;
	font-size: 19px
}

#marketingBonusGoldPopup .buttonContainer {
	text-align: center
}

#marketingBonusGoldPopup .buttonContainer button#closeButton {
	margin-top: 20px;
	margin-bottom: 20px;
	opacity: 0;
	top: 25px;
	animation: reveal 1000ms 5500ms forwards
}

@keyframes reveal {
	0% {
		opacity: 0
	}

	100% {
		opacity: 1;
		top: 0;
		transform: scale(1)
	}
}

@keyframes zoom {
	0% {
		transform: scale(1)
	}

	50% {
		transform: scale(1.25)
	}

	100% {
		transform: scale(1)
	}
}

#vacationModeConfirmationDialog {
	width: 420px
}

#vacationModeConfirmationDialog .title {
	font-size: 12px;
	font-weight: bold
}

#vacationModeConfirmationDialog .text {
	margin-bottom: 15px;
	margin-top: 15px
}

#vacationModeConfirmationDialog .villages table td {
	font-size: 12px
}

#vacationModeConfirmationDialog .villages table th {
	font-size: 12px;
	background-color: #fce6c4
}

#waveBuilderDialog .featureContent {
	position: relative
}

#waveBuilderDialog .featureContent p {
	max-width: 65%;
	margin: 0
}

#waveBuilderDialog .featureContent h3 {
	margin-bottom: 5px
}

#waveBuilderDialog .featureContent:before {
	content: "";
	background-image: url('../../img_rtl/views/waveBuilderDialog/scroll.png');
	width: 170px;
	height: 96px;
	display: block;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 20px
}

#waveBuilderDialog .goldAmount {
	font-size: 17px;
	font-weight: bold;
	text-align: left;
	margin-top: 10px
}

#waveBuilderDialog .benefits {
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: 220px 1fr;
	grid-template-columns: 220px 1fr
}

#waveBuilderDialog .benefits .illustration {
	background-image: url('../../img_rtl/views/waveBuilderDialog/roman.png');
	min-height: 437px;
	-ms-grid-column: 1;
	grid-column-start: 1;
	-ms-grid-row-align: end;
	align-self: end
}

#waveBuilderDialog .benefits .benefitsList {
	-ms-grid-column: 2;
	grid-column-start: 2
}

#waveBuilderDialog .benefits .benefitsList h3 {
	margin-bottom: 5px
}

#waveBuilderDialog .benefits .benefitsList h3:not(:first-of-type) {
	margin-top: 40px
}

#waveBuilderDialog .benefits .benefitsList p {
	margin: 0
}

#waveBuilderDialog .benefits .benefitsList p:last-of-type {
	margin-bottom: 40px
}

#waveBuilderDialog .buttonWrapper {
	text-align: left
}

#waveBuilderDialog .buttonWrapper .notice,
#waveBuilderDialog .buttonWrapper .error {
	font-weight: bold
}

div#sysmsg {
	width: 550px;
	margin: auto;
	word-break: break-word
}

div#sysmsg .termsAcceptButton {
	float: left;
	margin-top: 10px
}

div#sysmsg button#cancel {
	float: right;
	margin-top: 10px
}

div#punishmentMsgButtons {
	margin: auto
}

div#punishmentMsgButtons button.continueButton {
	float: right;
	margin-top: 10px
}

div#punishmentMsgButtons button.contactSupportButton {
	float: left;
	margin-top: 10px
}

.truceImageAutumn,
.truceImageNeutral,
.truceImageSpring,
.truceImageSummer,
.truceImageWinter {
	width: 550px;
	height: 200px;
	padding: 0 0 25px 0;
	float: right
}

.truceImageAutumn {
	background-image: url('../../img_rtl/views/truce/truceAutumn.jpg')
}

.truceImageNeutral {
	background-image: url('../../img_rtl/views/truce/truceNeutral.jpg')
}

.truceImageSpring {
	background-image: url('../../img_rtl/views/truce/truceSpring.jpg')
}

.truceImageSummer {
	background-image: url('../../img_rtl/views/truce/truceSummer.jpg')
}

.truceImageWinter {
	background-image: url('../../img_rtl/views/truce/truceWinter.jpg')
}

#sysmsg.natar_end_factions {
	text-align: center;
	font-size: 16px;
	line-height: 1.35em;
	color: #5e463a;
	background-color: #f4efe4;
	margin: -9px -6px -10px;
	padding: 0 6px 10px;
	width: auto
}

#sysmsg.natar_end_factions .titleInHeader {
	text-align: right
}

#sysmsg.natar_end_factions #factionVictoryStatistics {
	border-top: 8px solid #d2bda1;
	margin: 0 -6px 35px
}

#sysmsg.natar_end_factions #factionVictoryStatistics:before {
	position: absolute;
	top: 0;
	left: 0;
	bottom: -10px;
	right: 0
}

#sysmsg.natar_end_factions #factionVictoryStatistics .podium {
	transform: translateY(19px)
}

#sysmsg.natar_end_factions>.headline {
	font-weight: bold;
	font-size: 17px;
	font-family: IRANSans;
	margin-bottom: 20px
}

#sysmsg.natar_end_factions .description {
	text-align: right;
	margin-bottom: 20px
}

#sysmsg.natar_end_factions .factions,
#sysmsg.natar_end_factions .players {
	background-color: #efe3ca;
	border: 1px solid #beae9a;
	border-radius: 2px;
	margin-bottom: 15px;
	padding: 10px;
	text-align: right;
	border-bottom: 1px solid #dcb183
}

#sysmsg.natar_end_factions .factions>.headline {
	font-weight: bold;
	font-size: 19px;
	background-color: #dec264;
	margin: -10px -10px 20px;
	border-radius: 2px 2px 0 0;
	padding: 1em 92px 1em 0;
	position: relative
}

#sysmsg.natar_end_factions .factions>.headline:before {
	content: "";
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	background-image: url('../../img_rtl/views/systemMessage/endGameFactions/winner.png');
	width: 82px;
	height: 72px
}

#sysmsg.natar_end_factions .players>div {
	min-height: 56px;
	position: relative;
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: 66px 1fr;
	grid-template-columns: 66px 1fr
}

#sysmsg.natar_end_factions .players>div:not(:first-child) {
	margin-top: 10px
}

#sysmsg.natar_end_factions .players>div:before {
	content: "";
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%)
}

#sysmsg.natar_end_factions .players>div>span {
	-ms-grid-column: 2;
	grid-column-start: 2;
	display: inline-block;
	-ms-grid-row-align: center;
	align-self: center
}

.ie #sysmsg.natar_end_factions .players>div>span {
	padding: 5px 0
}

#sysmsg.natar_end_factions .players>div.population:before {
	background-image: url('../../img_rtl/views/systemMessage/endGameFactions/population.png');
	width: 56px;
	height: 56px
}

#sysmsg.natar_end_factions .players>div.off:before {
	background-image: url('../../img_rtl/views/systemMessage/endGameFactions/off.png');
	width: 56px;
	height: 60px
}

#sysmsg.natar_end_factions .players>div.def:before {
	background-image: url('../../img_rtl/views/systemMessage/endGameFactions/def.png');
	width: 56px;
	height: 56px
}

#sysmsg.natar_end_factions .f16 {
	display: none
}

#content.activate .activateWithSectors .activationScreen #presentation #activationMapContainer #map input[name="sector"]+label[data-text]:before,
#content.activate .activateWithSectors .activationScreen #presentation.confirmation #selectedTribe .tribeName {
	position: absolute;
	right: 50%;
	transform: translateX(50%)
}

#content.activate .activateWithSectors hr {
	height: 1px;
	border-top: 0;
	border-left: 0;
	border-right: 0;
	border-bottom: 1px dotted #d3d3d3;
	margin-bottom: 20px
}

#content.activate .activateWithSectors div.btn {
	text-align: center
}

#content.activate .activateWithSectors div.notice {
	margin-bottom: 15px
}

#content.activate .activateWithSectors .activation {
	margin-bottom: 20px
}

#content.activate .activateWithSectors .startsIn {
	text-align: center;
	margin-bottom: 20px
}

#content.activate .activateWithSectors .startsIn .activation_time {
	color: #ff8000;
	font-size: 21px;
	text-align: center;
	margin: 5px 0
}

#content.activate .activateWithSectors .activation .code {
	font-weight: bold
}

#content.activate .activateWithSectors div.email {
	margin-bottom: 20px
}

#content.activate .activateWithSectors div.email table td.label {
	padding-right: 175px
}

#content.activate .activateWithSectors div.email table td.input {
	width: 56%
}

#content.activate .activateWithSectors .error2 {
	color: #ff8000
}

#content.activate .activateWithSectors .unavailable {
	font-size: 25px
}

#content.activate .activateWithSectors .container .kind {
	float: right;
	width: 90px;
	position: relative
}

#content.activate .activateWithSectors .container .description-container {
	width: 400px;
	height: 220px;
	float: right;
	background-image: url('../../img_rtl/activate/volkBackground-rtl.jpg');
	padding: 15px 18px;
	position: relative
}

#content.activate .activateWithSectors .container .headline {
	font-size: 120%;
	font-weight: bold;
	margin-bottom: 10px
}

#content.activate .activateWithSectors .container .description {
	display: none;
	height: 200px
}

#content.activate .activateWithSectors #sector .sectorDescription {
	padding-bottom: 20px
}

#content.activate .activateWithSectors #sector div.sectorSelect {
	position: relative;
	width: 513px;
	height: 198px
}

#content.activate .activateWithSectors #sector .map {
	margin-left: 10px;
	padding: 6px 7px 7px 6px;
	float: right;
	width: 185px;
	height: 185px;
	background-image: url('../../img_rtl/activate/map-rtl.png');
	position: relative
}

#content.activate .activateWithSectors #sector .map.aeu {
	background-image: url('../../img_rtl/activate/map-aeu.png')
}

#content.activate .activateWithSectors #sector .map.territorial {
	background-image: url('../../img_rtl/activate/map-territorial.png')
}

#content.activate .activateWithSectors #sector .map .sector {
	width: 92px;
	height: 92px;
	float: left
}

#content.activate .activateWithSectors #sector .map #no {
	margin-left: 1px
}

#content.activate .activateWithSectors #sector .map #sw {
	margin-top: 1px
}

#content.activate .activateWithSectors #sector .map #so {
	margin-top: 1px;
	margin-left: 1px
}

#content.activate .activateWithSectors #sector .map .sector .active,
#content.activate .activateWithSectors #sector .map .sector .hover,
#content.activate .activateWithSectors #sector .map .sector .disabled {
	background-image: url('../../img_rtl/activate/mapActive.png')
}

#content.activate .activateWithSectors #sector .map .sector .highlight {
	width: 92px;
	height: 92px
}

#content.activate .activateWithSectors #sector .map .sector .hover {
	background-position: right -100px
}

#content.activate .activateWithSectors #sector .map .sector .disabled {
	background-position: right -200px
}

#content.activate .activateWithSectors div.vidDescription {
	padding: 0 20px 20px
}

#content.activate .activateWithSectors .container div.vidSelect {
	position: relative;
	width: 541px;
	height: 252px
}

#content.activate .activateWithSectors .container .kind .vid {
	background-image: url('../../img_rtl/activate/volkIcon-rtl.png');
	width: 80px;
	height: 72px;
	cursor: pointer;
	padding: 6px 0
}

#content.activate .activateWithSectors .container .kind .vid1 {
	background-position: -11px -388px
}

#content.activate .activateWithSectors .container .kind .vid2 {
	background-position: -11px -688px
}

#content.activate .activateWithSectors .container .kind .vid3 {
	background-position: -11px -88px
}

#content.activate .activateWithSectors .container .kind .vid1Highlight {
	background-position: -11px -482px
}

#content.activate .activateWithSectors .container .kind .vid2Highlight {
	background-position: -11px -782px
}

#content.activate .activateWithSectors .container .kind .vid3Highlight {
	background-position: -11px -182px
}

#content.activate .activateWithSectors .container .kind .vid1Active {
	background-position: -11px -582px
}

#content.activate .activateWithSectors .container .kind .vid2Active {
	background-position: -11px -882px
}

#content.activate .activateWithSectors .container .kind .vid3Active {
	background-position: -11px -282px
}

#content.activate .activateWithSectors .container .description-container li {
	line-height: 140%;
	padding: 2px 0;
	background-image: url('../../img_rtl/activate/dot.png');
	padding-right: 16px;
	background-position: right 9px
}

#content.activate .activateWithSectors .container .description-container ul {
	list-style-type: none;
	margin: 0;
	padding: 0
}

#content.activate .activateWithSectors .container .description-container .text {
	width: 285px
}

#content.activate .activateWithSectors .container .description-container .special {
	margin-bottom: 10px
}

#content.activate .activateWithSectors .container .description-container .bubble {
	background-image: url('../../img_rtl/activate/bubble-rtl.png');
	height: 30px;
	right: -10px;
	position: absolute;
	width: 38px
}

#content.activate .activateWithSectors .container .container .description-container .vid1 .bubble {
	top: 115px
}

#content.activate .activateWithSectors .container .container .description-container .vid2 .bubble {
	top: 200px
}

#content.activate .activateWithSectors .container .container .description-container .vid3 .bubble {
	top: 30px
}

#content.activate .activateWithSectors .container .submitButton {
	text-align: center;
	margin-top: 15px
}

#content.activate .activateWithSectors .container .boxGrey .boxTop,
#content.activate .activateWithSectors .container .boxGrey .boxBottom,
#content.activate .activateWithSectors .container .boxGrey .boxMiddle {
	width: 551px
}

#content.activate .activateWithSectors .container .boxGrey .content {
	position: relative;
	padding: 15px 5px
}

#content.activate .activateWithSectors .container .boxVidInfo {
	margin-bottom: 25px
}

#content.activate .activateWithSectors .container .boxVidInfo .greenbox-content {
	padding: 0 20px;
	width: 515px;
	color: #228b22;
	font-weight: bold
}

#content.activate .activateWithSectors .container .avatar {
	background-image: url('../../img_rtl/activate/avatars-rtl.png');
	height: 180px;
	width: 190px;
	position: absolute;
	left: -35px
}

#content.activate .activateWithSectors #vid .avatar {
	bottom: -72px
}

#content.activate .activateWithSectors .avatar.vid1 {
	background-position: 0 -416px
}

#content.activate .activateWithSectors .avatar.vid2 {
	background-position: 0 -216px
}

#content.activate .activateWithSectors .avatar.vid3 {
	background-position: 0 -16px
}

#content.activate .activateWithSectors .changeVid a {
	color: #333;
	background-image: url('../../img_rtl/activate/arrow-rtl.png');
	display: block;
	height: 20px;
	padding-right: 30px;
	line-height: 20px;
	margin-top: 10px
}

#content.activate .activateWithSectors .start {
	background-image: url('../../img_rtl/activate/bubbleSector-rtl.jpg');
	float: left;
	height: 25px;
	padding: 26px 30px 25px 20px;
	width: 254px
}

#content.activate .activateWithSectors .start select {
	width: 100%
}

#content.activate .activateWithSectors #sector .buttonContainer {
	float: left;
	padding-right: 5px;
	padding-top: 20px;
	width: 299px;
	height: 25px
}

#content.activate .activateWithSectors #sector .boxGrey .content {
	padding: 15px 19px;
	position: relative
}

#content.activate .activateWithSectors #sector .avatar {
	bottom: -16px
}

#content.activate .activateWithSectors {
	font-size: 120%;
	line-height: 1.5rem;
	color: #f2f2f2;
	background-image: url('../../img_rtl/activate/troops-background.png');
	background-size: contain;
	background-position: bottom;
	margin: 0 -17px -20px;
	padding: 0 17px 0
}

#center #contentOuterContainer #content.activate .activateWithSectors h1.titleInHeader {
	text-align: center;
	right: 90px;
	left: 90px
}

#content.activate .activateWithSectors .activationScreen {
	width: 100%
}

#content.activate .activateWithSectors .activationScreen * {
	box-sizing: border-box
}

#content.activate .activateWithSectors .activationScreen #presentation {
	padding: 7px 7px 10px;
	min-height: 330px;
	position: relative;
	width: 100%;
	border-radius: 4px;
	margin-top: 15px
}

#content.activate .activateWithSectors .activationScreen #presentation.sectors {
	background-color: transparent
}

#content.activate .activateWithSectors .activationScreen #presentation.confirmation {
	width: 100%;
	height: 100%;
	background-color: rgba(144, 120, 92, 0.5)
}

#content.activate .activateWithSectors .activationScreen #presentation svg {
	width: 100%;
	min-height: 250px;
	box-sizing: border-box;
	overflow: visible;
	position: relative
}

#content.activate .activateWithSectors .activationScreen #presentation svg .outer {
	stroke: #e4cd98;
	stroke-width: 5;
	fill: #bb8050
}

#content.activate .activateWithSectors .activationScreen #presentation svg .inner {
	fill: #fdeaa7
}

#content.activate .activateWithSectors .activationScreen #presentation svg .arrowFirst {
	position: absolute;
	top: 0
}

#content.activate .activateWithSectors .activationScreen #presentation h2 {
	font-size: 200%;
	padding: 0;
	margin: 0;
	color: #7b2e00;
	text-shadow: 1px 0 1px rgba(85, 85, 85, 0.35), 1px 1px 1px rgba(85, 85, 85, 0.35), 0 1px 1px rgba(85, 85, 85, 0.35), -1px 1px 1px rgba(85, 85, 85, 0.35), -1px 0 1px rgba(85, 85, 85, 0.35), -1px -1px 1px rgba(85, 85, 85, 0.35), 0 -1px 1px rgba(85, 85, 85, 0.35), 1px -1px 1px rgba(85, 85, 85, 0.35);
	text-transform: uppercase
}

#content.activate .activateWithSectors .activationScreen #presentation #descriptions {
	position: relative;
	min-height: 220px
}

#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors {
	display: flex;
	flex-direction: row;
	justify-content: center;
	width: 100%;
	margin-top: 10px
}

#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input {
	display: none
}

#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input+.selector {
	flex: 1;
	min-width: 80px;
	max-width: 80px;
	height: 80px;
	border: solid 2px #4f3d2d;
	border-radius: 3px;
	margin-right: 7px;
	margin-left: 7px;
	background-color: #fdeaa7;
	box-shadow: 2px 2px 30px #958371 inset, -2px -2px 30px #958371 inset;
	position: relative;
	cursor: pointer;
	display: block;
	transition-duration: 150ms
}

#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input+.selector[data-text]:before {
	content: attr(data-text);
	padding-right: 8px;
	padding-left: 8px;
	padding-top: 2px;
	background-color: #ed1c24;
	border-bottom: solid 1px #b3191d;
	box-shadow: 0 1px 0 rgba(0, 0, 0, 0.7);
	position: absolute;
	bottom: -22px;
	left: -2px;
	z-index: 2;
	font-size: 70%;
	line-height: 150%;
	font-weight: bold
}

#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input+.selector:after {
	content: "";
	width: 100%;
	height: 100%;
	position: absolute;
	background-position: 0 80px
}

#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input+.selector:hover:after {
	background-position: 0 0
}

#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input+.selector+.tribeDescription {
	width: calc(100% - 30px);
	padding: 25px;
	position: absolute;
	top: 15px;
	right: 15px;
	height: 200px;
	z-index: 1;
	color: transparent;
	transition-duration: 150ms;
	opacity: 0
}

#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input+.selector+.tribeDescription[data-text]:before {
	content: attr(data-text);
	width: auto;
	background-color: #35700e;
	border-bottom: solid 2px #2f2919;
	color: #f2f2f2;
	left: 25px;
	top: 2px;
	padding: 7px;
	font-weight: bold;
	position: absolute;
	text-transform: uppercase;
	font-size: 80%
}

#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input+.selector+.tribeDescription ul {
	top: -15px;
	right: 0;
	padding: 70px 25px 0 0;
	width: 100%;
	position: absolute;
	height: calc(100% + 20px);
	font-weight: bold;
	list-style: none
}

#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input+.selector+.tribeDescription ul li {
	max-width: calc(100% - 180px);
	padding-right: 25px;
	line-height: 16px;
	margin-bottom: 10px
}

#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input+.selector+.tribeDescription ul li:before {
	content: "";
	width: 16px;
	height: 16px;
	position: absolute;
	margin-right: -25px
}

#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input+.selector+.tribeDescription ul:after {
	content: "";
	position: absolute;
	width: 188px;
	height: 176px;
	bottom: -1px;
	left: 0;
	background-image: url('../../img_rtl/activate/avatars-rtl.png');
	background-position: 0 0;
	z-index: -1;
	opacity: 0
}

#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input:not(:checked):active+.selector {
	box-shadow: none
}

#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input:checked+.selector {
	border: solid 2px #f8d483;
	box-shadow: 2px 2px 30px #ba7e4d inset, -2px -2px 30px #ba7e4d inset;
	cursor: default
}

#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input:checked+.selector:after {
	background-position: 0 0
}

#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input:checked+.selector+.tribeDescription {
	z-index: 2;
	opacity: 1;
	color: #555
}

#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input:checked+.selector+.tribeDescription ul:after {
	opacity: 1
}

#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input[value="1"]+.selector:after {
	background-image: url('../../img_rtl/activate/tribeSelection/tribe1.png')
}

#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input[value="1"]+.selector+.tribeDescription ul li:before {
	background-image: url('../../img_rtl/units/roman/icon/roman.png')
}

#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input[value="1"]+.selector+.tribeDescription ul:after {
	background-position: 0 -433px;
	height: 202px
}

#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input[value="2"]+.selector:after {
	background-image: url('../../img_rtl/activate/tribeSelection/tribe2.png')
}

#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input[value="2"]+.selector+.tribeDescription ul li:before {
	background-image: url('../../img_rtl/units/teuton/icon/teuton.png')
}

#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input[value="2"]+.selector+.tribeDescription ul:after {
	background-position: 0 -217px;
	height: 202px
}

#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input[value="3"]+.selector:after {
	background-image: url('../../img_rtl/activate/tribeSelection/tribe3.png');
	background-position-x: -8px
}

#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input[value="3"]+.selector+.tribeDescription ul li:before {
	background-image: url('../../img_rtl/units/gaul/icon/gaul.png')
}

#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input[value="3"]+.selector+.tribeDescription ul:after {
	background-position: 0 0
}

#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input[value="6"]+.selector:after {
	background-image: url('../../img_rtl/activate/tribeSelection/tribe6.png')
}

#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input[value="6"]+.selector+.tribeDescription ul li:before {
	background-image: url('../../img_rtl/units/egyptian/icon/egyptian.png')
}

#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input[value="6"]+.selector+.tribeDescription ul:after {
	background-position: 0 -649px;
	height: 215px;
	bottom: -14px
}

#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input[value="7"]+.selector:after {
	background-image: url('../../img_rtl/activate/tribeSelection/tribe7.png')
}

#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input[value="7"]+.selector+.tribeDescription ul li:before {
	background-image: url('../../img_rtl/units/hun/icon/hun.png')
}

#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input[value="7"]+.selector+.tribeDescription ul:after {
	background-position: 0 -851px;
	height: 216px;
	bottom: -1px
}

#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input[value="6"]+.selector+.tribeDescription h2,
#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input[value="7"]+.selector+.tribeDescription h2 {
	margin-right: 180px
}

#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input[value="6"]+.selector+.tribeDescription ul,
#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input[value="7"]+.selector+.tribeDescription ul {
	width: calc(100% - 180px);
	right: 180px
}

#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input[value="6"]+.selector+.tribeDescription ul:after,
#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input[value="7"]+.selector+.tribeDescription ul:after {
	right: -180px
}

#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input[value="6"]+.selector+.tribeDescription ul li,
#content.activate .activateWithSectors .activationScreen #presentation #tribeSelectors input[value="7"]+.selector+.tribeDescription ul li {
	max-width: 100%
}

#content.activate .activateWithSectors .activationScreen #presentation #activationMapContainer {
	width: 317px;
	height: 297px;
	padding: 10px;
	box-sizing: content-box;
	background-color: rgba(144, 120, 92, 0.5);
	border-radius: 4px;
	margin: 0 auto;
	position: relative;
	z-index: 1
}

#content.activate .activateWithSectors .activationScreen #presentation #activationMapContainer:after {
	content: "";
	width: 317px;
	height: 297px;
	background-image: url('../../img_rtl/activate/sectorSelection/map-background-rtl.png');
	z-index: -1;
	position: absolute
}

#content.activate .activateWithSectors .activationScreen #presentation #activationMapContainer #map {
	border: solid 2px rgba(255, 255, 255, 0.4);
	box-sizing: content-box;
	width: 276px;
	height: 256px;
	right: 28px;
	top: 28px;
	position: absolute
}

#content.activate .activateWithSectors .activationScreen #presentation #activationMapContainer #map:after {
	content: "";
	width: 276px;
	height: 256px;
	background-image: url('../../img_rtl/activate/sectorSelection/map.png');
	background-repeat: no-repeat;
	position: absolute;
	box-sizing: content-box
}

#content.activate .activateWithSectors .activationScreen #presentation #activationMapContainer #map:before {
	content: "";
	width: 276px;
	height: 256px;
	background: url('../../img_rtl/activate/sectorSelection/sector-divider-rtl.png') center;
	position: absolute;
	right: 0;
	top: 0;
	z-index: 5;
	box-shadow: 2px 2px 40px #ceac76 inset, -2px -2px 40px #ceac76 inset, 2px -2px 40px #ceac76 inset, -2px 2px 40px #ceac76 inset;
	box-sizing: content-box
}

#content.activate .activateWithSectors .activationScreen #presentation #activationMapContainer #map.territorial:after {
	background-image: url('../../img_rtl/activate/sectorSelection/map-territorial.png')
}

#content.activate .activateWithSectors .activationScreen #presentation #activationMapContainer #map input[name="sector"] {
	display: none
}

#content.activate .activateWithSectors .activationScreen #presentation #activationMapContainer #map input[name="sector"]:disabled+label {
	background-color: rgba(50, 50, 50, 0.5);
	cursor: auto
}

#content.activate .activateWithSectors .activationScreen #presentation #activationMapContainer #map input[name="sector"]+label {
	width: 138px;
	height: 127px;
	display: inline-block;
	position: absolute;
	z-index: 6;
	color: #655642;
	text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.25);
	font-weight: bold;
	font-size: 80%;
	text-transform: uppercase;
	text-align: center;
	background-color: rgba(196, 158, 102, 0.5);
	background-position: top center;
	transition-duration: 250ms;
	cursor: pointer
}

#content.activate .activateWithSectors .activationScreen #presentation #activationMapContainer #map input[name="sector"]+label:hover {
	background-color: rgba(116, 94, 60, 0.5);
	color: #fdefcc
}

#content.activate .activateWithSectors .activationScreen #presentation #activationMapContainer #map input[name="sector"]+label:active {
	box-shadow: 0 0 40px #5e3f2a inset
}

#content.activate .activateWithSectors .activationScreen #presentation #activationMapContainer #map input[name="sector"]+label[data-text]:before {
	content: attr(data-text);
	width: auto;
	bottom: 10px;
	background-color: #35700e;
	padding-right: 5px;
	padding-left: 5px;
	color: #f2f2f2;
	font-size: 90%;
	opacity: .65
}

.territorial label[data-text]:before {
	color: #655642 !important;
	background-color: #f1b900 !important;
	text-shadow: 1px 1px 2px rgba(255, 255, 255, 0.5)
}

#content.activate .activateWithSectors .activationScreen #presentation #activationMapContainer #map input[name="sector"][value="nw"]+label {
	left: 0;
	top: 0;
	padding-top: 10px
}

#content.activate .activateWithSectors .activationScreen #presentation #activationMapContainer #map input[name="sector"][value="no"]+label {
	right: 0;
	top: 0;
	padding-top: 10px
}

#content.activate .activateWithSectors .activationScreen #presentation #activationMapContainer #map input[name="sector"][value="sw"]+label {
	left: 0;
	bottom: 0;
	padding-top: 90px;
	height: 129px
}

#content.activate .activateWithSectors .activationScreen #presentation #activationMapContainer #map input[name="sector"][value="so"]+label {
	right: 0;
	bottom: 0;
	padding-top: 90px;
	height: 129px
}

#content.activate .activateWithSectors .activationScreen #presentation #activationMapContainer #map input[name="sector"][value="sw"]+label[data-text]:before,
#content.activate .activateWithSectors .activationScreen #presentation #activationMapContainer #map input[name="sector"][value="so"]+label[data-text]:before {
	bottom: 40px
}

#content.activate .activateWithSectors .activationScreen #presentation #activationMapContainer #map input[name="sector"]:checked+label {
	background-color: transparent;
	background: url('../../img_rtl/activate/sectorSelection/banner-rtl.png') no-repeat center;
	cursor: default;
	transition-timing-function: ease-in
}

#content.activate .activateWithSectors .activationScreen #presentation #activationMapContainer #map input[name="sector"]:checked+label:hover {
	background-color: transparent;
	color: #655642
}

#content.activate .activateWithSectors .activationScreen #presentation #activationMapContainer #map input[name="sector"]:checked+label:active {
	background-color: transparent;
	color: #655642;
	box-shadow: none
}

#content.activate .activateWithSectors .activationScreen #presentation #activationMapContainer #map input[name="sector"]:checked+label[data-text]:before {
	opacity: 1
}

#content.activate .activateWithSectors .activationScreen #presentation #activationMapContainer #map input[name="sector"]:checked[value="sw"]+label[data-text],
#content.activate .activateWithSectors .activationScreen #presentation #activationMapContainer #map input[name="sector"]:checked[value="so"]+label[data-text] {
	background-position: center 10px
}

#content.activate .activateWithSectors .activationScreen #presentation.confirmation #activationMapContainer {
	top: 10px;
	left: 0;
	transform: scale(0.78);
	background-color: transparent;
	position: absolute
}

#content.activate .activateWithSectors .activationScreen #presentation.confirmation #activationMapContainer input[name="sector"]+label {
	cursor: default !important;
	pointer-events: none
}

#content.activate .activateWithSectors .activationScreen #presentation.confirmation #selectedTribe {
	position: absolute;
	top: 55px;
	right: 55px
}

#content.activate .activateWithSectors .activationScreen #presentation.confirmation #selectedTribe .character {
	width: 200px;
	height: 190px;
	margin-bottom: 10px;
	background-image: url('../../img_rtl/activate/avatars-rtl.png');
	background-position: 0 0
}

#content.activate .activateWithSectors .activationScreen #presentation.confirmation #selectedTribe.tribe1 .character {
	background-position: 0 -433px
}

#content.activate .activateWithSectors .activationScreen #presentation.confirmation #selectedTribe.tribe2 .character {
	background-position: 0 -217px
}

#content.activate .activateWithSectors .activationScreen #presentation.confirmation #selectedTribe.tribe3 .character {
	background-position: 0 0
}

#content.activate .activateWithSectors .activationScreen #presentation.confirmation #selectedTribe.tribe6 .character {
	height: 207px;
	background-position: 0 -648px;
	margin-top: -7px
}

#content.activate .activateWithSectors .activationScreen #presentation.confirmation #selectedTribe.tribe7 .character {
	height: 215px;
	background-position: 0 -863px;
	margin-bottom: 0
}

#content.activate .activateWithSectors .activationScreen .acceptChallenge {
	width: 100%;
	text-align: center;
	position: relative;
	margin-top: 20px;
	z-index: 3;
	font-weight: bold;
	text-shadow: 1px 0 2px #000, 1px 1px 2px #000, 0 1px 2px #000, -1px 1px 2px #000, -1px 0 2px #000, -1px -1px 2px #000, 0 -1px 2px #000, 1px -1px 2px #000
}

#content.activate .activateWithSectors .activationScreen .gameVersionOption {
	display: none
}

#content.activate .activateWithSectors .activationScreen .buttonContainer {
	width: 100%;
	height: 100px;
	position: relative;
	z-index: 2;
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: 100%;
	grid-template-columns: 100%
}

#content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1 {
	display: inline-block;
	-ms-grid-row: 1;
	grid-row-start: 1;
	-ms-grid-column: 1;
	grid-column-start: 1;
	-ms-grid-row-align: center;
	align-self: center;
	-ms-grid-column-align: center;
	justify-self: center
}

#content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.confirmation {
	position: relative;
	z-index: 1;
	height: 38px;
	line-height: 22px;
	padding: 6px 30px;
	font-size: 17px;
	font-weight: bold;
	text-align: right;
	border-radius: 7px;
	white-space: nowrap;
	color: #2c2c2c;
	background-image: linear-gradient(to bottom, #f8c000, #f0a600);
	background-color: #d8cfa7;
	border: 2px solid #332805;
	box-shadow: inset 2px 0 2px -1px #6f561a, inset -2px 0 2px -1px #6f4f1b, inset 0 3px 2px -1px #e2bb2e, inset 0 -3px 2px -1px rgba(75, 58, 10, 0.6)
}

#content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.confirmation:hover,
#content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.confirmation:focus {
	color: #332805;
	background-image: none;
	background-color: #f8c000;
	border-color: #60542c;
	box-shadow: inset 0 20px 25px -10px rgba(255, 255, 255, 0.5)
}

#content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.confirmation:active {
	color: #60542c;
	background-image: linear-gradient(to top, #f8c000, #f0a600);
	box-shadow: inset 2px 0 2px -1px #6f561a, inset -2px 0 2px -1px #6f4f1b
}

#content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.confirmation.disabled,
#content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.confirmation:disabled {
	background-image: none;
	color: #60542c;
	border-color: #60542c;
	background-color: #b39e86;
	text-shadow: none;
	box-shadow: none
}

.ie #content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.confirmation {
	margin-top: 40px
}

#content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.playNow {
	transform: scale(1.5)
}

.ie #content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.playNow {
	margin-top: 40px
}

#content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.playNow:disabled,
#content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.playNow.disabled {
	text-shadow: none
}

body:not(.safari) #content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.playNow:disabled span,
body:not(.safari) #content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.playNow.disabled span {
	transition: padding 250ms
}

body:not(.safari) #content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.playNow:disabled span:before,
body:not(.safari) #content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.playNow.disabled span:before {
	content: "";
	position: absolute;
	width: 16px;
	height: 16px;
	display: block;
	top: 3px;
	left: 15px;
	background-image: url('../../img_rtl/views/activation/withSectors/loading.png');
	background-size: contain;
	pointer-events: none;
	opacity: 0;
	transition: opacity 250ms
}

body:not(.safari) #content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.playNow:disabled.loading span,
body:not(.safari) #content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.playNow.disabled.loading span {
	padding-left: 20px
}

body:not(.safari) #content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.playNow:disabled.loading span:before,
body:not(.safari) #content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.playNow.disabled.loading span:before {
	opacity: .4;
	animation: loadingSpinner 2s linear infinite
}

@keyframes loadingSpinner {
	0% {
		transform: rotate(0)
	}

	100% {
		transform: rotate(-360deg)
	}
}

#content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.playNow:not(:disabled) {
	animation: activationButtonGrow 6s ease-in-out infinite
}

#content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.playNow:not(:disabled):not(:hover):not(:focus):not(:active) {
	text-shadow: 1px 0 0 rgba(0, 0, 0, 0.8), 1px 1px 0 rgba(0, 0, 0, 0.8), 0 1px 0 rgba(0, 0, 0, 0.8), -1px 1px 0 rgba(0, 0, 0, 0.8), -1px 0 0 rgba(0, 0, 0, 0.8), -1px -1px 0 rgba(0, 0, 0, 0.8), 0 -1px 0 rgba(0, 0, 0, 0.8), 1px -1px 0 rgba(0, 0, 0, 0.8)
}

#content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.playNow:not(:disabled):not(:hover):not(:focus):not(:active) span {
	animation: activationButtonTextGlow 6s ease-in-out infinite
}

.ie #content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.playNow:not(:disabled) {
	animation: none
}

#content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.playNow:not(:disabled):before,
#content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.playNow:not(:disabled):after {
	content: "";
	width: 100%;
	height: 100%;
	border-radius: 5px;
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	z-index: 1;
	pointer-events: none
}

#content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.playNow:not(:disabled):before {
	background-image: url('../../img_rtl/views/activation/withSectors/buttonHighlight.png');
	background-repeat: no-repeat;
	background-size: contain;
	background-position: -50px 0;
	animation: activationButtonFlash 6s linear infinite
}

#content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.playNow:not(:disabled):after {
	opacity: 0;
	background-color: #8ad220;
	animation: activationButtonGlow 6s ease-in-out infinite
}

.ie #content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.playNow:not(:disabled):after {
	animation: none
}

#content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.playNow:not(:disabled) span {
	pointer-events: none;
	position: relative;
	z-index: 2
}

.ie #content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.playNow:not(:disabled) span {
	animation: none
}

#content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.playNow:not(:disabled):focus,
#content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.playNow:not(:disabled):hover,
#content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.playNow:not(:disabled):active {
	animation-play-state: paused
}

#content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.playNow:not(:disabled):focus:before,
#content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.playNow:not(:disabled):focus:after,
#content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.playNow:not(:disabled):focus span,
#content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.playNow:not(:disabled):hover:before,
#content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.playNow:not(:disabled):hover:after,
#content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.playNow:not(:disabled):hover span,
#content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.playNow:not(:disabled):active:before,
#content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.playNow:not(:disabled):active:after,
#content.activate .activateWithSectors .activationScreen .buttonContainer button.textButtonV1.playNow:not(:disabled):active span {
	animation-play-state: paused
}

@keyframes activationButtonFlash {
	0% {
		background-position: 150% 0
	}

	92% {
		background-position: 150% 0
	}

	100% {
		background-position: -50px 0
	}
}

@keyframes activationButtonGrow {
	0% {
		transform: scale(1.5)
	}

	10% {
		transform: scale(1.5)
	}

	35% {
		transform: scale(1.65)
	}

	60% {
		transform: scale(1.5)
	}

	100% {
		transform: scale(1.5)
	}
}

@keyframes activationButtonGlow {
	0% {
		opacity: 0
	}

	10% {
		opacity: 0
	}

	35% {
		opacity: .9
	}

	60% {
		opacity: 0
	}

	100% {
		opacity: 0
	}
}

@keyframes activationButtonTextGlow {
	0% {
		text-shadow: 1px 0 0 rgba(0, 0, 0, 0.8), 1px 1px 0 rgba(0, 0, 0, 0.8), 0 1px 0 rgba(0, 0, 0, 0.8), -1px 1px 0 rgba(0, 0, 0, 0.8), -1px 0 0 rgba(0, 0, 0, 0.8), -1px -1px 0 rgba(0, 0, 0, 0.8), 0 -1px 0 rgba(0, 0, 0, 0.8), 1px -1px 0 rgba(0, 0, 0, 0.8)
	}

	10% {
		text-shadow: 1px 0 0 rgba(0, 0, 0, 0.8), 1px 1px 0 rgba(0, 0, 0, 0.8), 0 1px 0 rgba(0, 0, 0, 0.8), -1px 1px 0 rgba(0, 0, 0, 0.8), -1px 0 0 rgba(0, 0, 0, 0.8), -1px -1px 0 rgba(0, 0, 0, 0.8), 0 -1px 0 rgba(0, 0, 0, 0.8), 1px -1px 0 rgba(0, 0, 0, 0.8)
	}

	35% {
		text-shadow: 1px 0 0 rgba(91, 91, 91, 0.8), 1px 1px 0 rgba(91, 91, 91, 0.8), 0 1px 0 rgba(91, 91, 91, 0.8), -1px 1px 0 rgba(91, 91, 91, 0.8), -1px 0 0 rgba(91, 91, 91, 0.8), -1px -1px 0 rgba(91, 91, 91, 0.8), 0 -1px 0 rgba(91, 91, 91, 0.8), 1px -1px 0 rgba(91, 91, 91, 0.8)
	}

	60% {
		text-shadow: 1px 0 0 rgba(0, 0, 0, 0.8), 1px 1px 0 rgba(0, 0, 0, 0.8), 0 1px 0 rgba(0, 0, 0, 0.8), -1px 1px 0 rgba(0, 0, 0, 0.8), -1px 0 0 rgba(0, 0, 0, 0.8), -1px -1px 0 rgba(0, 0, 0, 0.8), 0 -1px 0 rgba(0, 0, 0, 0.8), 1px -1px 0 rgba(0, 0, 0, 0.8)
	}
}

#content.activate .activateWithFactions .selection label:after {
	background-image: linear-gradient(to bottom, #8fb74f 5%, #add076 13%, #add076 32%, #addd61 48%, #5b7a2a 72%, #618030 93%, #7fa246 100%)
}

#content.activate .activateWithFactions .selection label {
	background-image: linear-gradient(to bottom, #cba467 5%, #f3e2ae 13%, #efbf7b 32%, #aa8050 48%, #835e35 72%, #ad8a54 93%, #d7b672 100%);
	border: 1px solid #34220d;
	border-radius: 4px
}

#content.activate .activateWithFactions .selection label:before {
	content: "";
	position: absolute;
	top: 2px;
	left: 2px;
	bottom: 2px;
	right: 2px;
	background-color: #664e40;
	border: solid 1px #44321d;
	border-radius: 1px
}

#content.activate .activateWithFactions .selection .description {
	background-color: #efe3ca;
	border: 2px solid #beae9a;
	border-radius: 4px;
	padding: 10px;
	box-shadow: 4px 4px 8px 0 rgba(0, 0, 0, 0.5)
}

#content.activate .mobileCover {
	display: none
}

@media screen and (max-width:620px) {
	.mobileOptimized #content.activate .mobileCover {
		display: block;
		position: absolute;
		top: 67px;
		left: 10px;
		bottom: 10px;
		right: 10px;
		background-position: bottom;
		background-color: #f4efe4;
		background-image: url('../../img_rtl/views/activation/withFactions/activateBackground.png')
	}
}

#content.activate .activateWithFactions {
	box-sizing: border-box;
	color: #5e463a;
	margin: -9px -14px -20px;
	padding: 15px 14px;
	position: relative;
	overflow: hidden;
	background-color: #f4efe4;
	background-image: url('../../img_rtl/views/activation/withFactions/activateBackground.png');
	background-position: bottom
}

@media screen and (max-width:620px) {
	.mobileOptimized #content.activate .activateWithFactions {
		background: 0
	}
}

#content.activate .activateWithFactions .steps {
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: 552px 552px 552px;
	grid-template-columns: 552px 552px 552px;
	grid-column-gap: 30px;
	-ms-grid-rows: auto 400px 180px;
	grid-template-rows: auto 400px 180px;
	transition: transform 1000ms ease-in-out
}

.ie #content.activate .activateWithFactions .steps {
	-ms-grid-columns: 582px 582px 582px;
	grid-template-columns: 582px 582px 582px
}

#content.activate .activateWithFactions.selectTribe .steps {
	transform: translateX(0)
}

#content.activate .activateWithFactions.selectFaction .steps {
	transform: translateX(582px)
}

#content.activate .activateWithFactions.confirm .steps {
	transform: translateX(1164px)
}

#content.activate .activateWithFactions .gameVersionOption {
	display: none
}

#content.activate .activateWithFactions h2 {
	font-size: 29px;
	line-height: 1em;
	color: #61332b;
	text-shadow: 1px 0 1px rgba(94, 70, 58, 0.1), 1px 1px 1px rgba(94, 70, 58, 0.1), 0 1px 1px rgba(94, 70, 58, 0.1), -1px 1px 1px rgba(94, 70, 58, 0.1), -1px 0 1px rgba(94, 70, 58, 0.1), -1px -1px 1px rgba(94, 70, 58, 0.1), 0 -1px 1px rgba(94, 70, 58, 0.1), 1px -1px 1px rgba(94, 70, 58, 0.1);
	text-transform: uppercase
}

#content.activate .activateWithFactions .stepDescription {
	font-weight: bold;
	font-size: 15px;
	line-height: 1.2rem;
	margin-bottom: 10px
}

.ie #content.activate .activateWithFactions .stepDescription {
	margin-left: 30px
}

#content.activate .activateWithFactions .selection {
	position: relative;
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: 105px 105px 105px 105px 105px;
	grid-template-columns: 105px 105px 105px 105px 105px;
	-ms-grid-rows: 130px 1fr;
	grid-template-rows: 130px 1fr;
	justify-content: space-between
}

.ie #content.activate .activateWithFactions .selection {
	-ms-grid-columns: 1fr 1fr 1fr 1fr 1fr;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
	margin-left: 30px
}

#content.activate .activateWithFactions .selection input {
	display: none
}

#content.activate .activateWithFactions .selection label {
	display: inline-block;
	-ms-grid-row: 1;
	grid-row-start: 1;
	grid-column-start: auto;
	position: relative;
	transition: filter 150ms
}

#content.activate .activateWithFactions .selection label:nth-of-type(1) {
	-ms-grid-column: 1
}

#content.activate .activateWithFactions .selection label:nth-of-type(2) {
	-ms-grid-column: 2
}

#content.activate .activateWithFactions .selection label:nth-of-type(3) {
	-ms-grid-column: 3
}

#content.activate .activateWithFactions .selection label:nth-of-type(4) {
	-ms-grid-column: 4
}

#content.activate .activateWithFactions .selection label:nth-of-type(5) {
	-ms-grid-column: 5
}

.ie #content.activate .activateWithFactions .selection label {
	width: 103px;
	-ms-grid-column-align: center;
	justify-self: center
}

#content.activate .activateWithFactions .selection label:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	z-index: 1;
	transform: scaleY(0);
	transform-origin: bottom;
	transition-duration: 500ms;
	transition-timing-function: ease-in
}

#content.activate .activateWithFactions .selection label:before {
	z-index: 2;
	transition-duration: 150ms
}

#content.activate .activateWithFactions .selection label:hover {
	cursor: pointer;
	filter: brightness(1.2)
}

#content.activate .activateWithFactions .selection label:active {
	filter: brightness(1.1)
}

#content.activate .activateWithFactions .selection label:active:before {
	box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2) inset, -1px -1px 5px rgba(0, 0, 0, 0.2) inset
}

#content.activate .activateWithFactions .selection .description {
	-ms-grid-row: 2;
	grid-row-start: 2;
	grid-column: 1 / 6;
	-ms-grid-column: 1;
	-ms-grid-column-span: 5;
	position: relative;
	height: 220px;
	margin-top: 25px
}

#content.activate .activateWithFactions .selection .description .optionDescription {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	padding: 20px;
	opacity: 0;
	transition: opacity 400ms ease-out
}

#content.activate .activateWithFactions .selection #selectionIndicator {
	position: absolute;
	top: 150px;
	width: 34px;
	height: 41px;
	background-image: url('../../img_rtl/hud/content/scrollTo.png');
	z-index: 99;
	transform: rotate(90deg);
	transform-origin: right;
	transition: right 500ms ease-in-out
}

#content.activate .activateWithFactions .selection input:checked+label:after {
	transform: scaleY(1)
}

#content.activate .activateWithFactions .selection input:checked+label:hover {
	filter: none;
	cursor: default
}

#content.activate .activateWithFactions .selection input:checked.option0~#selectionIndicator {
	right: 54px
}

#content.activate .activateWithFactions .selection input:checked.option0~.description .option0 {
	opacity: 1
}

#content.activate .activateWithFactions .selection input:checked.option0~.description .option0:before {
	transform: scale(1)
}

#content.activate .activateWithFactions .selection input:checked.option1~#selectionIndicator {
	right: 165px
}

#content.activate .activateWithFactions .selection input:checked.option1~.description .option1 {
	opacity: 1
}

#content.activate .activateWithFactions .selection input:checked.option1~.description .option1:before {
	transform: scale(1)
}

#content.activate .activateWithFactions .selection input:checked.option2~#selectionIndicator {
	right: 276px
}

#content.activate .activateWithFactions .selection input:checked.option2~.description .option2 {
	opacity: 1
}

#content.activate .activateWithFactions .selection input:checked.option2~.description .option2:before {
	transform: scale(1)
}

#content.activate .activateWithFactions .selection input:checked.option3~#selectionIndicator {
	right: 387px
}

#content.activate .activateWithFactions .selection input:checked.option3~.description .option3 {
	opacity: 1
}

#content.activate .activateWithFactions .selection input:checked.option3~.description .option3:before {
	transform: scale(1)
}

#content.activate .activateWithFactions .selection input:checked.option4~#selectionIndicator {
	right: 498px
}

#content.activate .activateWithFactions .selection input:checked.option4~.description .option4 {
	opacity: 1
}

#content.activate .activateWithFactions .selection input:checked.option4~.description .option4:before {
	transform: scale(1)
}

#content.activate .activateWithFactions .buttonWrapper {
	padding: 75px 0 55px;
	text-align: center;
	position: relative
}

.ie #content.activate .activateWithFactions .buttonWrapper {
	margin-left: 30px
}

#content.activate .activateWithFactions .buttonWrapper button {
	height: 50px;
	min-width: 50%;
	font-size: 19px;
	position: absolute;
	right: 50%;
	transform: translateX(50%);
	transition-duration: 1000ms;
	transition-timing-function: ease-in-out
}

#content.activate .activateWithFactions .buttonWrapper.selectTribe button:not(.update),
#content.activate .activateWithFactions .buttonWrapper.selectFaction button:not(.update) {
	opacity: 1;
	pointer-events: auto
}

#content.activate .activateWithFactions .buttonWrapper.selectTribe button.update,
#content.activate .activateWithFactions .buttonWrapper.selectFaction button.update {
	opacity: 0;
	pointer-events: none
}

#content.activate .activateWithFactions.isEditing .buttonWrapper.selectTribe button:not(.update),
#content.activate .activateWithFactions.isEditing .buttonWrapper.selectFaction button:not(.update) {
	opacity: 0;
	pointer-events: none
}

#content.activate .activateWithFactions.isEditing .buttonWrapper.selectTribe button.update,
#content.activate .activateWithFactions.isEditing .buttonWrapper.selectFaction button.update {
	opacity: 1;
	pointer-events: auto
}

#center #contentOuterContainer #content.activate .dynamicTitles {
	height: 62px;
	width: 100%;
	position: absolute;
	overflow: hidden;
	top: 0;
	right: 0
}

#center #contentOuterContainer #content.activate .dynamicTitles>div {
	opacity: 0;
	pointer-events: none;
	transform: translateY(50px);
	transition: opacity 500ms ease-in-out, transform 1000ms ease-in-out;
	position: absolute
}

#center #contentOuterContainer #content.activate .dynamicTitles>div.active {
	opacity: 1;
	pointer-events: auto;
	transform: translateY(0)
}

#center #contentOuterContainer #content.activate .dynamicTitles>div h1.titleInHeader {
	position: relative
}

#content.activate .activateWithFactions .stepDescription.selectTribe {
	-ms-grid-column: 1;
	grid-column-start: 1;
	-ms-grid-row: 1;
	grid-row-start: 1
}

#content.activate .activateWithFactions .selection.selectTribe {
	-ms-grid-column: 1;
	grid-column-start: 1;
	-ms-grid-row: 2;
	grid-row-start: 2
}

#content.activate .activateWithFactions .selection.selectTribe label.tribe1:before {
	background-image: url('../../img_rtl/views/activation/withFactions/selection/tribe/roman.jpg');
	width: 97px;
	height: 122px
}

#content.activate .activateWithFactions .selection.selectTribe label.tribe2:before {
	background-image: url('../../img_rtl/views/activation/withFactions/selection/tribe/teuton.jpg');
	width: 97px;
	height: 122px
}

#content.activate .activateWithFactions .selection.selectTribe label.tribe3:before {
	background-image: url('../../img_rtl/views/activation/withFactions/selection/tribe/gaul.jpg');
	width: 97px;
	height: 122px
}

#content.activate .activateWithFactions .selection.selectTribe label.tribe6:before {
	background-image: url('../../img_rtl/views/activation/withFactions/selection/tribe/egyptian.jpg');
	width: 97px;
	height: 122px
}

#content.activate .activateWithFactions .selection.selectTribe label.tribe7:before {
	background-image: url('../../img_rtl/views/activation/withFactions/selection/tribe/hun.jpg');
	width: 97px;
	height: 122px
}

#content.activate .activateWithFactions .selection.selectTribe .description ul {
	margin-top: 20px;
	padding-right: 30px;
	font-weight: bold;
	list-style: none;
	width: 50%
}

#content.activate .activateWithFactions .selection.selectTribe .description ul li {
	position: relative;
	height: 2em;
	margin-bottom: 15px
}

#content.activate .activateWithFactions .selection.selectTribe .description ul li:before {
	content: "";
	width: 16px;
	height: 16px;
	position: absolute;
	right: -25px;
	transform: scaleX(-1)
}

#content.activate .activateWithFactions .selection.selectTribe .description .recommended {
	position: absolute;
	top: -6px;
	left: 160px;
	background-image: url('../../img_rtl/views/activation/withFactions/recommended.png');
	width: 160px;
	height: 71px;
	text-align: center;
	display: table;
	box-sizing: border-box;
	padding: 23px 12px 18px
}

#content.activate .activateWithFactions .selection.selectTribe .description .recommended .text {
	display: table-cell;
	vertical-align: middle;
	font-size: 12px;
	line-height: 1em;
	text-transform: uppercase;
	color: #efd27e;
	text-shadow: 1px 0 1px #572121, 1px 1px 1px #572121, 0 1px 1px #572121, -1px 1px 1px #572121, -1px 0 1px #572121, -1px -1px 1px #572121, 0 -1px 1px #572121, 1px -1px 1px #572121
}

#content.activate .activateWithFactions .selection.selectTribe .description .optionDescription:before,
#content.activate .activateWithFactions .selection.selectTribe .description .optionDescription:after {
	background-position: bottom left;
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background-repeat: no-repeat
}

#content.activate .activateWithFactions .selection.selectTribe .description .optionDescription:before {
	z-index: 1;
	transition-duration: 250ms;
	transition-delay: 250ms;
	transition-timing-function: ease-in-out;
	transform: scale(0.2);
	transform-origin: bottom left
}

#content.activate .activateWithFactions .selection.selectTribe .description .optionDescription:after {
	z-index: 2
}

#content.activate .activateWithFactions .selection.selectTribe .description .tribe1:before {
	background-image: linear-gradient(45deg, #6e0000, rgba(110, 0, 0, 0) 40%, rgba(110, 0, 0, 0))
}

#content.activate .activateWithFactions .selection.selectTribe .description .tribe1:after {
	background-image: url('../../img_rtl/views/activation/withFactions/preview/tribe/roman.png');
	border-radius: +0 0 3px 3px
}

#content.activate .activateWithFactions .selection.selectTribe .description .tribe1 ul li:before {
	background-image: url('../../img_rtl/units/roman/icon/roman.png')
}

#content.activate .activateWithFactions .selection.selectTribe .description .tribe2:before {
	background-image: linear-gradient(45deg, #023945, rgba(2, 57, 69, 0) 40%, rgba(2, 57, 69, 0))
}

#content.activate .activateWithFactions .selection.selectTribe .description .tribe2:after {
	background-image: url('../../img_rtl/views/activation/withFactions/preview/tribe/teuton.png');
	border-radius: +0 0 3px 3px
}

#content.activate .activateWithFactions .selection.selectTribe .description .tribe2 ul li:before {
	background-image: url('../../img_rtl/units/teuton/icon/teuton.png')
}

#content.activate .activateWithFactions .selection.selectTribe .description .tribe3:before {
	background-image: linear-gradient(45deg, #b14b0d, rgba(177, 75, 13, 0) 40%, rgba(177, 75, 13, 0))
}

#content.activate .activateWithFactions .selection.selectTribe .description .tribe3:after {
	background-image: url('../../img_rtl/views/activation/withFactions/preview/tribe/gaul.png');
	border-radius: +0 0 3px 3px
}

#content.activate .activateWithFactions .selection.selectTribe .description .tribe3 ul li:before {
	background-image: url('../../img_rtl/units/gaul/icon/gaul.png')
}

#content.activate .activateWithFactions .selection.selectTribe .description .tribe6:before {
	background-image: linear-gradient(45deg, #132f84, rgba(19, 47, 132, 0) 40%, rgba(19, 47, 132, 0))
}

#content.activate .activateWithFactions .selection.selectTribe .description .tribe6:after {
	background-image: url('../../img_rtl/views/activation/withFactions/preview/tribe/egyptian.png');
	border-radius: +0 0 3px 3px
}

#content.activate .activateWithFactions .selection.selectTribe .description .tribe6 ul li:before {
	background-image: url('../../img_rtl/units/egyptian/icon/egyptian.png')
}

#content.activate .activateWithFactions .selection.selectTribe .description .tribe7:before {
	background-image: linear-gradient(45deg, #1d001c, rgba(29, 0, 28, 0) 40%, rgba(29, 0, 28, 0))
}

#content.activate .activateWithFactions .selection.selectTribe .description .tribe7:after {
	background-image: url('../../img_rtl/views/activation/withFactions/preview/tribe/hun.png');
	border-radius: +0 0 3px 3px
}

#content.activate .activateWithFactions .selection.selectTribe .description .tribe7 ul li:before {
	background-image: url('../../img_rtl/units/hun/icon/hun.png')
}

#content.activate .activateWithFactions .buttonWrapper.selectTribe {
	-ms-grid-column: 1;
	grid-column-start: 1;
	-ms-grid-row: 3;
	grid-row-start: 3
}

#content.activate .activateWithFactions .stepDescription.selectFaction {
	-ms-grid-column: 2;
	grid-column-start: 2;
	-ms-grid-row: 1;
	grid-row-start: 1
}

#content.activate .activateWithFactions .selection.selectFaction {
	-ms-grid-column: 2;
	grid-column-start: 2;
	-ms-grid-row: 2;
	grid-row-start: 2
}

#content.activate .activateWithFactions .selection.selectFaction label.empire:before {
	background-image: url('../../img_rtl/factions/80x112/empire.png'), linear-gradient(to bottom, #dad3c3, #a39b87);
	background-size: 80px 122px, 100%;
	background-position: center;
	background-repeat: no-repeat
}

#content.activate .activateWithFactions .selection.selectFaction label.marauders:before {
	background-image: url('../../img_rtl/factions/80x112/marauders.png'), linear-gradient(to bottom, #dad3c3, #a39b87);
	background-size: 80px 122px, 100%;
	background-position: center;
	background-repeat: no-repeat
}

#content.activate .activateWithFactions .selection.selectFaction label.rebels:before {
	background-image: url('../../img_rtl/factions/80x112/rebels.png'), linear-gradient(to bottom, #dad3c3, #a39b87);
	background-size: 80px 122px, 100%;
	background-position: center;
	background-repeat: no-repeat
}

#content.activate .activateWithFactions .selection.selectFaction label.dynasty:before {
	background-image: url('../../img_rtl/factions/80x112/dynasty.png'), linear-gradient(to bottom, #dad3c3, #a39b87);
	background-size: 80px 122px, 100%;
	background-position: center;
	background-repeat: no-repeat
}

#content.activate .activateWithFactions .selection.selectFaction label.horde:before {
	background-image: url('../../img_rtl/factions/80x112/horde.png'), linear-gradient(to bottom, #dad3c3, #a39b87);
	background-size: 80px 122px, 100%;
	background-position: center;
	background-repeat: no-repeat
}

#content.activate .activateWithFactions .selection.selectFaction .description .optionDescription {
	padding-left: 265px
}

#content.activate .activateWithFactions .selection.selectFaction .description .optionDescription:before,
#content.activate .activateWithFactions .selection.selectFaction .description .optionDescription:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: auto;
	border-radius: +0 0 3px 3px
}

#content.activate .activateWithFactions .selection.selectFaction .description .optionDescription:before {
	background-image: url('../../img_rtl/views/activation/withFactions/preview/faction/base.jpg');
	width: 240px;
	height: 240px
}

#content.activate .activateWithFactions .selection.selectFaction .description .optionDescription.empire:after {
	background-image: url('../../img_rtl/views/activation/withFactions/preview/faction/empire.png');
	width: 240px;
	height: 240px;
	animation: spawnAnimation 400ms steps(6) forwards 250ms
}

#content.activate .activateWithFactions .selection.selectFaction .description .optionDescription.marauders:after {
	background-image: url('../../img_rtl/views/activation/withFactions/preview/faction/marauders.png');
	width: 240px;
	height: 240px;
	animation: spawnAnimation 400ms steps(6) forwards 250ms
}

#content.activate .activateWithFactions .selection.selectFaction .description .optionDescription.rebels:after {
	background-image: url('../../img_rtl/views/activation/withFactions/preview/faction/rebels.png');
	width: 240px;
	height: 240px;
	animation: spawnAnimation 400ms steps(6) forwards 250ms
}

#content.activate .activateWithFactions .selection.selectFaction .description .optionDescription.dynasty:after {
	background-image: url('../../img_rtl/views/activation/withFactions/preview/faction/dynasty.png');
	width: 240px;
	height: 240px;
	animation: spawnAnimation 400ms steps(6) forwards 250ms
}

#content.activate .activateWithFactions .selection.selectFaction .description .optionDescription.horde:after {
	background-image: url('../../img_rtl/views/activation/withFactions/preview/faction/horde.png');
	width: 240px;
	height: 240px;
	animation: spawnAnimation 400ms steps(6) forwards 250ms
}

@keyframes spawnAnimation {
	100% {
		background-position: 0 -1440px
	}
}

#content.activate .activateWithFactions .selection.selectFaction input:not(:checked).option0~.description .option0:after {
	animation: none
}

#content.activate .activateWithFactions .selection.selectFaction input:not(:checked).option1~.description .option1:after {
	animation: none
}

#content.activate .activateWithFactions .selection.selectFaction input:not(:checked).option2~.description .option2:after {
	animation: none
}

#content.activate .activateWithFactions .selection.selectFaction input:not(:checked).option3~.description .option3:after {
	animation: none
}

#content.activate .activateWithFactions .selection.selectFaction input:not(:checked).option4~.description .option4:after {
	animation: none
}

#content.activate .activateWithFactions .buttonWrapper.selectFaction {
	-ms-grid-column: 2;
	grid-column-start: 2;
	-ms-grid-row: 3;
	grid-row-start: 3
}

#content.activate .activateWithFactions .stepDescription.confirm {
	-ms-grid-column: 3;
	grid-column-start: 3;
	-ms-grid-row: 1;
	grid-row-start: 1
}

#content.activate .activateWithFactions .selection.confirm {
	-ms-grid-column: 3;
	grid-column-start: 3;
	-ms-grid-row: 2;
	grid-row-start: 2;
	-ms-grid-columns: 1fr 1fr;
	grid-template-columns: 1fr 1fr;
	-ms-grid-rows: 1fr;
	grid-template-rows: 1fr
}

#content.activate .activateWithFactions .selection.confirm .confirmTribe,
#content.activate .activateWithFactions .selection.confirm .confirmFaction {
	display: none;
	border: 2px solid #beae9a;
	border-radius: 4px;
	background-color: #efe3ca;
	box-shadow: 4px 4px 8px 0 rgba(0, 0, 0, 0.5);
	position: relative;
	text-align: center;
	width: 220px;
	height: 374px
}

#content.activate .activateWithFactions .selection.confirm .confirmTribe h2,
#content.activate .activateWithFactions .selection.confirm .confirmFaction h2 {
	padding: 10px 5px 0;
	text-shadow: 1px 0 1px rgba(94, 70, 58, 0.1), 1px 1px 1px rgba(94, 70, 58, 0.1), 0 1px 1px rgba(94, 70, 58, 0.1), -1px 1px 1px rgba(94, 70, 58, 0.1), -1px 0 1px rgba(94, 70, 58, 0.1), -1px -1px 1px rgba(94, 70, 58, 0.1), 0 -1px 1px rgba(94, 70, 58, 0.1), 1px -1px 1px rgba(94, 70, 58, 0.1), 2px 0 5px #efe3ca, 2px 2px 5px #efe3ca, 0 2px 5px #efe3ca, -2px 2px 5px #efe3ca, -2px 0 5px #efe3ca, -2px -2px 5px #efe3ca, 0 -2px 5px #efe3ca, 2px -2px 5px #efe3ca
}

#content.activate .activateWithFactions .selection.confirm .confirmTribe a,
#content.activate .activateWithFactions .selection.confirm .confirmFaction a {
	position: absolute;
	top: auto;
	left: 0;
	bottom: 0;
	right: 0;
	padding: 10px 0;
	text-shadow: 2px 0 5px #efe3ca, 2px 2px 5px #efe3ca, 0 2px 5px #efe3ca, -2px 2px 5px #efe3ca, -2px 0 5px #efe3ca, -2px -2px 5px #efe3ca, 0 -2px 5px #efe3ca, 2px -2px 5px #efe3ca
}

#content.activate .activateWithFactions .selection.confirm .confirmTribe.selected,
#content.activate .activateWithFactions .selection.confirm .confirmFaction.selected {
	display: block
}

#content.activate .activateWithFactions .selection.confirm .confirmTribe {
	-ms-grid-row: 1;
	grid-row-start: 1;
	-ms-grid-column: 1;
	grid-column-start: 1;
	-ms-grid-column-align: center;
	justify-self: center
}

#content.activate .activateWithFactions .selection.confirm .confirmTribe.tribe1 {
	background-image: url('../../img_rtl/views/activation/withFactions/summary/tribe/roman.png');
	background-size: 220px 374px;
	background-position: bottom
}

#content.activate .activateWithFactions .selection.confirm .confirmTribe.tribe2 {
	background-image: url('../../img_rtl/views/activation/withFactions/summary/tribe/teuton.png');
	background-size: 220px 374px;
	background-position: bottom
}

#content.activate .activateWithFactions .selection.confirm .confirmTribe.tribe3 {
	background-image: url('../../img_rtl/views/activation/withFactions/summary/tribe/gaul.png');
	background-size: 220px 374px;
	background-position: bottom
}

#content.activate .activateWithFactions .selection.confirm .confirmTribe.tribe6 {
	background-image: url('../../img_rtl/views/activation/withFactions/summary/tribe/egyptian.png');
	background-size: 220px 374px;
	background-position: bottom
}

#content.activate .activateWithFactions .selection.confirm .confirmTribe.tribe7 {
	background-image: url('../../img_rtl/views/activation/withFactions/summary/tribe/hun.png');
	background-size: 220px 374px;
	background-position: bottom
}

#content.activate .activateWithFactions .selection.confirm .confirmFaction {
	-ms-grid-row: 1;
	grid-row-start: 1;
	-ms-grid-column: 2;
	grid-column-start: 2;
	-ms-grid-column-align: center;
	justify-self: center
}

#content.activate .activateWithFactions .selection.confirm .confirmFaction.empire {
	background-position: center 65px;
	background-repeat: no-repeat;
	background-image: url('../../img_rtl/factions/193x270/empire.png');
	background-size: 193px 270px
}

#content.activate .activateWithFactions .selection.confirm .confirmFaction.marauders {
	background-position: center 65px;
	background-repeat: no-repeat;
	background-image: url('../../img_rtl/factions/193x270/marauders.png');
	background-size: 193px 270px
}

#content.activate .activateWithFactions .selection.confirm .confirmFaction.rebels {
	background-position: center 65px;
	background-repeat: no-repeat;
	background-image: url('../../img_rtl/factions/193x270/rebels.png');
	background-size: 193px 270px
}

#content.activate .activateWithFactions .selection.confirm .confirmFaction.dynasty {
	background-position: center 65px;
	background-repeat: no-repeat;
	background-image: url('../../img_rtl/factions/193x270/dynasty.png');
	background-size: 193px 270px
}

#content.activate .activateWithFactions .selection.confirm .confirmFaction.horde {
	background-position: center 65px;
	background-repeat: no-repeat;
	background-image: url('../../img_rtl/factions/193x270/horde.png');
	background-size: 193px 270px
}

#content.activate .activateWithFactions .buttonWrapper.confirm {
	-ms-grid-column: 3;
	grid-column-start: 3;
	-ms-grid-row: 3;
	grid-row-start: 3
}

#regionalOverviewWithFactions .regionalOverviewWrapper {
	display: -ms-grid;
	display: grid;
	-ms-grid-rows: auto 1fr;
	grid-template-rows: auto 1fr;
	-ms-grid-columns: 1fr 20px 187px;
	grid-template-columns: 1fr 20px 187px
}

#regionalOverviewWithFactions .regionalOverviewWrapper table.regionDetails {
	-ms-grid-row: 1;
	grid-row-start: 1;
	-ms-grid-column: 1;
	grid-column-start: 1
}

#regionalOverviewWithFactions .regionalOverviewWrapper table.regionDetails tbody th,
#regionalOverviewWithFactions .regionalOverviewWrapper table.regionDetails tbody td {
	vertical-align: top;
	width: 50%
}

#regionalOverviewWithFactions .regionalOverviewWrapper table.regionDetails tbody td {
	font-weight: bold
}

#regionalOverviewWithFactions .regionalOverviewWrapper table.regionDetails th.villageSettled {
	padding-left: 31px
}

#regionalOverviewWithFactions .regionalOverviewWrapper table.regionDetails a.regionSettleIcon {
	display: inline-block;
	background-image: url('../../img_rtl/region/icons/region_info_icon.png');
	width: 22px;
	height: 22px;
	vertical-align: middle
}

#regionalOverviewWithFactions .regionalOverviewWrapper .progressBarContainer {
	-ms-grid-row: 2;
	grid-row-start: 2;
	-ms-grid-column: 1;
	grid-column-start: 1;
	margin: 10px 0 0 9px
}

#regionalOverviewWithFactions .regionalOverviewWrapper .regionMapContainer {
	grid-row: 1 / 3;
	-ms-grid-row: 1;
	-ms-grid-row-span: 2;
	-ms-grid-column: 3;
	grid-column-start: 3;
	display: block;
	float: left;
	border: 1px solid #333;
	border-radius: 3px;
	position: relative;
	width: 185px;
	height: 185px
}

#regionalOverviewWithFactions .regionalOverviewWrapper .regionMapContainer:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	z-index: 2;
	border-radius: 3px;
	background-image: url('../../img_rtl/region/regionDetailsMap_small.png');
	width: 185px;
	height: 185px
}

#regionalOverviewWithFactions .regionalOverviewWrapper .regionMapContainer img {
	border-radius: 3px
}

#regionalOverviewWithFactions .regionalOverviewWrapper .regionMapContainer svg.regionsInEurope {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	z-index: 3
}

#regionalOverviewWithFactions .ancientPowerStatus {
	margin: 10px 0 15px;
	padding: 10px;
	background-color: #f9fbf4;
	border: 1px solid #a1bc79;
	border-radius: 5px
}

#regionalOverviewWithFactions .controllingFactionEmblems {
	margin: 20px 0 10px;
	display: -ms-grid;
	display: grid;
	justify-content: space-between
}

#regionalOverviewWithFactions .controllingFactionEmblems .faction {
	-ms-grid-row: 1;
	grid-row-start: 1;
	-ms-grid-column-align: end;
	justify-self: end;
	position: relative;
	box-sizing: border-box;
	border: 1px solid #333;
	border-radius: 5px;
	box-shadow: 1px 1px 1px rgba(51, 51, 51, 0.6)
}

.ie #regionalOverviewWithFactions .controllingFactionEmblems .faction:nth-child(1) {
	-ms-grid-column: 1
}

.ie #regionalOverviewWithFactions .controllingFactionEmblems .faction:nth-child(3) {
	-ms-grid-column: 2
}

.ie #regionalOverviewWithFactions .controllingFactionEmblems .faction:nth-child(5) {
	-ms-grid-column: 3
}

.ie #regionalOverviewWithFactions .controllingFactionEmblems .faction:nth-child(7) {
	-ms-grid-column: 4
}

.ie #regionalOverviewWithFactions .controllingFactionEmblems .faction:nth-child(9) {
	-ms-grid-column: 5
}

#regionalOverviewWithFactions .controllingFactionEmblems .faction:after {
	content: "";
	position: absolute;
	top: 2px;
	left: 2px;
	bottom: 2px;
	right: 2px;
	z-index: 1;
	background-image: linear-gradient(to bottom, #dad3c3, #a39b87)
}

#regionalOverviewWithFactions .controllingFactionEmblems .faction .emblem {
	position: absolute;
	top: 2px;
	left: 2px;
	bottom: 2px;
	right: 2px;
	z-index: 2;
	background-position: center;
	background-repeat: no-repeat
}

#regionalOverviewWithFactions .controllingFactionEmblems .faction .proportionalInfluence {
	position: absolute;
	top: 2px;
	left: 2px;
	bottom: auto;
	right: 2px;
	z-index: 3;
	text-align: center;
	background-color: rgba(255, 255, 255, 0.7)
}

#regionalOverviewWithFactions .controllingFactionEmblems .faction .rankIndicator {
	position: absolute;
	z-index: 4;
	right: 50%;
	transform: translate(50%, -50%);
	font-family: IRANSans;
	font-size: 16px;
	color: #5e463a;
	width: 28px;
	height: 28px;
	line-height: 28px;
	border: 1px solid #333;
	border-radius: 50%;
	text-align: center
}

#regionalOverviewWithFactions .controllingFactionEmblems .faction.rank1 {
	background-image: linear-gradient(to bottom, #d7b672 0, #835e35 30.73%, #aa8050 48.96%, #efbf7b 67.71%, #f3e2ae 82.81%, #cba467 100%)
}

#regionalOverviewWithFactions .controllingFactionEmblems .faction.rank1 .rankIndicator {
	background-image: linear-gradient(-142deg, #f3e2ae 18%, #d7b672 81%)
}

#regionalOverviewWithFactions .controllingFactionEmblems .faction.rank2 {
	background-image: linear-gradient(to bottom, #e9e7e4 0, #696969 30.73%, #ababab 48.96%, #eaeaea 67.71%, #f6f6f6 82.81%, #cdcdcd 100%)
}

#regionalOverviewWithFactions .controllingFactionEmblems .faction.rank2 .rankIndicator {
	background-image: linear-gradient(-142deg, #f4f4f4 18%, #c6c6c6 81%)
}

#regionalOverviewWithFactions .controllingFactionEmblems .faction.rank3 {
	background-image: linear-gradient(to bottom, #ffc58f 0, #8c5a2b 30.73%, #d18946 48.96%, #f0b37b 67.71%, #fbac63 82.81%, #cf9158 100%)
}

#regionalOverviewWithFactions .controllingFactionEmblems .faction.rank3 .rankIndicator {
	background-image: linear-gradient(-142deg, #efc7a2 18%, #d18641 81%)
}

#regionalOverviewWithFactions .controllingFactionEmblems .faction.rank4 {
	background-image: linear-gradient(to bottom, #d3dde5 0, #5e6b75 30.73%, #8999a4 48.96%, #919da5 67.71%, #b3bfc8 82.81%, #596b78 100%)
}

#regionalOverviewWithFactions .controllingFactionEmblems .faction.rank4 .rankIndicator {
	background-image: linear-gradient(-142deg, #d2dde4 18%, #8a959d 81%)
}

#regionalOverviewWithFactions .controllingFactionEmblems .faction.rank5 {
	background-image: linear-gradient(to bottom, #e3c7be 0, #96827c 30.73%, #b49d96 48.96%, #ebd3cc 67.71%, #d1c0bb 82.81%, #6b5d59 100%)
}

#regionalOverviewWithFactions .controllingFactionEmblems .faction.rank5 .rankIndicator {
	background-image: linear-gradient(-142deg, #e4c8bf 18%, #927268 81%)
}

.ie #regionalOverviewWithFactions .controllingFactionEmblems .faction {
	-ms-grid-column-align: center;
	justify-self: center
}

#regionalOverviewWithFactions .controllingFactionEmblems .influence {
	-ms-grid-row: 2;
	grid-row-start: 2;
	-ms-grid-column-align: center;
	justify-self: center;
	font-size: 17px;
	font-weight: bold;
	padding-top: 20px
}

.ie #regionalOverviewWithFactions .controllingFactionEmblems .influence:nth-child(2) {
	-ms-grid-column: 1
}

.ie #regionalOverviewWithFactions .controllingFactionEmblems .influence:nth-child(4) {
	-ms-grid-column: 2
}

.ie #regionalOverviewWithFactions .controllingFactionEmblems .influence:nth-child(6) {
	-ms-grid-column: 3
}

.ie #regionalOverviewWithFactions .controllingFactionEmblems .influence:nth-child(8) {
	-ms-grid-column: 4
}

.ie #regionalOverviewWithFactions .controllingFactionEmblems .influence:nth-child(10) {
	-ms-grid-column: 5
}

#regionalOverviewWithFactions .controllingFactionEmblems.count1 {
	-ms-grid-columns: (1fr)[1];
	grid-template-columns: repeat(1, 175px);
	-ms-grid-rows: 245px 1fr;
	grid-template-rows: 245px 1fr
}

#regionalOverviewWithFactions .controllingFactionEmblems.count1 .faction {
	width: 175px;
	height: 245px
}

#regionalOverviewWithFactions .controllingFactionEmblems.count2 {
	-ms-grid-columns: (1fr)[2];
	grid-template-columns: repeat(2, 175px);
	-ms-grid-rows: 245px 1fr;
	grid-template-rows: 245px 1fr
}

#regionalOverviewWithFactions .controllingFactionEmblems.count2 .faction {
	width: 175px;
	height: 245px
}

#regionalOverviewWithFactions .controllingFactionEmblems.count3 {
	-ms-grid-columns: (1fr)[3];
	grid-template-columns: repeat(3, 175px);
	-ms-grid-rows: 245px 1fr;
	grid-template-rows: 245px 1fr
}

#regionalOverviewWithFactions .controllingFactionEmblems.count3 .faction {
	width: 175px;
	height: 245px
}

#regionalOverviewWithFactions .controllingFactionEmblems.count4 {
	-ms-grid-columns: (1fr)[4];
	grid-template-columns: repeat(4, 132px);
	-ms-grid-rows: 185px 1fr;
	grid-template-rows: 185px 1fr
}

#regionalOverviewWithFactions .controllingFactionEmblems.count4 .faction {
	width: 132px;
	height: 185px
}

#regionalOverviewWithFactions .controllingFactionEmblems.count5 {
	-ms-grid-columns: (1fr)[5];
	grid-template-columns: repeat(5, 106px);
	-ms-grid-rows: 148px 1fr;
	grid-template-rows: 148px 1fr
}

#regionalOverviewWithFactions .controllingFactionEmblems.count5 .faction {
	width: 106px;
	height: 148px
}

#regionalOverviewWithFactions .controllingFactionEmblems.count1 {
	margin-top: 30px
}

#regionalOverviewWithFactions .controllingFactionEmblems.count1 .faction:before {
	content: "";
	position: absolute;
	top: -23px;
	left: -189px;
	bottom: -10px;
	right: -189px;
	z-index: 1;
	border-style: solid;
	border-width: 22px 188px 9px 188px;
	border-image: url('../../img_rtl/views/regionOverview/monopolDecoration.png') 22 188 9 188 space
}

.ie #regionalOverviewWithFactions .controllingFactionEmblems.count1 .faction:before {
	direction: ltr
}

#regionalOverviewWithFactions .controllingFactionEmblems.count1,
#regionalOverviewWithFactions .controllingFactionEmblems.count2 {
	justify-content: center
}

#regionalOverviewWithFactions .controllingFactionEmblems.count2 {
	grid-column-gap: 20px
}

.ie #regionalOverviewWithFactions .controllingFactionEmblems.count2 {
	margin: 0 75px
}

#regionalOverviewWithFactions .controllingFactionEmblems.count1 .faction.empire .emblem,
#regionalOverviewWithFactions .controllingFactionEmblems.count2 .faction.empire .emblem,
#regionalOverviewWithFactions .controllingFactionEmblems.count3 .faction.empire .emblem {
	background-image: url('../../img_rtl/factions/135x189/empire.png');
	background-size: 135px 189px
}

#regionalOverviewWithFactions .controllingFactionEmblems.count1 .faction.marauders .emblem,
#regionalOverviewWithFactions .controllingFactionEmblems.count2 .faction.marauders .emblem,
#regionalOverviewWithFactions .controllingFactionEmblems.count3 .faction.marauders .emblem {
	background-image: url('../../img_rtl/factions/135x189/marauders.png');
	background-size: 135px 189px
}

#regionalOverviewWithFactions .controllingFactionEmblems.count1 .faction.rebels .emblem,
#regionalOverviewWithFactions .controllingFactionEmblems.count2 .faction.rebels .emblem,
#regionalOverviewWithFactions .controllingFactionEmblems.count3 .faction.rebels .emblem {
	background-image: url('../../img_rtl/factions/135x189/rebels.png');
	background-size: 135px 189px
}

#regionalOverviewWithFactions .controllingFactionEmblems.count1 .faction.dynasty .emblem,
#regionalOverviewWithFactions .controllingFactionEmblems.count2 .faction.dynasty .emblem,
#regionalOverviewWithFactions .controllingFactionEmblems.count3 .faction.dynasty .emblem {
	background-image: url('../../img_rtl/factions/135x189/dynasty.png');
	background-size: 135px 189px
}

#regionalOverviewWithFactions .controllingFactionEmblems.count1 .faction.horde .emblem,
#regionalOverviewWithFactions .controllingFactionEmblems.count2 .faction.horde .emblem,
#regionalOverviewWithFactions .controllingFactionEmblems.count3 .faction.horde .emblem {
	background-image: url('../../img_rtl/factions/135x189/horde.png');
	background-size: 135px 189px
}

#regionalOverviewWithFactions .controllingFactionEmblems.count4 .faction.empire .emblem {
	background-image: url('../../img_rtl/factions/100x140/empire.png');
	background-size: 100px 140px
}

#regionalOverviewWithFactions .controllingFactionEmblems.count4 .faction.marauders .emblem {
	background-image: url('../../img_rtl/factions/100x140/marauders.png');
	background-size: 100px 140px
}

#regionalOverviewWithFactions .controllingFactionEmblems.count4 .faction.rebels .emblem {
	background-image: url('../../img_rtl/factions/100x140/rebels.png');
	background-size: 100px 140px
}

#regionalOverviewWithFactions .controllingFactionEmblems.count4 .faction.dynasty .emblem {
	background-image: url('../../img_rtl/factions/100x140/dynasty.png');
	background-size: 100px 140px
}

#regionalOverviewWithFactions .controllingFactionEmblems.count4 .faction.horde .emblem {
	background-image: url('../../img_rtl/factions/100x140/horde.png');
	background-size: 100px 140px
}

#regionalOverviewWithFactions .controllingFactionEmblems.count5 .faction.empire .emblem {
	background-image: url('../../img_rtl/factions/80x112/empire.png');
	background-size: 80px 122px
}

#regionalOverviewWithFactions .controllingFactionEmblems.count5 .faction.marauders .emblem {
	background-image: url('../../img_rtl/factions/80x112/marauders.png');
	background-size: 80px 122px
}

#regionalOverviewWithFactions .controllingFactionEmblems.count5 .faction.rebels .emblem {
	background-image: url('../../img_rtl/factions/80x112/rebels.png');
	background-size: 80px 122px
}

#regionalOverviewWithFactions .controllingFactionEmblems.count5 .faction.dynasty .emblem {
	background-image: url('../../img_rtl/factions/80x112/dynasty.png');
	background-size: 80px 122px
}

#regionalOverviewWithFactions .controllingFactionEmblems.count5 .faction.horde .emblem {
	background-image: url('../../img_rtl/factions/80x112/horde.png');
	background-size: 80px 122px
}

#regionalOverviewWithFactions .controllingFactionAlliances {
	font-size: 14px
}

#regionalOverviewWithFactions .controllingFactionAlliances:before {
	border-radius: 3px;
	border-color: #beae9a
}

#regionalOverviewWithFactions .controllingFactionAlliances th.population,
#regionalOverviewWithFactions .controllingFactionAlliances th.villages,
#regionalOverviewWithFactions .controllingFactionAlliances th.territorialControl,
#regionalOverviewWithFactions .controllingFactionAlliances td.population,
#regionalOverviewWithFactions .controllingFactionAlliances td.villages,
#regionalOverviewWithFactions .controllingFactionAlliances td.territorialControl {
	text-align: left;
	width: 15%
}

#regionalOverviewWithFactions .controllingFactionAlliances thead th {
	white-space: nowrap
}

#regionalOverviewWithFactions .controllingFactionAlliances tbody th,
#regionalOverviewWithFactions .controllingFactionAlliances tbody td {
	padding: 0 10px;
	line-height: 1em
}

#regionalOverviewWithFactions .controllingFactionAlliances tbody th {
	font-size: 21px;
	text-align: right;
	border-bottom: 0;
	position: relative;
	height: calc(2.6em + 1px)
}

#regionalOverviewWithFactions .controllingFactionAlliances tbody th .faction {
	position: absolute;
	top: 1px;
	left: -9px;
	bottom: 0;
	right: -9px;
	height: 2.6em;
	background-color: #f3f1ee;
	border-top: 1px solid #beae9a;
	border-bottom: 1px solid #beae9a;
	display: -ms-grid;
	display: grid;
	-ms-grid-rows: 1fr;
	grid-template-rows: 1fr;
	-ms-grid-columns: 3em 1.5fr .5fr;
	grid-template-columns: 3em 1.5fr .5fr
}

#regionalOverviewWithFactions .controllingFactionAlliances tbody th .faction>div {
	-ms-grid-row-align: center;
	align-self: center;
	padding: .8em 18px;
	height: 1em
}

#regionalOverviewWithFactions .controllingFactionAlliances tbody th .faction .rankIndicator {
	-ms-grid-column: 1;
	grid-column-start: 1;
	text-align: center;
	font-family: IRANSans;
	border-left: 1px solid #beae9a
}

#regionalOverviewWithFactions .controllingFactionAlliances tbody th .faction .rankIndicator.rank1 {
	background-image: linear-gradient(-142deg, #f3e2ae 18%, #d7b672 81%)
}

#regionalOverviewWithFactions .controllingFactionAlliances tbody th .faction .rankIndicator.rank2 {
	background-image: linear-gradient(-142deg, #f4f4f4 18%, #c6c6c6 81%)
}

#regionalOverviewWithFactions .controllingFactionAlliances tbody th .faction .rankIndicator.rank3 {
	background-image: linear-gradient(-142deg, #efc7a2 18%, #d18641 81%)
}

#regionalOverviewWithFactions .controllingFactionAlliances tbody th .faction .rankIndicator.rank4 {
	background-image: linear-gradient(-142deg, #d2dde4 18%, #8a959d 81%)
}

#regionalOverviewWithFactions .controllingFactionAlliances tbody th .faction .rankIndicator.rank5 {
	background-image: linear-gradient(-142deg, #e4c8bf 18%, #927268 81%)
}

#regionalOverviewWithFactions .controllingFactionAlliances tbody th .faction .proportionalInfluence {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 3em;
	height: auto;
	z-index: 1
}

#regionalOverviewWithFactions .controllingFactionAlliances tbody th .faction .proportionalInfluence .bar {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background-color: #efe2cc
}

#regionalOverviewWithFactions .controllingFactionAlliances tbody th .faction .factionName {
	-ms-grid-column: 2;
	grid-column-start: 2;
	font-weight: bold;
	position: relative;
	z-index: 2
}

#regionalOverviewWithFactions .controllingFactionAlliances tbody th .faction .influence {
	-ms-grid-column: 3;
	grid-column-start: 3;
	font-weight: bold;
	text-align: left;
	position: relative;
	z-index: 2
}

#regionalOverviewWithFactions .controllingFactionAlliances tbody:first-of-type th .faction {
	border-radius: 3px 3px 0 0;
	border-top: 0
}

#regionalOverviewWithFactions .controllingFactionAlliances tbody td.alliance {
	max-width: 1px
}

#regionalOverviewWithFactions .controllingFactionAlliances tbody td.alliance td.alliance {
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	direction: rtl
}

#factionProfile .factionHeader {
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: 1fr 20px 258px;
	grid-template-columns: 1fr 20px 258px
}

#factionProfile .factionHeader table {
	-ms-grid-column: 1;
	grid-column-start: 1;
	-ms-grid-row: 1;
	grid-row-start: 1;
	-ms-grid-row-align: start;
	align-self: start
}

#factionProfile .factionHeader .factionEmblem {
	width: 256px;
	height: 256px;
	position: relative;
	-ms-grid-column: 3;
	grid-column-start: 3;
	-ms-grid-row: 1;
	grid-row-start: 1;
	border: 1px solid #333;
	justify-self: end;
	border-radius: 3px;
	background-image: linear-gradient(to bottom, #dad3c3, #a39b87)
}

#factionProfile .factionHeader .factionEmblem:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	z-index: 1;
	background-position: center;
	background-repeat: no-repeat
}

#factionProfile .factionHeader .factionEmblem.empire:after {
	background-image: url('../../img_rtl/factions/164x230/empire.png');
	background-size: 164px 230px
}

#factionProfile .factionHeader .factionEmblem.marauders:after {
	background-image: url('../../img_rtl/factions/164x230/marauders.png');
	background-size: 164px 230px
}

#factionProfile .factionHeader .factionEmblem.rebels:after {
	background-image: url('../../img_rtl/factions/164x230/rebels.png');
	background-size: 164px 230px
}

#factionProfile .factionHeader .factionEmblem.dynasty:after {
	background-image: url('../../img_rtl/factions/164x230/dynasty.png');
	background-size: 164px 230px
}

#factionProfile .factionHeader .factionEmblem.horde:after {
	background-image: url('../../img_rtl/factions/164x230/horde.png');
	background-size: 164px 230px
}

#factionProfile .factionHeader #regionMapContainer {
	width: 256px;
	height: 256px;
	-ms-grid-column: 3;
	grid-column-start: 3;
	-ms-grid-row: 1;
	grid-row-start: 1;
	border: 1px solid #333;
	border-radius: 3px;
	position: relative
}

#factionProfile .factionHeader #regionMapContainer:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	z-index: 2;
	border-radius: 3px;
	background-image: url('../../img_rtl/region/regionDetailsMap_big.png');
	width: 256px;
	height: 256px
}

#factionProfile .factionHeader #regionMapContainer img {
	position: absolute;
	border-radius: 3px;
	z-index: 1
}

#factionProfile .factionHeader #regionMapContainer svg {
	width: 256px;
	height: 256px;
	position: absolute;
	z-index: 3
}

#factionProfile .factionHeader #regionMapContainer svg g {
	cursor: pointer;
	transition-duration: 150ms;
	stroke: transparent;
	stroke-width: 2px
}

#factionProfile .factionHeader #regionMapContainer svg g.active {
	fill: #991915;
	stroke: #f8c000
}

#factionProfile .factionHeader #regionMapContainer svg g:hover {
	stroke: #f2f2f2
}

#factionProfile .factionHeader #regionMapContainer svg g.highlight {
	stroke: #f2f2f2;
	filter: url("#regionBrightness")
}

#factionProfile .factionHeader #regionMapContainer svg g.copyFront {
	pointer-events: none
}

#factionProfile .tabNavi {
	margin-top: 20px
}

#factionProfile .paginator {
	text-align: left;
	margin-top: 10px
}

#factionProfile #alliancesInFaction .alliance {
	text-align: right
}

#factionProfile #alliancesInFaction .victoryPoints,
#factionProfile #alliancesInFaction .members {
	text-align: left
}

#factionProfile #alliancesInFaction th,
#factionProfile #alliancesInFaction td {
	padding: 6px 9px 3px
}

#factionVictoryStatistics {
	position: relative
}

#factionVictoryStatistics:before {
	content: "";
	position: absolute;
	top: -19px;
	left: -6px;
	bottom: -10px;
	right: -6px;
	background-color: #768483;
	background-image: url('../../img_rtl/views/statistics/factionVictory/podium.jpg');
	background-repeat: no-repeat
}

#factionVictoryStatistics .podium {
	height: 420px
}

#factionVictoryStatistics .podium .emblem {
	position: absolute
}

#factionVictoryStatistics .podium .emblem.empire {
	background-image: url('../../img_rtl/factions/193x270/empire.png');
	width: 193px;
	height: 270px
}

#factionVictoryStatistics .podium .emblem.marauders {
	background-image: url('../../img_rtl/factions/193x270/marauders.png');
	width: 193px;
	height: 270px
}

#factionVictoryStatistics .podium .emblem.rebels {
	background-image: url('../../img_rtl/factions/193x270/rebels.png');
	width: 193px;
	height: 270px
}

#factionVictoryStatistics .podium .emblem.dynasty {
	background-image: url('../../img_rtl/factions/193x270/dynasty.png');
	width: 193px;
	height: 270px
}

#factionVictoryStatistics .podium .emblem.horde {
	background-image: url('../../img_rtl/factions/193x270/horde.png');
	width: 193px;
	height: 270px
}

#factionVictoryStatistics .podium .emblem.rank1 {
	top: -28px;
	right: 181px
}

#factionVictoryStatistics .podium .emblem.rank2 {
	top: 15px;
	right: 7px
}

#factionVictoryStatistics .podium .emblem.rank3 {
	top: 40px;
	right: 357px
}

#factionVictoryStatistics .factionList .rank,
#factionVictoryStatistics .factionList .alliances,
#factionVictoryStatistics .factionList .victoryPoints,
#factionVictoryStatistics .factionList .victoryPointsProduction {
	text-align: left
}

#factionVictoryStatistics .factionList .faction {
	text-align: right
}

#raidListUpdate:after,
#raidListSlot:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0
}

#raidList .deleteList .inlineIcon,
#raidList .deleteSlot .inlineIcon,
#raidListCreate .deleteList .inlineIcon,
#raidListCreate .deleteSlot .inlineIcon,
#raidListUpdate .deleteList .inlineIcon,
#raidListUpdate .deleteSlot .inlineIcon,
#raidListSlot .deleteList .inlineIcon,
#raidListSlot .deleteSlot .inlineIcon,
#raidList .inlineIcon {
	display: -ms-inline-grid;
	display: inline-grid;
	-ms-grid-columns: auto auto;
	grid-template-columns: auto auto
}

#raidList .deleteList .inlineIcon i,
#raidList .deleteSlot .inlineIcon i,
#raidListCreate .deleteList .inlineIcon i,
#raidListCreate .deleteSlot .inlineIcon i,
#raidListUpdate .deleteList .inlineIcon i,
#raidListUpdate .deleteSlot .inlineIcon i,
#raidListSlot .deleteList .inlineIcon i,
#raidListSlot .deleteSlot .inlineIcon i,
#raidList .inlineIcon i,
#raidList .deleteList .inlineIcon svg,
#raidList .deleteSlot .inlineIcon svg,
#raidListCreate .deleteList .inlineIcon svg,
#raidListCreate .deleteSlot .inlineIcon svg,
#raidListUpdate .deleteList .inlineIcon svg,
#raidListUpdate .deleteSlot .inlineIcon svg,
#raidListSlot .deleteList .inlineIcon svg,
#raidListSlot .deleteSlot .inlineIcon svg,
#raidList .inlineIcon svg {
	-ms-grid-column: 1;
	grid-column-start: 1;
	-ms-grid-row: 1;
	grid-row-start: 1;
	margin-left: 5px;
	-ms-grid-row-align: center;
	align-self: center
}

#raidList .deleteList .inlineIcon span,
#raidList .deleteSlot .inlineIcon span,
#raidListCreate .deleteList .inlineIcon span,
#raidListCreate .deleteSlot .inlineIcon span,
#raidListUpdate .deleteList .inlineIcon span,
#raidListUpdate .deleteSlot .inlineIcon span,
#raidListSlot .deleteList .inlineIcon span,
#raidListSlot .deleteSlot .inlineIcon span,
#raidList .inlineIcon span {
	-ms-grid-column: 2;
	grid-column-start: 2;
	-ms-grid-row: 1;
	grid-row-start: 1;
	-ms-grid-row-align: center;
	align-self: center;
	display: inline-block
}

#raidListSlot .inlineIcon {
	display: -ms-inline-grid;
	display: inline-grid;
	-ms-grid-columns: auto auto;
	grid-template-columns: auto auto
}

#raidListSlot .inlineIcon i,
#raidListSlot .inlineIcon svg {
	-ms-grid-column: 2;
	grid-column-start: 2;
	-ms-grid-row: 1;
	grid-row-start: 1;
	margin-right: 5px;
	-ms-grid-row-align: center;
	align-self: center
}

#raidListSlot .inlineIcon span {
	-ms-grid-column: 1;
	grid-column-start: 1;
	-ms-grid-row: 1;
	grid-row-start: 1;
	-ms-grid-row-align: center;
	align-self: center;
	display: inline-block
}

#raidList a,
#raidListCreate a,
#raidListUpdate a,
#raidListSlot a {
	display: inline-block
}

#raidList a svg,
#raidListCreate a svg,
#raidListUpdate a svg,
#raidListSlot a svg {
	fill: #99c01a
}

#raidList a:hover svg,
#raidListCreate a:hover svg,
#raidListUpdate a:hover svg,
#raidListSlot a:hover svg {
	fill: #00bc00
}

#raidList a.disabled svg,
#raidListCreate a.disabled svg,
#raidListUpdate a.disabled svg,
#raidListSlot a.disabled svg {
	fill: #777
}

#raidList button.save,
#raidListCreate button.save,
#raidListUpdate button.save,
#raidListSlot button.save {
	float: right
}

#raidList .deleteList,
#raidList .deleteSlot,
#raidListCreate .deleteList,
#raidListCreate .deleteSlot,
#raidListUpdate .deleteList,
#raidListUpdate .deleteSlot,
#raidListSlot .deleteList,
#raidListSlot .deleteSlot {
	float: left;
	margin-top: 3px;
	display: inline-block
}

#raidList .deleteList svg,
#raidList .deleteSlot svg,
#raidListCreate .deleteList svg,
#raidListCreate .deleteSlot svg,
#raidListUpdate .deleteList svg,
#raidListUpdate .deleteSlot svg,
#raidListSlot .deleteList svg,
#raidListSlot .deleteSlot svg {
	height: 16px;
	width: 14px
}

#raidList .deleteList svg path,
#raidList .deleteSlot svg path,
#raidListCreate .deleteList svg path,
#raidListCreate .deleteSlot svg path,
#raidListUpdate .deleteList svg path,
#raidListUpdate .deleteSlot svg path,
#raidListSlot .deleteList svg path,
#raidListSlot .deleteSlot svg path {
	fill: #d40000
}

#raidList .deleteList:hover svg path,
#raidList .deleteSlot:hover svg path,
#raidListCreate .deleteList:hover svg path,
#raidListCreate .deleteSlot:hover svg path,
#raidListUpdate .deleteList:hover svg path,
#raidListUpdate .deleteSlot:hover svg path,
#raidListSlot .deleteList:hover svg path,
#raidListSlot .deleteSlot:hover svg path {
	fill: red
}

#raidList {
	color: #5e463a
}

#raidList .noobProtectionInfo {
	color: #333;
	padding: 10px 15px;
	margin-bottom: 10px;
	border-radius: 5px;
	border: 1px solid #a1bc79;
	background-color: #f9fbf4
}

#raidList .villageWrapper:not(:last-child) {
	margin-bottom: 25px
}

#raidList .villageWrapper.inactive {
	opacity: .5;
	pointer-events: none
}

#raidList .villageWrapper .villageHeadline {
	border: 1px solid silver;
	margin-bottom: 5px;
	line-height: 34px;
	padding: 0 15px;
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: 1fr 1fr;
	grid-template-columns: 1fr 1fr
}

#raidList .villageWrapper .villageHeadline .villageName {
	-ms-grid-row: 1;
	grid-row-start: 1
}

#raidList .villageWrapper .villageHeadline .createNew {
	-ms-grid-column: 2;
	grid-column-start: 2;
	-ms-grid-column-align: end;
	justify-self: end
}

#raidList .villageWrapper .villageHeadline .createNew.hidden {
	display: none
}

#raidList .villageWrapper .villageHeadline .createNew svg {
	width: 20px;
	height: 16px
}

#raidList .villageWrapper .dropContainer {
	position: relative
}

#raidList .villageWrapper .dropContainer:before,
#raidList .villageWrapper .dropContainer:after {
	content: "";
	display: block;
	position: absolute;
	background-color: #7043ee;
	opacity: 0;
	transition-timing-function: ease-in
}

#raidList .villageWrapper .dropContainer:before {
	height: 2px;
	top: -4px;
	right: -1px;
	left: -4px;
	transition-duration: 400ms;
	transition-delay: 0;
	transform: rotateY(90deg);
	transform-origin: right
}

#raidList .villageWrapper .dropContainer:after {
	width: 5px;
	height: 5px;
	border-radius: 50%;
	top: -5px;
	right: -5px;
	transition-duration: 100ms;
	transition-delay: 400ms
}

#raidList .villageWrapper .dropContainer.highlightDropSection:before,
#raidList .villageWrapper .dropContainer.highlightDropSection:after {
	opacity: 1
}

#raidList .villageWrapper .dropContainer.highlightDropSection:before {
	transform: rotateY(0);
	transition-delay: 100ms
}

#raidList .villageWrapper .dropContainer.highlightDropSection:after {
	transition-delay: 0
}

#raidList .villageWrapper .dropContainer.down:before,
#raidList .villageWrapper .dropContainer.down:after {
	top: auto
}

#raidList .villageWrapper .dropContainer.down:before {
	bottom: -4px
}

#raidList .villageWrapper .dropContainer.down:after {
	bottom: -5px
}

#raidList .villageWrapper .dropContainer .raidList {
	line-height: 45px;
	margin-bottom: 5px;
	box-sizing: border-box
}

#raidList .villageWrapper .dropContainer .raidList.dragged {
	opacity: .5
}

#raidList .villageWrapper .dropContainer .raidList.hidden {
	opacity: 0
}

#raidList .villageWrapper .dropContainer .raidList .raidListHeadline {
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: 35px 1fr 1fr auto 50px;
	grid-template-columns: 35px 1fr 1fr auto 50px;
	background-color: #efeee7;
	border: 1px solid silver
}

#raidList .villageWrapper .dropContainer .raidList .raidListHeadline .dragAndDrop {
	-ms-grid-column: 1;
	grid-column-start: 1;
	padding-right: 10px;
	cursor: move
}

#raidList .villageWrapper .dropContainer .raidList .raidListHeadline .dragAndDrop svg {
	fill: #787878;
	height: 25px;
	width: 4px;
	margin-top: 10px
}

#raidList .villageWrapper .dropContainer .raidList .raidListHeadline .listName {
	-ms-grid-column: 2;
	grid-column-start: 2;
	font-weight: bold
}

#raidList .villageWrapper .dropContainer .raidList .raidListHeadline .listName .value {
	-ms-grid-column: 1;
	grid-column-start: 1;
	max-width: 161px
}

#raidList .villageWrapper .dropContainer .raidList .raidListHeadline .listName .value .value,
#raidList .villageWrapper .dropContainer .raidList .raidListHeadline .listName .value .raidListContent table td.target,
#raidList .villageWrapper .dropContainer .raidList .raidListContent table .raidListHeadline .listName .value td.target {
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	direction: rtl
}

#raidList .villageWrapper .dropContainer .raidList .raidListHeadline .listName a {
	-ms-grid-column: 2;
	grid-column-start: 2;
	-ms-grid-row: 1;
	grid-row-start: 1;
	-ms-grid-row-align: center;
	align-self: center;
	padding: 10px
}

#raidList .villageWrapper .dropContainer .raidList .raidListHeadline .listName a svg {
	width: 18px;
	height: 18px;
	margin: 0
}

#raidList .villageWrapper .dropContainer .raidList .raidListHeadline .slots {
	-ms-grid-column: 3;
	grid-column-start: 3;
	white-space: nowrap;
	padding-left: 10px
}

#raidList .villageWrapper .dropContainer .raidList .raidListHeadline .slots>div {
	display: -ms-inline-grid;
	display: inline-grid;
	-ms-grid-columns: auto auto auto auto;
	grid-template-columns: auto auto auto auto
}

#raidList .villageWrapper .dropContainer .raidList .raidListHeadline .slots>div>* {
	grid-column-start: auto;
	-ms-grid-row-align: center;
	align-self: center
}

#raidList .villageWrapper .dropContainer .raidList .raidListHeadline .slots>div>*:nth-child(1) {
	-ms-grid-column: 1
}

#raidList .villageWrapper .dropContainer .raidList .raidListHeadline .slots>div>*:nth-child(2) {
	-ms-grid-column: 2
}

#raidList .villageWrapper .dropContainer .raidList .raidListHeadline .slots>div>*:nth-child(3) {
	-ms-grid-column: 3
}

#raidList .villageWrapper .dropContainer .raidList .raidListHeadline .slots>div>*:nth-child(4) {
	-ms-grid-column: 4
}

#raidList .villageWrapper .dropContainer .raidList .raidListHeadline .slots>div svg {
	width: 16px;
	height: 16px;
	margin-left: 5px
}

#raidList .villageWrapper .dropContainer .raidList .raidListHeadline .slots>div svg.error {
	fill: #d40000
}

.colorBlind #raidList .villageWrapper .dropContainer .raidList .raidListHeadline .slots>div svg.error {
	fill: #0022af
}

#raidList .villageWrapper .dropContainer .raidList .raidListHeadline .slots>div svg.success {
	fill: #228b22
}

#raidList .villageWrapper .dropContainer .raidList .raidListHeadline .slots>div i.attack {
	width: 16px;
	height: 16px;
	background-image: url('../../img_rtl/a/att_all.gif');
	margin-left: 5px
}

#raidList .villageWrapper .dropContainer .raidList .raidListHeadline .slots>div .value {
	display: inline-block;
	-ms-grid-column: 4;
	grid-column-start: 4
}

#raidList .villageWrapper .dropContainer .raidList .raidListHeadline .slots>div .slotsCount {
	color: #94786a
}

#raidList .villageWrapper .dropContainer .raidList .raidListHeadline button {
	-ms-grid-column: 4;
	grid-column-start: 4;
	-ms-grid-row-align: center;
	align-self: center
}

#raidList .villageWrapper .dropContainer .raidList form {
	-ms-grid-column: 4;
	grid-column-start: 4;
	-ms-grid-row-align: center;
	align-self: center
}

#raidList .villageWrapper .dropContainer .raidList .expandCollapse {
	-ms-grid-column: 5;
	grid-column-start: 5;
	text-align: center;
	cursor: pointer
}

#raidList .villageWrapper .dropContainer .raidList .expandCollapse img.loading {
	display: none;
	margin-top: 15px
}

#raidList .villageWrapper .dropContainer .raidList .expandCollapse svg {
	fill: #5e463a;
	width: 18px;
	height: 11px;
	margin-top: 15px;
	position: relative;
	top: 0;
	transition: top .2s, fill .2s
}

#raidList .villageWrapper .dropContainer .raidList .expandCollapse.loading img.loading {
	display: inline-block
}

#raidList .villageWrapper .dropContainer .raidList .expandCollapse.loading svg {
	display: none
}

#raidList .villageWrapper .dropContainer .raidList .expandCollapse.expanded svg {
	transform: scaleY(-1)
}

#raidList .villageWrapper .dropContainer .raidList .expandCollapse:hover svg {
	fill: #94786a;
	top: 3px
}

#raidList .villageWrapper .dropContainer .raidList .expandCollapse:hover.expanded svg {
	top: -3px
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent.hide {
	display: none
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table {
	background-color: transparent;
	border-collapse: collapse;
	border: 1px solid silver;
	border-top: 0;
	border-bottom: 0
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table thead th {
	background-color: #f3f2e7;
	border-top: 0;
	color: #5e463a
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table thead th.sortable {
	cursor: pointer;
	padding: 6px 0 3px
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table thead th.sortable div {
	padding: 0 9px;
	position: relative
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table thead th.sortable div svg.arrow {
	position: absolute;
	left: 3px;
	top: calc(50% - 3px);
	width: 7px;
	height: 7px
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table thead th.sortable div svg.arrow path {
	fill: #5e463a
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table thead th.sortable div svg.arrow.down {
	transform: scaleY(-1)
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table tbody td {
	background-color: #fefdf8
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table tbody .slotRow.slotInactive td {
	background-color: #f2f2ee;
	opacity: .4
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table th,
#raidList .villageWrapper .dropContainer .raidList .raidListContent table td {
	border: 1px solid silver;
	padding: 6px 9px 3px
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table th.checkbox,
#raidList .villageWrapper .dropContainer .raidList .raidListContent table td.checkbox {
	border-left: 0;
	width: 1px;
	padding-right: 5px;
	padding-left: 0
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table th.target,
#raidList .villageWrapper .dropContainer .raidList .raidListContent table td.target {
	border-right: 0
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table th.target {
	box-sizing: border-box;
	width: 130px;
	text-align: right;
	padding-right: 30px
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table th.target.sortable div {
	padding-right: 30px
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table th.lastRaid {
	text-align: right;
	font-weight: bold;
	position: relative;
	background-clip: padding-box
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table th.lastRaid svg.sorting {
	width: 12px;
	height: 16px;
	left: 3px;
	top: 10px;
	position: absolute;
	cursor: pointer
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table th.lastRaid svg.sorting path {
	fill: #99c01a
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table th.lastRaid svg:hover path {
	fill: #00bc00
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table th.lastRaid nav.lastRaidSorting {
	min-width: 200px;
	position: absolute;
	right: -5px;
	top: 100%;
	background-color: #f3f2e7;
	border: 1px solid #333;
	box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.25);
	border-radius: 3px;
	z-index: 36;
	cursor: default;
	transition-duration: 250ms;
	opacity: 0;
	pointer-events: none
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table th.lastRaid nav.lastRaidSorting.open {
	opacity: 1;
	pointer-events: auto
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table th.lastRaid nav.lastRaidSorting:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	position: fixed;
	z-index: -1
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table th.lastRaid nav.lastRaidSorting .description {
	padding: 3px 8px;
	color: #888;
	font-size: 12px;
	font-weight: normal
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table th.lastRaid nav.lastRaidSorting .sortOption {
	padding: 5px 8px;
	min-height: 32px;
	border-top: 1px solid #b7b7b7;
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: 22px 10px 1fr;
	grid-template-columns: 22px 10px 1fr;
	box-sizing: border-box;
	position: relative
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table th.lastRaid nav.lastRaidSorting .sortOption img,
#raidList .villageWrapper .dropContainer .raidList .raidListContent table th.lastRaid nav.lastRaidSorting .sortOption i {
	-ms-grid-row-align: center;
	align-self: center;
	-ms-grid-column-align: center;
	justify-self: center;
	-ms-grid-column: 1;
	grid-column-start: 1;
	display: inline-block
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table th.lastRaid nav.lastRaidSorting .sortOption span {
	-ms-grid-row-align: center;
	align-self: center;
	-ms-grid-column: 3;
	grid-column-start: 3;
	display: inline-block
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table th.lastRaid nav.lastRaidSorting .sortOption.active {
	background-color: #e1e0d2;
	-ms-grid-columns: 22px 10px 1fr 10px;
	grid-template-columns: 22px 10px 1fr 10px
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table th.lastRaid nav.lastRaidSorting .sortOption.active svg.arrow {
	position: relative;
	-ms-grid-column: 4;
	grid-column-start: 4;
	width: 7px;
	height: 7px;
	-ms-grid-row-align: center;
	align-self: center;
	-ms-grid-column-align: end;
	justify-self: end
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table th.lastRaid nav.lastRaidSorting .sortOption.active svg.arrow path {
	fill: #5e463a
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table th.lastRaid nav.lastRaidSorting .sortOption.active svg.arrow.down {
	transform: scaleY(-1)
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table th.edit {
	width: 18px;
	padding-right: 5px;
	padding-left: 5px
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table td.target {
	text-align: right;
	max-width: 1px
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table td.target .raidListHeadline .listName .value,
#raidList .villageWrapper .dropContainer .raidList .raidListHeadline .listName .raidListContent table td.target .value,
#raidList .villageWrapper .dropContainer .raidList .raidListContent table td.target td.target {
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	direction: rtl
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table td.target i {
	vertical-align: top
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table td.target i.inactive {
	visibility: hidden
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table td.target a {
	display: inline
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table td.target svg.attackError {
	vertical-align: top;
	fill: #d40000;
	width: 16px;
	height: 16px
}

.colorBlind #raidList .villageWrapper .dropContainer .raidList .raidListContent table td.target svg.attackError {
	fill: #0022af
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table td.population,
#raidList .villageWrapper .dropContainer .raidList .raidListContent table td.distance {
	text-align: left
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table td.troops {
	width: 60px
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table td.troops .troopIcon {
	display: inline-block;
	white-space: nowrap
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table td.troops .troopIcon img {
	margin-left: 2px
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table td.lastRaid>div {
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: 24px 1fr 18px;
	grid-template-columns: 24px 1fr 18px
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table td.lastRaid>div>* {
	-ms-grid-row: 1;
	grid-row-start: 1;
	-ms-grid-row-align: center;
	align-self: center
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table td.lastRaid>div .iReport {
	-ms-grid-column: 1;
	grid-column-start: 1;
	-ms-grid-column-align: start;
	justify-self: start
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table td.lastRaid>div a {
	-ms-grid-column: 2;
	grid-column-start: 2
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table td.lastRaid>div .carry {
	-ms-grid-column: 3;
	grid-column-start: 3;
	-ms-grid-column-align: end;
	justify-self: end;
	margin-top: -1px
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table td.edit {
	padding-right: 5px;
	padding-left: 5px
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table td.edit svg {
	width: 18px;
	height: 18px
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table tfoot .newSlot {
	height: 23px;
	text-align: center;
	background-color: #fefdf8
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table tfoot .newSlot svg {
	vertical-align: top;
	margin-right: 5px;
	width: 14px;
	height: 14px
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table tfoot .newSlot .slots {
	margin-right: 20px;
	color: #777
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table tfoot .newSlot .maxTargets {
	color: #777
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table tfoot .selectedTroops td {
	height: 23px;
	background-color: #f6f6f6;
	border: 0
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table tfoot .selectedTroops td.selectedCount {
	padding-right: 30px
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table tfoot .selectedTroops td.equals {
	text-align: left;
	font-weight: bold;
	color: #d8d8d8;
	font-size: 18px
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table tfoot .selectedTroops td.troopSelection {
	padding-right: 4px
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table tfoot .selectedTroops td.troopSelection .troopSelectionUnit {
	white-space: nowrap;
	margin-right: 5px
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table tfoot .feedback {
	display: none
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent table tfoot .feedback td {
	height: 23px;
	background-color: #f6f6f6;
	border: 0;
	text-align: center
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent .buttonWrapper {
	border: 1px solid silver;
	border-top: 0;
	background-color: #fefdf8;
	padding: 10px 9px;
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: auto auto 1fr auto;
	grid-template-columns: auto auto 1fr auto
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent .buttonWrapper .editButton {
	-ms-grid-column: 1;
	grid-column-start: 1;
	-ms-grid-row: 1;
	grid-row-start: 1
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent .buttonWrapper .stateToggleButton {
	-ms-grid-column: 2;
	grid-column-start: 2;
	-ms-grid-row: 1;
	grid-row-start: 1;
	margin-right: 10px
}

#raidList .villageWrapper .dropContainer .raidList .raidListContent .buttonWrapper .startButton {
	-ms-grid-column: 4;
	grid-column-start: 4;
	-ms-grid-row: 1;
	grid-row-start: 1
}

#raidList .villageWrapper .dropContainer .raidList#dragElement {
	position: fixed;
	opacity: 1;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.35);
	z-index: 99
}

#raidList .villageWrapper .dropContainer .raidList#dragElement .raidListHeadline {
	border-color: #64a3c6
}

#raidListCreate {
	font-size: 14px
}

#raidListCreate input {
	width: 350px
}

#raidListCreate #error {
	padding: 10px 0
}

#raidListCreate .noteSmall {
	font-size: 13px;
	color: #777
}

#raidListUpdate {
	font-size: 14px
}

#raidListUpdate input {
	width: 430px
}

#raidListUpdate #error {
	padding: 10px 0
}

#raidListUpdate .noteSmall {
	font-size: 13px;
	color: #777
}

#raidListUpdate .sortContainer {
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: 35px 1fr;
	grid-template-columns: 35px 1fr;
	-ms-grid-rows: 2em .5em .5em 2em;
	grid-template-rows: 2em .5em .5em 2em;
	border: 1px solid #777;
	margin: 5px 0 10px
}

#raidListUpdate .sortContainer .moveUp,
#raidListUpdate .sortContainer .moveDown {
	-ms-grid-column: 1;
	grid-column-start: 1;
	user-select: none;
	text-align: center
}

#raidListUpdate .sortContainer .moveUp svg,
#raidListUpdate .sortContainer .moveDown svg {
	width: 25px;
	height: 15px;
	transition-duration: 250ms
}

#raidListUpdate .sortContainer .moveUp {
	grid-row: 1 / 3;
	-ms-grid-row: 1;
	-ms-grid-row-span: 2;
	padding-top: calc(2.5em - 15px - 5px)
}

#raidListUpdate .sortContainer .moveDown {
	grid-row: 3 / 5;
	-ms-grid-row: 3;
	-ms-grid-row-span: 2;
	padding-top: 5px
}

#raidListUpdate .sortContainer .moveDown svg {
	transform: scaleY(-1)
}

#raidListUpdate .sortContainer .listBefore,
#raidListUpdate .sortContainer .listCurrent,
#raidListUpdate .sortContainer .listAfter {
	-ms-grid-column: 2;
	grid-column-start: 2;
	-ms-grid-row-align: center;
	align-self: center
}

#raidListUpdate .sortContainer .listBefore,
#raidListUpdate .sortContainer .listAfter {
	color: #777
}

#raidListUpdate .sortContainer .listCurrent {
	font-weight: bold
}

#raidListUpdate .sortContainer .listBefore {
	-ms-grid-row: 1;
	grid-row-start: 1
}

#raidListUpdate .sortContainer .listCurrent {
	grid-row: 2 / 4;
	-ms-grid-row: 2;
	-ms-grid-row-span: 2
}

#raidListUpdate .sortContainer .listAfter {
	-ms-grid-row: 4;
	grid-row-start: 4
}

#raidListUpdate .sortContainer .sortIndex {
	display: inline-block;
	text-align: left;
	width: 25px
}

#raidListUpdate .sortContainer .listName {
	padding-right: 5px
}

#raidListSlot {
	font-size: 14px;
	width: 476px;
	height: auto
}

#raidListSlot .raidListSlotInfos {
	padding: 10px 20px;
	margin-bottom: 20px;
	background-color: #e7e7e7;
	border-radius: 5px
}

#raidListSlot select {
	width: 100%
}

#raidListSlot option {
	width: 100%
}

#raidListSlot table th {
	width: 20%
}

#raidListSlot .troop {
	width: 40px;
	margin: 4px 10px
}

#raidListSlot .troop#t5,
#raidListSlot .troop#t10 {
	margin-left: 0
}

#raidListSlot .troops {
	margin-bottom: 10px
}

#raidListSlot .troopGroup {
	margin-right: 10px;
	float: right
}

#raidListSlot .deactivateTarget {
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: auto 1fr;
	grid-template-columns: auto 1fr;
	padding: 10px;
	margin: 10px 0;
	cursor: pointer;
	border-radius: 5px;
	transition: background-color 150ms
}

#raidListSlot .deactivateTarget:hover {
	background-color: #f2f2f2
}

#raidListSlot .deactivateTarget:active {
	background-color: #e7e7e7
}

#raidListSlot .deactivateTarget input {
	-ms-grid-column: 1;
	grid-column-start: 1;
	cursor: pointer
}

#raidListSlot .deactivateTarget .description {
	-ms-grid-column: 2;
	grid-column-start: 2;
	display: inline-block;
	padding-right: 10px;
	user-select: none
}

#raidListSlot .deactivateTarget .description span {
	display: block
}

#raidListSlot .deactivateTarget .description span:last-of-type {
	color: #777
}

#raidListTroopsSlots {
	margin: 10px 0 10px
}

#raidListTroopsSlots .troopGroup {
	float: right;
	margin-right: 10px
}

#raidListTroopsSlots .troopGroup label {
	position: relative;
	top: 2px
}

#raidListTroopsSlots .troopGroup .troop {
	width: 40px;
	margin: 4px 10px
}