html {
  font-family: Tahoma, sans-serif;
  font-size: 1em;
}

/** Basic Page Design Elements **/

body {
  background-image: url('images/background/scape.jpg');
  background-color: #000;
  color: #fff;
}

#errtext {
  color: #FFFFE0;
  margin: 10px 0px;
  padding: 10px 0px;
  text-align: center;
}

.bigBlue {
  position: fixed;
  width: 405px;
  height: 630px;
  bottom: 0px;
  right: 0px;
  background-image: url('images/background/bigblue.png');
  z-index: -1;
}

.copyright {
  margin-top: 10px;
  text-align: center;
  font-size: 10px;
  color: #909090;
}

canvas {
  background-color: #eee;
  padding: 10px;
}


/** The "DG" Font (Actually, the atari font? O_o) */
@font-face {
  font-family: 'DarkGalaxy';
  src: url('images/font/dgfont.eot');
  src: url('images/font/dgfont.eot?#iefix') format('embedded-opentype'),
  url('images/font/dgfont.woff') format('woff'),
  url('images/font/dgfont.ttf') format('truetype'),
  url('images/font/dgfont.svg#DarkGalaxy') format('svg');
  font-weight: normal;
  font-style: normal;
}

/** Hyperlink Formatting **/
a {
  color: #add4e6;
  text-decoration: none;
}

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

a:hover {
  text-decoration: underline;
}

a img {
  border: 0px;
}

/** Generic Positioning elements **/
.flex {
  display: flex;
}
.left {
  float: left;
}

.right {
  float: right;
}

.absolute {
  position: absolute;
}

.relative {
  position: relative;
}

.ofHidden {
  overflow: hidden;
}

.hidden {
  display: none;
}

.padding {
  padding: 4px
}

/** Default Padding on all elements! **/
.paddingMid {
  padding: 3px;
}

.paddingSmall {
  padding: 2px;
}

.paddingLeft {
  padding-left: 4px;
}

.seperator {
  clear: both;
  margin-bottom: 7px;
}

.seperatorSmall {
  margin-bottom: 2px
}

.seperatorLarge {
  margin-bottom: 15px;
}

.seperatorLeft {
  margin-left: 8px;
}

.seperatorRight {
  margin-right: 2px;
}

.seperatorRightMid {
  margin-right: 8px;
}

.seperatorRightLarge {
  margin-right: 24px;
}

.noPadding {
  padding: 0px;
}


/** TEMPORARY ALPHA / BETA COMPONENTS **/
.bugBox {
  overflow: hidden;
  background-color: #426300;
  border: 1px solid #AAFF00;
  margin-bottom: 5px;
}

.beta {
  width: 40px;
  font-family: serif;
  font-size: 30px;
  text-align: center;
}

ul {
  padding: 0px;
  padding-left: 20px;
  margin: 0px;
}

/** Common Elements **/
/** Input fields **/
input[type="button"], input[type="submit"], button {
  background: none repeat scroll 0 0 black;
  color: white;
  border: 1px solid #555555;
  padding: 4px;
  margin: 0px;
}

input[type="button"]:ACTIVE, input[type="submit"]:ACTIVE, button:ACTIVE {
  border: 1px solid #FFF;
}

#turnStatus {
  font-weight: bold;
}

.turnUpdateDialog {
  position: fixed;
  left: 50%;
  top: 0px;
  margin-left: -200px;
  padding: 8px;
  width: 400px;
  border-radius: 0px 0px 6px 6px;
  border: 1px solid #545454;
  background: rgba(150, 0, 0, 0.7);
  z-index: 10;
  display: none;
}

.turnUpdateDialog div {
  position: absolute;
}

.turnUpdateDialog span {
  line-height: 16px;
  margin-left: 60px;
  float: left;
}

.header {
  padding-left: 4px;
  font-family: DarkGalaxy, sans-serif;
  font-size: 24px;
  color: #fff;
  background-image: url('images/grads/headback.gif');
  height: 35px;
  line-height: 35px
}

.header img {
  float: left;
  margin-right: 6px;
  padding-top: 2px;
}

.opacBackground {
  background: rgba(75, 75, 75, 0.6);
}

.opacDarkBackground {
  background: rgba(0, 0, 0, 0.35);
}

.opacLightBackground {
  /*background-image: url("images/grads/opacWhite.png");*/
  background: rgba(255, 255, 255, 0.15);
}

.lightBorder {
  border: 1px solid #545454;
}

.lightBorderBottom {
  border-bottom: 1px solid #545454;
}

.border {
  text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
}

.coords {
  padding: 2px;
  background: rgba(75, 75, 75, 0.6);
  font-size: 1rem;
  border: 1px solid #545454;
  overflow: hidden;
  height: 17px;
  margin: 0px 4px 0px 0px;
  line-height: 17px;
}

div.coordsInput {
  height: 23px;
  line-height: 20px;
  padding: 0px 15px 0px 0px;
}

div

.resource {
  padding: 4px;
  font-size: 1rem;
  overflow: hidden;
  height: 17px;
}

.resource span {
  line-height: 18px;
}

.hostile, .hostile a {
  color: #FF5555;
}

.friendly, .friendly a, .friendly a:visited {
  color: #55FF55;
}

.allied, .allied a {
  color: #55FFFF;
}

.neutral, .neutral a {
  color: #9B9B9B;
}

.food {
  color: #73AA35;
}

.metal {
  color: #EEEEEE;
}

.mineral {
  color: #E33E4C;
}

.energy {
  color: #6596DA;
}

.population {
  color: #EAC861;
}


.error {
  font-color: #ff0000;
  border: 1px solid #913737;
  background: rgba(150, 0, 0, 0.7);
  margin-left: 0px;
  padding: 5px;
}

.green {
  overflow: hidden;
  background-color: #426300;
  border: 1px solid #AAFF00;
  margin-left: 0px;
  padding: 5px;
}

/** Main Page Design **/
#contentWrapper {
  margin: 0 auto;
  text-align: center;
}

#content {
  width: 950px;
  text-align: left;
  margin: auto;
}

#contentBox {
  border: 1px solid #7a7a7a;
  border-radius: 0 0 2px 2px;
}

.pageTitle {
  padding-left: 15px;
}

#contentBox #contentPanel #mainContent {
  padding: 4px;
  overflow: hidden;
}

/** Header Elements **/
#header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}

#playerBox {
  margin-top: 13px
}

#playerBox .icons {
  float: right;
  padding-top: 4px;
  padding-right: 5px;
  margin-left: 35px;
}

#playerBox .icons img {
  float: left;
  padding-top: 4px;
  padding-right: 8px;
}

#playerBox .icons #logout {
  padding: 0px;
}

#playerBox .counter {
  position: absolute;
  padding: 1px;
  border-radius: 3px;
  font-family: Tahoma, sans-serif;
  font-size: 9px;
  line-height: 9px;
  left: -5px;
}

#playerBox #mailBox {
  background-color: #881111;
  border: 1px solid #ff0000;

}

#playerBox #newsBox {
  background-color: #2D34FF;
  border: 1px solid #35AEFF;
}

/** Tab Panel Styles **/
#tabpanel {
  position: relative;
  width: 900px;
  height: 38px
}

#tabpanel .tab {
  position: absolute;
  float: left;
  background-image: url("images/tabset/tabs.png");
  width: 152px;
  height: 38px;
  background-position: -152px 0px;
}

#tabpanel .selected {
  position: absolute;
  background-image: url('images/tabset/tabs.png');
  width: 152px;
  height: 38px;
  background-position: 0px 0px;
  z-index: 2;
  margin-top: 1px;

}

#tabpanel .tabText {
  display: block;
  padding-left: 30px;
  padding-top: 6px;

  font-family: DarkGalaxy, sans-serif;
  font-size: 25px;
  line-height: 25px;

  height: 36px;
  color: #fff;
}

#tabpanel .tabText img {
  float: left;
  margin-right: 4px;
}

#tabpanel .first {
  background-image: url("images/tabset/tabsFirst.png");
  width: 130px;
  margin-left: 0px;
}

#tabpanel .tab:hover {
  background-position: -304px 0px;
}

#tabpanel .tab .content {
  display: block;
  padding-left: 25px;
  padding-top: 8px;
}

#tabpanel .tab .content:hover {
  padding-top: 6px;
}

#tabpanel .content img {
  margin-right: 5px;
}

/** Table Headers **/
.tableHeader {
  display: flex;
  border-bottom: 2px solid #787878;
  background: rgba(255, 255, 255, 0.15);
}

.tableHeader div {
  padding: 4px 0px 4px 0px;
  margin: 0px;
}

.tableHeader .title {
  line-height: 17px;
  font-weight: bold
}

.tableHeader .icon {
  height: 17px;
}

/** Base class for all column.. **/
.entry {
  padding: 4px 0px 4px 0px;
  overflow: hidden;
  font-size: 1rem;
  position: relative;
}

/** Announcements Page **/
.stat .name {
  font-weight: bold;
  padding: 3px;
  width: 60px;
}

.stat .value {
  padding: 3px;
}

.leftContent {
  margin-right: 216px;
}

.rightContent {
  width: 200px;
}

.plainHeader {
  font-size: 18px;
  font-weight: bold;
  border-bottom: 1px solid #7a7a7a;
  margin-bottom: 6px
}

/** Planets List **/
#planetList .planetImage {
  margin-right: 3px;
  height: 88px;
}

#planetList .planetImage img {
  height: 88px;
}

#planetList .planetHeadSection {

}

#planetList .planetHeadSection .planetName {
  font-size: 14px;
  font-weight: bold;
  line-height: 26px;
}

#planetList .planetHeadSection .coords {
  margin: 2px;
}

#planetList .planetHeadSection .resource {
  margin-top: 1px;
}

#planetList .resourceLine .resource {
  margin-top: 0px;
  width: calc(25% - 8px);
}

#planetList .resourceLine .resource span {
  line-height: 17px;
}

/** Planet View - HEADER - **/
#buttonBlock {
  padding: 0px 0px 0px 0px;
  overflow: hidden
}

#buttonBlock a {
  display: inline-block;
  float: left;
  margin-right: 7px;
  padding: 4px;
  width: 122px;
}

#buttonBlock a img {
  float: left;
  margin-right: 6px
}

#buttonBlock a span {
  line-height: 29px;
  font-family: DarkGalaxy;
  font-size: 24px;
  color: #fff
}

#buttonBlock div {
  display: inline-block;
  float: left;
  margin-right: 7px;
  padding: 4px;
  width: 122px;
  background: rgba(0, 0, 0, 0.35);
  border: 1px solid #444444;
  cursor: default;
}

#buttonBlock div img {
  float: left;
  margin-right: 6px
}

#buttonBlock div span {
  line-height: 29px;
  font-family: DarkGalaxy;
  font-size: 24px;
  color: #5f5f5f
}

#planetHeader {
  min-height: 188px;
}

#planetHeader .resourceRow {
  margin: 0px 0px 6px 0px;
}

#planetHeader .resourceRow .data {
  min-width: 20%;
  padding-top: 3px;
  padding-bottom: 3px;
}

#planetHeader .resourceRow .resourceName span {
  line-height: 18px;
}

#planetHeader #planetImage {
  margin-right: 4px
}

#planetHeader .planetHeadSection {
  padding: 0px 0px 7px 0px;
  overflow: hidden
}

#planetHeader .planetName {
  font-size: 14px;
  font-weight: bold;
  line-height: 25px
}


/** Planet View - COMPLETED **/
#completed {
  width: 370px;
  margin-left: 8px;
}

.width50 {
  width: 50px;
}

.width65 {
  width: 65px;
}

.width40 {
  width: 40px;
}

.width30 {
  width: 30px;
}

.width25 {
  width: 25px;
}

.structureImage {
  width: 50px;
  height: 40px;
}

.structureImage img {
  width: 40px;
  height: 40px;
  padding-left: 4px
}

.upkeepList {
  padding: 4px 0px 0px 0px;
}

/** Planete View - QUEUE **/
#queue {
  /*width: 558px;*/
  width: 370px;
  margin-left: 8px;
}

.queueItem div {
  line-height: 25px;
}

.queueButtons {
  width: 70px;
}

.queueButtons .queueUpButton {
  background-image: url('images/queue/up.png');
}

.queueButtons .queueDownButton {
  background-image: url('images/queue/down.png');
}

.queueButtons .queueRemoveButton {
  background-image: url('images/queue/remove.png');
}

.queueButtons .queueAddButton {
  background-image: url('images/queue/add.png');
}

.queueButtons input[type=submit] {
  padding: 0px;
  margin: 0px;
  margin-right: 5px;
  margin-top: 4px;
  width: 17px;
  height: 17px;
  float: left;
  background-color: rgba(255, 255, 255, 0);
  color: rgba(255, 255, 255, 0);
  font-size: 0px;
  padding: 0px;
  border: 0px;
  cursor: pointer;
}

.queueButtons img {
  float: left;
  margin-right: 5px;
  margin-top: 4px;
  width: 17px;
  height: 17px;
}

.queueButtons .queueDestroyButton {
  background-image: url('images/queue/destroy.png');
}

.entry .addQueue {
  padding: 0px;
  margin: 0px;
  margin-left: 1px;
  margin-top: 1px;
  width: 17px;
  height: 17px;

  float: left;

  background-image: url('images/queue/add.png');
  background-color: rgba(255, 255, 255, 0);
  color: rgba(255, 255, 255, 0);
  font-size: 0px;
  padding: 0px;
  border: 0px;
  cursor: pointer;
}

.buildButton {
  width: 17px;
  margin-top: 3px
}

.buildButton input[type=radio] {
  width: 100%;
}

.buildButton input[type=text], .buildButton input[type=number] {
  -moz-appearance: textfield;
  width: 30px;
  font-size: 10px;
  border: 1px solid #7a7a7a;
  background-color: #4a4a4a;
  color: #ffffff;
}

.buildButton input[type=number]::-webkit-inner-spin-button,
.buildButton input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.destroyButton {
  position: absolute;
  top: 5px;
  right: 5px;
  width: 17px;
}

#queue .name {
  width: 175px;
}

#queue .title .status {
  width: 50px;
  margin-right: 50px;
}

#queue .entry .status img {
  float: left;
  margin-right: 30px;
  margin-top: 4px;
  width: 17px;
  height: 17px;
}

.width232 {
  width: 232px;
}

.minWidth165 {
  min-width: 165px;
}

.width24 {
  width: 24px;
}

/** Planet View - AVAILABLE **/
#available {
  width: 558px;
  float: left;
}

.structureImageSmall {
  width: 40px;
  margin-bottom: 0px;
  height: 25px;
}

.structureImageSmall img {
  margin: 0px;
}

.structureImageSmall img {
  width: 25px;
  height: 25px;
  padding-left: 4px
}

.lh25 {
  line-height: 25px;
}

.tipsyPlanet {
  text-align: left;
}

.tipsyPlanet .title {
  font-weight: bold;
}

.tipsyPlanet .seperator {
  border-bottom: 1px solid #545454;
  margin-top: 6px;
  margin-bottom: 6px;
}

.tipsyPlanet .resourceName span {
  line-height: 18px;
}

.prequeue {
  border: 1px solid #AAFF00 !important;
  width: 17px !important;
  height: 17px !important;
  margin-left: 0px !important;
  margin-top: 0px !important;
  background-repeat: no-repeat;
  background-position: center;
}


/** Construction Available **/
.consList .nameCol {
  width: 164px;
}

.consList .meCol {
  width: 70px;
}

.consList .miCol {
  width: 70px;
}

.consList .foCol {
  width: 40px;
}

.consList .enCol {
  width: 40px;
}

.consList .orCol {
  width: 26px;
}

.consList .grCol {
  width: 26px;
}

.consList .woCol {
  width: 70px;
}

/** Production Available **/
.prodList .nameCol {
  width: 180px;
}

.prodList .meCol {
  width: 70px;
}

.prodList .miCol {
  width: 70px;
}

.prodList .woCol {
  width: 70px;
}

.prodList .enCol {
  width: 70px;
}

/** Traning Available **/
.trainList .nameCol {
  width: 220px;
}

.trainList .meCol {
  width: 60px;
}

.trainList .miCol {
  width: 60px;
}

.trainList .woCol {
  width: 60px;
}

.trainList .foCol {
  width: 60px;
}

/** Research Available **/
.resList .nameCol {
  width: 370px;
}

.resList .reCol {
  width: 90px;
}

/** Fleet List **/
#fleetList {
  overflow: hidden;
  padding: 0px;
}

#fleetList .tableHeader .name, #fleetList .tableHeader .activity {
  line-height: 16px;
}

#fleetList .name {
  overflow: hidden;
  font-size: 1rem;
  font-weight: bold;
  float: left;
  min-width: 150px;
  line-height: 24px;
}

#fleetList .activity {
  float: left;
  overflow: hidden;
  line-height: 24px;
}

#fleetList .entry {
  /** Override .entry here, allow 4px padding on left and right.. **/
  padding: 4px;
}

/** Fleets Page **/
#fleetHeader .coords {
  margin-top: 9px;
}

.fleetRight {
  width: 370px;
}

.fleetLeft {
  width: 558px;
}

.fleetLeftInner {
  width: 548px;
}

.fleetLeftInnerSmall {
  width: 269px;
}

.width275 {
  width: 275px;
}

.coordsInput input[type=text], .coordsInput input[type=number] {
  -moz-appearance: textfield;
  width: 23px;
  border: 1px solid #7a7a7a;
  background-color: #4a4a4a;
  color: #ffffff;
}

.coordsInput input[type=number]::-webkit-inner-spin-button,
.coordsInput input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.coordsInput select {
  font-size: 10px;
  border: 1px solid #7a7a7a;
  background-color: #4a4a4a;
  color: #ffffff;
}

.coordsInput input[type=submit] {
  width: 50px;
  border: 1px solid #7a7a7a;
  color: #ffffff;
}

.transferRow {
  overflow: hidden;
  padding: 4px;
}

.transferRow .text {
  margin-left: 4px;
  line-height: 17px;
}

.transferRow .amount input[type=number] {
  -moz-appearance: textfield;
  width: 56px;
  font-size: 10px;
  margin-right: 10px;
  border: 1px solid #7a7a7a;
  background-color: #4a4a4a;
  color: #ffffff;
}

.transferRow .amount input[type=number]::-webkit-inner-spin-button,
.transferRow .amount input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.nextPrevFleet {
  width: 13px;
  height: 13px;
  padding: 2px;
  margin-top: 8px;
  line-height: 1rem;
}

/** Navigation **/
#navWrapper {
  text-align: center;
}

.navigation {
  background: rgba(0, 0, 0, 0.35);
  padding: 10px;
  display: inline-block;
  text-align: left;
  border: 1px solid #545454;
}

.navigationTable {
  padding: 0px;
  border: 0px solid;
  border-collapse: collapse;
  border-spacing: 5px;


}

.navigationTable td {
  overflow: hidden;
  position: relative;
  padding: 0px;
  vertical-align: middle;
  text-align: center;
}

.tier1 {
  width: 262px;
  height: 262px;
  background-position: center;
  background-repeat: no-repeat;
}

.tier2 {
  width: 132px;
  height: 132px;
  background-position: center;
  background-repeat: no-repeat;

}

.tier3 {
  width: 67px;
  height: 67px;
  background-position: center;
  background-repeat: no-repeat;
}

.tier1 {
  width: 262px;
  height: 262px;
  background-position: center;
  background-repeat: no-repeat;
}

.tier2 {
  width: 132px;
  height: 132px;
  background-position: center;
  background-repeat: no-repeat;

}

.tier3 {
  width: 67px;
  height: 67px;
  background-position: center;
  background-repeat: no-repeat;
}

.tier1 img {
  width: 256px;
  float: left;
  padding: 0 0 0 5px;
}

.tier2 img {
  width: 126px;
  float: left;
  padding: 0px 0 0 4px;
}

.tier3 img {
  width: 61px;
  float: left;
  padding: 2px 0 0 2px;
}

.tier1 div {
  width: 264px;
  float: left;
  position: relative;
}

.tier2 div {
  width: 132px;
  float: left;
  position: relative;
}

.tier3 div {
  width: 66px;
  float: left;
  position: relative;
}

.navLabel {
  position: absolute;
  right: 1px;
  bottom: 1px;
  font-size: 8pt;
  width: 15px;
  color: #ADD4E6;
  text-align: center;
  border-radius: 3px 0 0 0;
  background-color: #000000
}

.navLabelClose {
  position: absolute;
  right: 1px;
  bottom: 1px;
  font-size: 8pt;
  width: 15px;
  color: #ADD4E6;
  text-align: center;
  border-radius: 3px 0 0 0;
  background-color: #000000
}

.navigation .row .sector {
  width: 31px;
  height: 31px;
  padding: 1px 0px 0px 1px;
  margin: 3px;
}

.navigation .row .system {
  width: 31px;
  height: 31px;
  padding: 1px 0px 0px 1px;
  margin: 3px;
}

.navigation .row .planets {
  width: 150px;
  height: 180px;
  padding: 6px;
  margin: 10px;
  text-align: center;
}

.navigation .row .planets b {
  color: #fff;
}

.navigation .row .friendly {
  border: 1px solid #00FF00;
}

.navigation .row .hostile {
  border: 1px solid #FF0000;
}

.navigation .row .allied {
  border: 1px solid #0A96FF;
}

.navigation .row .neutral {
  border: 1px solid #9B9B9B;
}

.navigation .row .hostile span {
  border: none;
}

.navigation .row .allied span {
  border: none;
}

.navigation .row .friendly span {
  border: none;
}

/** Alliances **/
.allianceBox .entry {
  padding: 4px;
  line-height: 20px;
}

.entry input[type=submit] {
  padding: 2px 4px 2px 4px;
}

.entry .name {
  font-weight: bold;
  width: 250px;
}

.entry .name span {
  font-weight: normal;
  font-style: italic;
}

.entry .note {
  font-style: italic;
  color: #BFBFBF;
}

.allianceList .tag {
  font-family: monospace;
  width: 55px;
  margin-left: 4px;
  line-height: 24px;
  text-align: right;
  padding: 0px;
}

.allianceList .name {
  font-weight: bold;
  width: 425px;
  padding: 0px;
  margin-left: 4px;
  line-height: 24px;
}

.allianceList .leader {
  width: 120px;
  padding: 0px;
  line-height: 24px;
}

.allianceList .members {
  width: 80px;
  padding: 0px;
  text-align: center;
  line-height: 24px;
}

.allianceList .score {
  width: 120px;
  padding: 0px;
  line-height: 24px;
}

.allianceList .tableHeader {
  padding: 0px 4px 0px 4px;
}

/** Ranking **/
.rankingsList .rank {
  width: 30px;
}

.rankingsList .name {
  font-weight: bold;
  width: 570px;
}

.rankingsList .name span {
  font-style: italic;
  font-weight: normal;
}

.rankingsList .alliance {
  width: 200px;
}


.rankingsList .avatar {
  width: 30px;
}

.rankingsList .myRow {
  background-color: #426300;
}

.rankingsList .tableHeader {
  padding: 0px 4px 0px 4px;
}

.rankingsList .tag {
  width: 50px;
  text-align: right;
  padding-right: 5px;
  font-family: monospace;
}

.rankingsList .members {
  width: 130px;
}

.rankingsList .score {
  width: 80px;
}

/** Mail **/
.tableHeader.mailRow div {
  line-height: 18px;
}

.mailRow .unread {
  width: 45px;
  text-align: center;
  line-height: 23px;
}

.mailRow .subject {
  width: 550px;
  line-height: 23px;
}

.mailRow .sender {
  width: 180px;
  line-height: 23px;
}

.mailRow .date {
  line-height: 23px;
}

.mailSendLeft {
  width: 120px;
  line-height: 30px;
  margin-right: 5px;
  text-align: right;
  padding-right: 5px
}

.mailSendRight {
  float: left;
  border-left: 1px solid #fff;
  width: 795px;
  line-height: 30px;
  padding-left: 5px;
}

.tableHeader.newsRow {
  padding: 0px;
}

.tableHeader.newsRow div {
  line-height: 18px;
}

.newsRow .unread {
  width: 25px;
  text-align: center;
}

.newsRow .location {
  width: 200px;
}

.newsRow .status {
  width: 120px;
  line-height: 23px;
}

.newsRow .subject {
  width: 470px;
  line-height: 23px;
}

.newsRow .date {
  line-height: 23px;
}

/** Combat Report **/
/** Reports **/
.report {
  border-collapse: collapse;
  border-bottom: 2px solid #545454;
  border-right: 2px solid #545454;
  margin-left: 10px;
  margin-top: 10px;
}

.report .friendlyBack {
  background-color: #426300;
}

.report .alliedBack {
  background-color: #003964;
}

.report .hostileBack {
  background-color: #630000;
}

.report .hostileBack span {
  font-weight: normal;
}

.report .friendlyBack span {
  font-weight: normal;
  font-style: italic;
}

.report td {
  padding: 4px;
}

.report thead .top td {
  width: 150px;
  text-align: center;
  font-weight: bold;
  border: 2px solid #545454;
  border-width: 2px 2px 0 2px;
}

.report thead .top .first {
  border: 0px;
}

.report thead .second {
  border-bottom: 2px solid #545454;
}

.report thead .second .first {
  background: none;
  background-image: none;
}

.report tbody .unit {
  border-left: 2px solid #545454;
  border-bottom: 1px dashed #4b4b4b;
}

.before {
  border-left: 2px solid #545454;
  border-right: 1px solid #222222;
}

.after {
  border-left: 2px solid #222222;
  border-right: 1px solid #888888;
}

/** RADAR **/
#radarList .entry {
  line-height: 23px;
}

#radarList .name {
  width: 140px;
  padding-left: 4px;
}

#radarList .owner {
  width: 180px;
}

#radarList .origin {
  width: 220px;
}

#radarList .destination {
  width: 220px;
}

#radarList .score {
  width: 110px;
}

#radarList .turns {
  width: 40px;
}

/** Fleet queue **/
.nameColumn {
  width: 400px;
  padding-left: 4px;
}

#fleetQueue .coords {
  line-height: 17px;
}

.transferItem {
  width: 125px;
}


.allianceName {
  display: inline-block;

  cursor: pointer;
  /*
  line-height: 16px;
  border-bottom: 1px dashed #5f5f5f; 
  */
}

.playerName {
  display: inline-block;
  cursor: pointer;
  line-height: 16px;
}

/** New Research Page **/
.researchButton {
  width: 40px;
  height: 40px;
  margin: 3px;
  border: 1px solid #ffffff;
  position: relative;
}


.researchButtonTopPad {
  margin-top: 10px;
}

.researchSpecialLine {
  border-left: 1px solid #898989;
  width: 1px;
  margin: 0 3px 0 3px;
  height: 48px;
}

.researchSpecialLineBig {
  height: 56px;
}

.researchTitle {
  margin-left: 15px;
  line-height: 15px;
  padding-top: 5px;
  padding-bottom: 5px;
  width: 120px;
  margin: 3px;
  font-weight: bold;
}

.researchTitleTopPad {
  margin-top: 10px;
}

.researchHiddenTitle {
  line-height: 40px;
  width: 120px;
  margin: 0 3px 0 3px;
}

.researchDone {
  border-color: #00FF00;
}

.researchQueued {
  border-color: #ffff00;
}

.researchAvailable {
  border-color: #BFBFBF;
}

.researchNotAvailable {
  border-color: #535353;
}

.researchButtons input[type=submit] {
  border: 0px;
  background-color: rgba(0, 0, 0, 0.07);
  font-size: 0px;
  display: block;
  color: transparent;
}

.researchButtons input[type=submit]:hover {
  border: 0px;
  cursor: pointer;

}

.researchButton .researchImage {
  position: absolute;
  top: 0px;
  left: 0px;
}

.researchButtons .infoBack {
  position: absolute;
  bottom: 0px;
  left: 0px;
  width: 40px;
  height: 22px;
  border-radius: 3px 3px 0 0;
  background-color: rgba(0, 0, 0, .5);
}

.researchButtons .infoIcon {
  position: absolute;
  bottom: 0px;
  left: 2px;
}

.researchButtons .infoText {
  position: absolute;
  bottom: 0px;
  right: 2px;
  font-size: 8pt;
  line-height: 20px
}


/** Tooltip CSS */
/*noinspection CssUnusedSymbol*/
.ui-tooltip-dg {
  background-color: #333333;
  border-color: #5f5f5f;
  color: #f3f3f3;
}

/*noinspection CssUnusedSymbol*/
.ui-tooltip-dg .ui-tooltip-titlebar {
  background-color: #404040;
}

/*noinspection CssUnusedSymbol*/
.ui-tooltip-dg .ui-tooltip-icon {
  border-color: #444;
}

/*noinspection CssUnusedSymbol*/
.ui-tooltip-dg .ui-tooltip-titlebar .ui-state-hover {
  border-color: #303030;
}

/*noinspection CssUnusedSymbol*/
#ui-tooltip-playerStats {
  width: 750px;
  max-width: 750px;
}

/** BBCode Styles.. **/
.bbcode blockquote:before {
  content: "";
  position: absolute;
  display: block;
  width: 0;
  top: 7px;
  bottom: auto;
  left: -16px;
  width: 15px;
  height: 15px;
  background-image: url("images/icons/arrowLight.png");
}

.bbcode blockquote {
  position: relative;
  padding: 8px;
  border: 1px solid #545454;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  font-style: italic;
  background: rgba(255, 255, 255, 0.15);
  margin-left: 14px;
  margin-right: 14px;
}

.bbcode blockquote div.author {
  padding-bottom: 8px;
  font-style: normal;
}

.bbcode blockquote div.author:before {
  content: "\"";
}

.bbcode code {
  font-family: monospace;
  white-space: pre;
  border: 1px inset;
  padding: 4px;
  position: relative;
  display: block;

  margin-left: 14px;
  margin-right: 14px;
  margin-top: 1em;
  margin-bottom: 1em;

}

.bbcode code:before {
  content: "Code:";
  position: absolute;
  top: -16px;
}

.bbcode td {
  font-size: 1rem;
  border: 1px dotted #545454;
  empty-cells: show;
}

.bbcode table {
  border: 1px dotted #545454;
  empty-cells: show;
}

.allianceAnnouncement {
  padding: 4px;
  line-height: 20px;
}

.allianceAnnouncement p {
  margin: 0px;
}

.grecaptcha-badge {
  visibility: hidden;
}