/*
	Regiments window (squads/squads.tpl and squads/editor.tpl)
*/
.squads p.squad-new
{
	margin: 4px 0 10px;
}

.squads a.action-button,
.squads .squad-editor button
{
	display: inline-block;
	padding: 5px 12px;
	border: 1px solid #8a7550;
	border-radius: 4px;
	background: linear-gradient(#f9efd6, #e2d0a2);
	color: #2c261d;
	font-weight: bold;
	text-decoration: none;
}

.squads a.action-button.primary,
.squads .squad-submit button.primary
{
	border-color: #5a0a0e;
	background: linear-gradient(#b8262e, #8c0f16);
	color: #fff2d6;
	text-shadow: 0 1px 1px rgba(0, 0, 0, 0.6);
}

.squads .squad-card
{
	margin: 0 0 6px;
	border: 1px solid rgba(120, 95, 55, 0.45);
	border-radius: 6px;
	background: rgba(255, 250, 232, 0.55);
}

.squads .squad-card-main
{
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 6px;
	color: inherit;
	text-decoration: none;
}

.squads a.squad-card-main,
.squads a.squad-card-main span
{
	text-decoration: none !important;
}

.squads a.squad-card-main:hover
{
	background: rgba(255, 240, 200, 0.6);
}

.squads .squad-portrait
{
	display: block;
	flex: none;
	width: 44px;
	height: 44px;
	border: 1px solid #6a5434;
	border-radius: 4px;
}

.squads .squad-card-body
{
	display: block;
	flex: 1;
	min-width: 0;
}

.squads .squad-name
{
	display: block;
	font-family: Georgia, 'Times New Roman', serif;
	font-size: 14px;
	font-weight: bold;
	color: #2c261d;
}

.squads .squad-meta,
.squads .squad-hint,
.squads .squad-free,
.squads .squad-status
{
	display: block;
	color: #6a5a40;
	font-size: 11px;
}

.squads .squad-status
{
	margin: 0;
	padding: 0 6px 6px 58px;
}

.squads .squad-chips
{
	display: block;
	margin-top: 3px;
}

.squads .squad-chip
{
	display: inline-block;
	margin: 0 4px 2px 0;
	padding: 1px 7px;
	border: 1px solid #b59b64;
	border-radius: 10px;
	background: #efe2bd;
	font-size: 11px;
	white-space: nowrap;
}

.squads .squad-chip-weapon::before
{
	content: '\2694\FE0E  ';
}

.squads .squad-chip-armour::before
{
	content: '\25C8  ';
}

.squads .squad-chip-empty
{
	border-style: dashed;
	background: transparent;
	color: #8a7a5c;
}

.squads .squad-chevron
{
	flex: none;
	color: #8a7246;
	font-size: 20px;
}

/* Editor */
.squads .squad-back
{
	margin: 0 0 6px;
}

.squads .squad-head
{
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 6px;
}

.squads .squad-field
{
	margin: 0 0 10px;
}

.squads .squad-label
{
	display: block;
	margin-bottom: 3px;
	color: #6a5a40;
	font-size: 10px;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}

.squads input.squad-name-input
{
	width: 100%;
	max-width: 260px;
	box-sizing: border-box;
}

.squads .squad-unit-tiles
{
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.squads .squad-unit-tile
{
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 92px;
	padding: 5px 2px;
	box-sizing: border-box;
	border: 1px solid rgba(120, 95, 55, 0.45);
	border-radius: 6px;
	background: rgba(255, 250, 232, 0.55);
	font-size: 11px;
	text-align: center;
	cursor: pointer;
}

.squads .squad-unit-tile.selected
{
	border: 2px solid #8c0f16;
	background: #fbf0d0;
}

.squads .squad-unit-tile input
{
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.squads .squad-unit-tile img
{
	width: 44px;
	height: 44px;
	border-radius: 3px;
}

.squads .squad-unit-free
{
	font-weight: bold;
}

.squads .squad-size
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
}

.squads .squad-stepper
{
	display: inline-flex;
	align-items: stretch;
}

.squads .squad-stepper input
{
	width: 56px;
	margin: 0 -1px;
	text-align: center;
	-moz-appearance: textfield;
}

.squads .squad-stepper input::-webkit-inner-spin-button,
.squads .squad-stepper input::-webkit-outer-spin-button
{
	-webkit-appearance: none;
	margin: 0;
}

.squads .squad-step
{
	min-width: 30px;
	padding: 3px 0;
	font-size: 15px;
}

.squads .squad-editor input[type=text],
.squads .squad-editor input[type=number],
.squads .squad-editor select
{
	padding: 4px 6px;
	border: 1px solid #a48a58;
	border-radius: 4px;
	background: #fffaf0;
	font-size: 13px;
}

.squads .squad-editor button[disabled],
.squads .squad-editor input[disabled],
.squads .squad-editor select[disabled]
{
	opacity: 0.5;
}

.squads .squad-quick
{
	display: flex;
	gap: 6px;
	margin-top: 6px;
	max-width: 260px;
}

.squads .squad-quick button
{
	flex: 1;
}

.squads .squad-equipment
{
	display: flex;
	flex-wrap: wrap;
	gap: 0 12px;
}

.squads .squad-equipment .squad-field
{
	flex: 1;
	min-width: 200px;
}

.squads select.squad-item
{
	width: 100%;
}

.squads .squad-disband a
{
	color: #8c0f16;
}

.squads div.stats
{
	margin: 6px 0;
}

/* Battle */
.battle ul.available-units li 
{
	float: left;
}

.battle ul.available-units li span
{
	display: none;
}

/* Battle */
div.battle form.chooseUnits fieldset,
div.innerbattlefield
{
	overflow: hidden;
	border: 0px solid black;
}

div.battle form.chooseUnits label
{
	display: none;
}

div.battle div.battlefield-slot select
{
	display: none;
}

div.battle form.chooseUnits button
{
	display: block;
	clear: both;
	margin-top: 5px;
}

div.available-units div
{
	float: left;
}

div.battle label.checkbox
{
	width: 120px;
}

div.battle select.specialAction
{
	float: left;
	clear: none;
	width: 300px;
}

div.battle img
{
	border: 1px solid black;
	margin-left: 2px;
}

/* Tap-to-place (touch screens can't drag): the tapped unit and the slots it can go to. */
img.tap-unit
{
	cursor: pointer;
	/* A finger on a unit drags it instead of scrolling the page. */
	touch-action: none;
	-webkit-user-select: none;
	-webkit-touch-callout: none;
}

img.tap-selected
{
	outline: 2px solid #f0c040;
	outline-offset: 1px;
}

img.touch-drag-ghost
{
	position: fixed;
	z-index: 100000;
	margin: 0;
	opacity: 0.8;
	pointer-events: none;
}

.tap-placing div.battlefield-slot
{
	cursor: pointer;
	box-shadow: inset 0 0 0 2px rgba(240, 192, 64, 0.8);
}

/* The slot under a finger-dragged unit. */
div.battlefield-slot.touch-over
{
	box-shadow: inset 0 0 0 3px #f0c040;
}

div.battle img.unit-selected
{
	position: absolute;
	left: 10px;
	top: 50px;
}

div.battle div.battlefield div.unit
{
	padding: 0px;
}

div.battle div.battlefield div.unit img
{
	margin: 0px 0px 0px 0px;
	display: block;
}

div.battle div.clear-button
{
	position: absolute;
	left: 0px;
	width: 74px;
	bottom: 10px;
	text-align: center;
}

div.battle div.clear-button span
{
	text-transform: uppercase;
	font-weight: bold;
	color: black;
	background: white;
	border: 2px solid white;
	border-left: 5px solid white;
	border-right: 5px solid white;
}

div.battle div.battlefield div.unit.defender
{
	position: absolute;
	left: 9px;
	top: 10px;
}

div.battle div.battlefield div.unit.attacker
{
	position: absolute;
	left: 9px;
	bottom: 9px;
}

div.battle div.battlefield div.unit.attacker.attacking,
div.battle div.battlefield div.unit.attacker.dying,
div.battle div.battlefield div.unit.attacker.fled,
div.battle div.battlefield div.unit.attacker.whiped,
div.battle div.battlefield div.unit.attacker.stunned
{
	left: 6px;
	bottom: 6px;
}

div.battle div.battlefield div.unit.defender.attacking,
div.battle div.battlefield div.unit.defender.dying,
div.battle div.battlefield div.unit.defender.fled,
div.battle div.battlefield div.unit.defender.whiped,
div.battle div.battlefield div.unit.defender.stunned
{
	left: 6px;
	top: 7px;
}


div.battle div.battlefield div.unit.attacking
{
	border: 3px solid green;
}

div.battle div.battlefield div.unit.dying
{
	border: 3px solid red;
}

div.battle div.battlefield div.unit.fled,
div.battle div.battlefield div.unit.whiped
{
	border: 3px solid yellow;
}

div.battle div.battlefield div.unit.stunned
{
	border: 3px solid purple;
}

div.battle div.battlefield div.unit.fled img,
div.battle div.battlefield div.unit.whiped img
{
	filter:alpha(opacity=50);
	-moz-opacity:0.5;
	-khtml-opacity: 0.5;
	opacity: 0.5;
}

/*
	Challenge slots
*/
div.battlefield-slot.elevation
{
	background-image:url('../images/slots/elevation.png');
}

div.battlefield-slot.forest
{
	background-image:url('../images/slots/forest.png');
}

div.battlefield-slot.grass
{
	background-image:url('../images/slots/grass.png');
}

div.battlefield-slot.ruins
{
	background-image:url('../images/slots/ruins.png');
}

div.battlefield-slot.swamp
{
	background-image:url('../images/slots/swamp.png');
}

div.battlefield-decoration-left
{
	background-image:url('../images/slots/links.png');
}

div.battlefield-decoration-right
{
	background-image:url('../images/slots/rechts.png');
}

div.battlefield-decoration-left,
div.battlefield-decoration-right
{
	float: left;
	border: none;
	position: relative;
	width: 16px;
	height: 150px;
}

div.battle div.challenge-slot,
div.battle div.battlefield-slot
{
	float: left;
	width: 75px;
	height: 150px;
	border: none;
	position: relative;
}

div.battle div.clear-button span:hover
{
	cursor: pointer;
}

div.battle form.chooseUnits button.clear
{
	display: none;
}

div.chooseUnitContainer,
div.battlefield
{
	overflow: auto;
	position: relative;
	width: 100%;
	height: 171px;
}

ul.fightlog
{
	margin-top: 3px;
}

ul.fightlog a
{
	color: black;
	text-decoration: none;
}

ul.fightlog li.current a
{
	color: red;
}

div.battle ul.fightlog
{
	overflow: auto;
	height: 115px;
	padding: 2px;
}

div.battle.simulator ul.fightlog
{
	height: auto;
}

/*
	Simulator
*/
.selected_units
{
	width: 30px;
	position: absolute;
	top: 10px;
	left: 20px;
	margin: 0px 0px 0px 0px
}

/* Spells! */
div.spell
{
	margin-top: 5px;
	padding-top: 5px;
}

/* HELP */
div.help p
{
	clear: both;
}

/* Formation */
div.formation label
{
	float: left;
	width: 100px;
}

div.formation select
{
	float: left;
	clear: none;
	width: 75px;
}

/* Clan */
div.clan form.membermanager label
{
	float: left;
	width: 100px;
}

div.clan form.membermanager select
{
	float: left;
	clear: none;
}

div.clan textarea
{
	width: 215px;
	height: 75px;
}

div.clan span.clanmember
{
	float: left;
}

div.clan span.online-status
{
	float: right;
}

div.clan ul.clanmembers li
{
	clear: both;
}

div.clan p
{
	clear: left;
}

/* News bar */
.newsbar div.newsbar-line
{
	z-index: 5;
	background-image:url('../images/statusbar.png');
	width: 100%;
	height: 21px;
	position: relative;
}

.newsbar .goLeft
{
	float: left;
}

.newsbar .goLeft a
{
	width: 40px;
	height: 21px;
	background-image:url('../images/statusbar_left.png');
	display: block;
	position: relative; 
	left: -33px;
	z-index: 2;
	outline: none;
}

.newsbar .goRight
{
	float: right;
}

.newsbar .goRight a
{
	width: 40px;
	height: 21px;
	background-image:url('../images/statusbar_right.png');
	display: block;
	position: relative; 
	left: 33px;
	z-index: 2;
	outline: none;
}

.newsbar .newsbar-villagename .goLeft
{
	float: left;
}

.newsbar .newsbar-villagename .goLeft a
{
	width: 33px;
	height: 21px;
	background-image:url('../images/villagebar_left.png');
	display: block;
	position: relative; 
	left: -33px;
	z-index: 2;
	outline: none;
}

.newsbar .newsbar-villagename .goRight
{
	float: right;
}

.newsbar .newsbar-villagename .goRight a
{
	width: 33px;
	height: 21px;
	background-image:url('../images/villagebar_right.png');
	display: block;
	position: relative; 
	left: 33px;
	z-index: 2;
	outline: none;
}

.newsbar .goLeft a span,
.newsbar .goRight a span
{
	display: none;
}

.newsbar div.newsbar-content
{
	line-height: 20px;
	text-align: center;
	position: absolute;
	left: 0px;
	width: 88%;
	z-index: 2;
}

.newsbar div.newsbar-content a
{
	color: black;
}

.newsbar div.newsbar-content a:hover
{
	color: red;
}

.newsbar div.newsbar-content ul
{
	list-style-type: none;
	margin: 0px;
	padding: 0px;
}

.newsbar div.newsbar-content ul li
{
	float: left;
	display: block;
	width: 100px;
}

.newsbar div.newsbar-villagename
{
	position: absolute;
	z-index: 0;
	width: 350px;
	left: 50%;
	margin-left: -175px;
	text-align: center;
	background:url('../images/villagebar.png');
	bottom: 21px;
	height: 20px;
	line-height: 20px;
}

.newsbar div.newsbar-villagename a
{
	color: black;
	text-decoration: none;
}

/* Newsflash! */
div.newsflash
{
	line-height: 21px;
	background:url(../images/statusbar.png);
}

/* Overview */
.overview img
{
	height: 25px;
	float: right;
}

.overview li
{
	line-height: 25px;
}

.overview td.building-cors
{
	width: 25%;
	text-align: center;
}

.overview td.building-level
{
	width: 50px;
	text-align: center;
}

div.dialog table.table_window div.guiwindow.overview table td.building-name
{
	padding-left: 5px;
}

/* Help */
.help p.navigation
{
	margin-top: 15px;
	border-top: 1px solid gold;
}

/* Special units */
.specialunit
{
	background:url('../images/background_yellow.png');
	border: 1px solid #FFCC00;
	padding: 5px;
	margin-bottom: 5px;
}

/*
	Messages
*/
div.messages tr.unread td
{
	font-weight: bold;
}

/*
	Ranking
*/
table tr.current td
{
	background: yellow;
}

/*
	Logbook
*/
.logbook a
{
	color: black;
}

/*
	Searchbox
*/
div.searchbox
{
	border: 1px solid gold;
	padding: 5px;
}

form.searchbox li
{
	width: 50%;
	float: left;
	clear: none;
}

form.searchbox li.search_filter
{
	width: 100%;
}

form.searchbox li.minimum-distance
{
	width: 20%;
}

form.searchbox li.maximum-distance
{
	width: 30%;
}

form.searchbox fieldset
{
	border: 0px none black;
}

form.searchbox legend
{
	margin-bottom: 2px;
}

form.searchbox input,
form.searchbox select
{
	float: left;
	width: 150px;
}

form.searchbox input.checkbox
{
	width: auto;
}

form.searchbox label
{
	float: none;
	text-align: left;
	width: auto;
}

form.searchbox span.minus
{
	display: block;
	float: left;
	padding: 2px;
	font-weight: bold;
}

form.searchbox li.distance input
{
	width: 50px;
}

/*
	Spells
*/
div.spell p.castdetails
{
	padding-top: 0px;
	margin-top: -4px;
	border-bottom: 1px solid #bfb39b;
}

ul.bonusbuildings li
{
	clear: left;
}

ul.bonusbuildings li div.image
{
	float: left;
}

ul.bonusbuildings li div.description
{
	float: left;
	width: 235px;
	overflow: hidden;
}

form#selectrace select
{
	width: 200px;
}

.dialog table.table_window div.guiwindow table.logbook td.actions
{
	width: 100px;
	text-align: center;
}

/**  Underworld **/
.underworld.army input[type=checkbox]
{
	float: left;
}

h3 label
{
	display: inline;
	padding: 0;
}

.dialog table.table_window div.guiwindow.underworld.battle table
{
	border-collapse: collapse;
}

.underworld.battle tr.success
{
	background: green;
}

.underworld.battle tr.failure
{
	background: red;
}