* {
	box-sizing: border-box;

	padding: 0;
}

/* GRID */

.wrapper {
	display: grid;
	/* width: 100vw;
	height: 100vh; */
	grid-template-columns: 1fr 180px 2fr 350px 0.5fr;
	grid-template-rows: 100px 1fr auto;
}

top {
	grid-column: 1 span;
	grid-row: 1;
}

top .fixed {
	position: fixed;
	width: 100%;
	height: 100px;
	background: rgba(13, 16, 20, 0.95);
	border-bottom: 1px solid black;
	z-index: 2;
}

logo {
	grid-column: 2;
	grid-row: 1;
}

logo .fixed {
	display: flex;
	justify-content: center;
	position: fixed;
	width: 180px;
	height: 100px;
	z-index: 2;
}

logo a img {
	width: 180px;
	height: 98px;
}

header {
	grid-column: 3/5;
}

header .fixed {
	display: flex;
	align-items: center;
	/* justify-content: space-between; */
	position: fixed;
	top: 0px;
	width: 60%;
	max-width: 950px;
	height: 100px;
	z-index: 2;
	padding: 0 0 0 16px;
}

menu {
	grid-column: 2;
	font-size: 14px;
	margin: 0px;
	z-index: 1;
}

menu .fixed {
	list-style: none;
	position: fixed;
	top: 100px;
	width: 180px;
}

menu li {
	border-bottom: 1px solid black;
}

content {
	grid-column: 3/5;
	max-width: 950px;
	min-height: 700px;
	/* overflow: auto; */
	padding: 16px;
}

aside {
	grid-column: 4
}

aside .fixed {
	padding: 1px 16px 0 0;
	margin-top: 2px;
	position: fixed;
	top: 100px;
	width: 250px;
}

aside .fold {
	font-size: 15px;
	text-align: end;
	padding: 0 4px 0 0;
}

footer {
	grid-row: 3;
}

/* GLOBALS */

html,
body {
	min-height: 100%;
	min-width: 100%;
	margin: 0;
	padding: 0;
}

body {
	line-height: 14px;
	padding-bottom: 21px;
}

body.popup {
	min-width: 0;
}

:focus {
	outline: none
}

input.invalid {
	background-color: red;
	border: 1px solid #FFF;
}

input[type="submit"],
input[type="button"],
button {
	cursor: pointer;
}

table {
	width: 100%;
	/* display: block; */
	overflow: auto;
	border-collapse: separate;
	border-spacing: 2px;
	empty-cells: show;
	margin: 0 auto;
	align-self: center;
}

table.auto {
	width: unset;
}

/* hack to expand full width */
table.hack {
	table-layout: fixed;
}

table table,
img {

	border-radius: 25%;
}

td {
	padding: 2px 3px;
	vertical-align: middle;
}

input,
button {
	margin: 2px;
}

th input {
	margin: 0
}

th {
	height: 14px;
	padding: 4px 6px;
}

/* SPYTHINGS */

.spyRaportContainerRow.doubleSizeCells .spyRaportContainerCell {
	width: 50% !important;
}

/* CARD */

.card {
	padding-bottom: 16px;
}

.card .title {
	padding: 4px 6px;
	margin-bottom: 2px;
	overflow: hidden;
	white-space: nowrap;
}

.card .content {
	padding: 4px;
	margin-bottom: 2px;
}

.article .text {
	margin: 2px;
}

.article .payouts {
	display: flex;
	justify-content: space-between;
	margin: 2px;
	margin-bottom: 0px;
}

.article img {
	width: 100%;
}

textarea {
	width: 97%
}

textarea.tinymce {
	width: 100%
}

.textForBlind {
	position: absolute;
	left: -10000px;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.centerContainer>.outer {
	float: right;
	right: 50%;
	position: relative;
}

.centerContainer>.outer>.inner {
	float: right;
	right: -50%;
	position: relative;
}

.res_max,
.res_current,
.res_current_max {
	min-width: 90px
}

.res_name {
	float: none;
}

.table519 {
	/* min-width:519px !important; */
	/* width:519px !important */
	max-width: 519px !important;
}

.table569 {
	/* min-width:569px !important; */
	/* width:569px !important */
	max-width: 569px !important;
}

.build_submit {
	max-width: 100px;
	padding: 0;
	word-wrap: break-word;
	white-space: normal;
}

.build_submit:hover {
	text-decoration: underline;
	font-weight: bold;
}

.build_form {
	display: inline;
}

.onlist {
	max-width: 100%;
	margin: 0;
	padding: 0;
}

.onlist:hover {
	text-decoration: underline;
}

.shortcut-edit {
	display: none;
}

.clear {
	clear: both;
}

/** HEADER **/
#header {
	padding: 5px 10px;
	margin-left: 10px;
	margin-right: 10px;
	height: 90px;
	min-width: 915px;
	overflow: hidden;
}

#headerTable {
	width: 100%;
}

#planetSelectorWrapper {
	flex-grow: 1;
}

#planetSelector {
	position: absolute;
	top: 70px;
	width: 150px;
}

.planetImage {
	text-align: center;
	flex-grow: 1;
}

.planetImage>img {
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background-color: #DDD;
}

#resources_mobile {
	/* new */
	display: flex;
	justify-content: space-evenly;
	flex-grow: 10;
}

#resource,
#resource_mobile {
	/* new */
	text-align: center;
	align-items: center;
}

.resource_name {
	font-weight: bold;
}

.planetSelectorWrapper {
	/* new */
	/* height: 48px; */
	/* width: 48px; */
	/* margin: 0px 6px; */
	width: 150px;
}

.planetSelectorName {
	/* new */
	text-align: center;
}

#resourceWrapper {
	height: 90px;
	text-align: center;
	margin: 0;
}

#resourceTable {
	height: 80px;
	padding-right: 215px;
}

#resourceTable td {
	margin: 0 5px;
	min-width: 130px;
}

#resourceTable img {
	display: block;
	height: 22px;
	margin: 0 auto;
	width: 42px;
}

/** MENU **/

/* #leftmenu {
	width:200px;
	float:left;
} */

#menu {
	list-style: none;
	margin: 0;
	padding: 0;
}

#menu a {
	display: block;
	margin: 0;
	padding: 4px 24px;
}

div#disclamer {
	text-align: center;
	font-size: 11px;
	margin-top: 4px;
	margin-bottom: 16px;
}

.menu-separator {
	min-height: 8px;
}

#options select {
	max-width: 170px;
}

/* CONTENT */

#page {
	margin-left: 200px;
	padding: 0;
}

#content,
.infobox {
	margin: 10px 10px 0;
	padding: 10px 10px 5px 10px;
}

/* unused? */
/* .full #content > table, .full form > table {
	max-width:95%;
	width:80%;
} */

.left {
	text-align: left
}

.right {
	text-align: right
}

.center {
	text-align: center
}

.top {
	vertical-align: top
}


.tooltip,
.tooltip_sticky {
	cursor: pointer;
}

.hoverinfo {
	min-width: 150px;
	max-width: 250px;
	min-height: 20px;
	max-height: 40px;
}

.hoverinfo img {
	width: 84px;
	height: 84px;
}

.trader_col {
	margin: 0 5px;
	float: left;
	width: 100px;
}

.globalWarning {
	/* position: fixed; */
	z-index: 1;
	background-color: #FFFFDD;
	border: 1px solid #F7DF92;
	color: #000000;
	margin: 3px;
	padding: 5px;
	text-align: center;
}

.globalWarning a:hover {
	text-decoration: underline;
}

.globalWarning a {
	cursor: pointer;
	color: #D20000;
}

.trader_col label:hover {
	cursor: pointer;
}

.tip {
	display: none;
	padding: 7px;
	position: absolute;
	z-index: 1000;
	max-width: 500px;
}

.tip.notify {
	position: fixed;
	top: 200px;
	padding: 20px;
}

.ui-progressbar {
	height: 10px !important;
}

.ui-progressbar-value {
	margin: 0;
}

#traderContainer {
	margin-top: 5px;
}

.infobox {
	border: 2px solid red;
	padding: 2px 5px;
	text-align: center;
}

.shortcut-colum {
	position: relative;
}

.shortcut-delete {
	position: absolute;
	z-index: 1;
	top: 3px;
	display: none;
	right: 3px;
	width: 16px;
	height: 16px;
	cursor: pointer;
	background: url(../images/false.png) scroll no-repeat 0 0 transparent;
}

.shortcut-colum:hover .shortcut-delete {
	display: block;
}

.spyRaportFooter,
.spyRaportContainer {
	clear: both;
}

.spyRaportContainerRow.first {
	clear: both;
}

.spyRaportContainerHead {
	font-weight: 700;
	padding-top: 8px;
}

.spyRaportContainerCell {
	float: left;
	width: 25%;
}

.spyRaportFooter {
	text-align: center;
	padding-top: 8px;
}

table.tablesorter thead {
	position: relative;
}

table.tablesorter thead tr .header {
	cursor: pointer;
}

table.tablesorter thead tr .headerSortUp {
	color: lime;
}

table.tablesorter thead tr .headerSortDown {
	color: red;
}

.defaultSkin table.mceLayout {
	border-spacing: 0;
	width: 100% !important;
}

.ui-autocomplete-category {
	font-weight: bold;
	padding: .2em .4em;
	line-height: 1.5;
}

.ui-autocomplete-item {
	cursor: pointer;
}

.alliance-image {
	max-width: 1024px;
}

#overview #planetList td {
	vertical-align: top;
	white-space: nowrap;
}

.unavailable {
	opacity: 0.5;
}

#repairlist {
  display: flex;
  align-items: center;
  justify-content: center;
}
.repaira {
  float: left;
  width: 35%;
  line-height: 1.4;
  padding: 8px;
}
.repairb {
  float: left;
  width: 65%;
  line-height: 1.4;
  padding: 8px;
}
.repairShipHeader {
  border-radius: 15px 15px 0px 0px;
  padding: 6px;
  overflow: auto;
  background: #256b99;
  /* background: #9acd32; */
}
.repairShipHeader a:hover {
  color: #e62cf7;
  font-weight: bold;
}
.repairShipContainer {
  display: flex;
  align-items: center;
  justify-content: center;
  background: #212121;
}
.repairShipContainerContent {
  float: left;
  width: 50%;
  line-height: 1.4;
  padding: 10px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}

@media screen and (max-width: 1165px) {
	body {
		min-width: 0;
	}

	#resourceTable td {
		min-width: 100px;
	}
}


/* HELPERS */

.mobile {
	display: none;
}

.hamburger {
	cursor: pointer;
	font-size: 48px;
	padding: 0px 8px;
	display: none;
}

/*Hide checkbox*/
#toggle-menu input[type=checkbox] {
	display: none;
}

/* MEDIA */

@media screen and (min-width: 700px) and (max-width: 969px) {
	.planetImage {
		display: none;
	}

	#planetSelector {
		top: 99px;
	}

}

@media screen and (max-width: 699px) {
	.wrapper {
		grid-template-columns: 200px 1fr;
		grid-template-rows: 67px 1fr auto;
	}

	top {
		display: none
	}

	logo {
		display: none;
	}

	header {
		grid-column: 1/2;
	}

	header .fixed {
		height: 45px;
		width: 100vw;
		padding: 0;
	}

	content {
		grid-column: 1 / 2;
		grid-row: 2;
		width: 100vw;
		padding: 0;
	}

	.mobile {
		display: initial;
	}

	aside {
		display: none;
	}

	#planetSelector {
		top: 44px;
	}

	menu {
		grid-column: 1;
		grid-row: 2;
	}

	menu .fixed {
		position: unset;
		width: 200px;
	}

	menu li {
		margin: initial;
		border-right: 1px solid black;
	}

	#menu a {
		padding: 16px;
	}

	.planetSelectorWrapper {
		width: initial;
	}

	.planetSelectorWrapper>img {
		width: 42px;
		height: 42px;
	}

	.no-mobile {
		display: none;
	}

	/*Show menu when invisible checkbox is checked*/
	input[type=checkbox]:not(:checked)~menu {
		display: none;
	}

	.hamburger {
		display: unset;
	}

	.buildl img {
		display: none;
	}

	.alliance-image {
		max-width: 100vw;
	}

}

.danger {background-color: red; font-weight: bold;}
.lowRess { background-color: indianred;}
.midRess { background-color: chocolate;}
.highRess { background-color: seagreen;}
.realHighRess { background-color: royalblue;}
/* .nonedanger {background-color: green;} */