/* menus */
#start-menu {
  position: relative;
  display: block;
  margin: 0 auto;
  top: 80px;
  width: 650px;
  height: 600px;
}
#start-menu h1 {
  position: relative;
  float: left;
  margin: 0 auto;
  width: 500px;
  text-align: left;
  left: 50px;
  z-index: 200;
  line-height: 15px;
  color: #f2eeb3;
  font-size: 0.7em;
  letter-spacing: 8px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(128, 128, 128, 0.3);
}
#menu-1,#menu-2,#menu-4  {
  position: relative;
  top: 30px;
  left: 50px;
  display: block;
  margin-top: 5px;
  float: left;
  clear: left;
  width: 230px;
  height: auto;
  color: #f2eeb3;
  font-size: 0.7em;
  letter-spacing: 1px;
}
#help {
  position: relative;
  float: right;
  width: 300px;
  height: 100%;
  right: 100px;
  top: 60px;
}
#help p {
  position: relative;
  float: right;
  color: #f2eeb3;
  width: 250px;
  font-weight: 300;
  font-size: 0.7em;
  font-style: italic;
}
#fileToLoad {
  position: relative;
  top: 10px;
  padding-left: 0px;
  width: 185px;
  font-family: Arial, Helvetica, sans-serif;
  -webkit-box-shadow: -1px 5px 5px 0px rgba(0,0,0,0.45);
  -moz-box-shadow: -1px 5px 5px 0px rgba(0,0,0,0.45);
  box-shadow: -1px 5px 5px 0px rgba(0,0,0,0.45);
}
input {
  padding-left: 10px;
  border: 1px solid rgba(128, 128, 128, 0.3);
  padding: 3px;
  color: #f2eeb3;
  outline: none;
  background: none;
  font-family: Arial, Helvetica, sans-serif;  
}
#menu-3 {
  position: absolute;
  bottom: 150px;
  width: 100%;
  height:80px;
}
.start-game {
  position: absolute;
  left: 45px;
  bottom: 30px;
  width: 500px;
  background: none;
  font-size: 0.9em;
  padding: 10px;
  color: #f2eeb3;
  border-left: none;
  border-right: none;
  border-top: none;
  cursor: pointer;
  border-radius: 3px;
  border: 1px solid rgba(128, 128, 128, 0.3);
  background-color: transparent;
  font-family: Arial, Helvetica, sans-serif;
  -webkit-box-shadow: -1px 5px 5px 0px rgba(0,0,0,0.45);
  -moz-box-shadow: -1px 5px 5px 0px rgba(0,0,0,0.45);
  box-shadow: -1px 5px 5px 0px rgba(0,0,0,0.45);
}
#message {
  position: absolute;
  display: none;
  width: 250px;
  height: 100px;
  padding: 10px;
  background-color: rgba(0, 0, 0, 0.3);
  border: 1px solid rgba(128, 128, 128, 0.3);
  z-index: 999;
}
#message button {
  position: relative;
  width: 100px;
  height: 23px;
  margin: 0 auto;
  cursor: pointer;
  text-align: center;
  margin-top: 45px;
  padding: 3px;
  border-top: none;
  border-left: none;
  border-right: none;
  color: #f2eeb3;
  font-size: 0.8em;
  background-color: transparent;
  border: 1px solid rgba(128, 128, 128, 0.3);
}
#message h1 {
  position: relative;
  top: 20px;
  display: block;
  width: 180px;
  text-align: center;
  height: auto;
  padding: 5px;
  font-weight: 300;
  color: #f2eeb3;
  font-size: 0.7em;
  letter-spacing: 1px;
  margin: 0 auto;
  border: 1px solid rgba(128, 128, 128, 0.3);
}
a,#thanks {
  position: absolute;
  clear: both;
  display: block;
  font-size: 0.4em;
  color: white;
  opacity: 0.8;
  letter-spacing: 1px;
  text-decoration: none;
}
input[type=range]{
  -webkit-appearance: none;
  border: none;
  outline: none;
}
input[type=range]::-webkit-slider-runnable-track {
  width: 300px;
  height: 10px;
  padding-left: 10px;
  padding-left: 10px;
  border: 1px solid rgba(128, 128, 128, 0.3);
  -webkit-box-shadow: -1px 5px 5px 0px rgba(0,0,0,0.45);
  -moz-box-shadow: -1px 5px 5px 0px rgba(0,0,0,0.45);
  box-shadow: -1px 5px 5px 0px rgba(0,0,0,0.45);
}
input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
  border: none;
  height: 13px;
  width: 13px;
  background: #f2eeb3;
  margin-top: -2px;
}
input[type=range]:focus {
  outline: none;
}
input[type=range]:focus::-webkit-slider-runnable-track {
  outline: none;
}
.support {
  position: relative;
  display: block;
  left: 50px;
  top: 0px;
  float: left;
  color: #f2eeb3;
  margin-bottom: 5px;
  padding: 10px;
  background-color: transparent;
  border: 1px solid rgba(128, 128, 128, 0.3);
  font-family: Arial, Helvetica, sans-serif;
  -webkit-box-shadow: -1px 5px 5px 0px rgba(0,0,0,0.45);
  -moz-box-shadow: -1px 5px 5px 0px rgba(0,0,0,0.45);
  box-shadow: -1px 5px 5px 0px rgba(0,0,0,0.45);
}
#game-menu {
  position: absolute;
  display: none;
  top: 0px;
  float: left;
  clear: both;
  padding-left: 20px;
  text-align: center;
  width: 100%;
  height: 35px;
  z-index: 9999;
}
#cargo,#quests,
#user-stats,
#galaxy-stats,
#feed-info,
#feed-jobs,
#star-data-base,
#feed-station,
#contact-info,
#journal  {
  display: none;
  text-align: center;
  position: absolute;
  width: 200px;
  height: 250px;
  max-height: 250px;
  overflow-x: hidden;
  overflow-y: hidden;
  padding-bottom: 5px;
  padding-top: 5px; 
  z-index: 200;
  border: 1px solid rgba(128, 128, 128, 0.3);
  background-color: rgba(0, 0, 0, 0.3);
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
#cargo,
#quests,
#user-stats,
#galaxy-stats,
#feed-info,
#feed-station,
#contact-info {
  top:50px;
  left: 20px;
}
#cargo h1,
#quests h1,
#user-stats h1,
#galaxy-stats h1,
#feed-info h1,
#feed-jobs h1,
#feed-station h1,
#contact-info h1,
#star-data-base h1,
#journal-right h1,
#computer h1 {
  position: relative;
  display: block;
  width: 85%;
  top: -10px;
  text-align: left;
  font-size: 0.7em;
  padding-left: 5px;
  padding-right: 5px;
  padding-top: 3px;
  color: #f2eeb3;
  font-weight: 300;
  letter-spacing: 1px;
  text-transform: capitalize;
  border-radius: 3%;
}
#cargo h1 div,
#quests h1 div,
#user-stats h1 div,
#galaxy-stats h1 div,
#journal-right h1 div,
.panel-heading h1 div,
#feed-jobs h1 div,
#feed-info h1 div {
  position: relative;
  display: block;
  clear: both;
  left: 7px;
  font-size: 0.8em;
  font-weight: 300;
}
#cargo li,
#quests li,
#user-stats li,
#galaxy-stats li,
#feed-info li,
#jobexport,
#jobimport,
#feed-jobs li,
#contact-info li,
#journal-left li,
.empty {
  position: relative;
  float: left;
  display: block;
  clear: both;
  text-align: left;
  width: 140px;
  cursor: pointer;
  color: #f2eeb3;
  text-transform: capitalize;
  padding-left: 5px; 
  padding-right: 5px;
  padding-top: 3px;
  padding-bottom: 3px;
  font-size: 0.7em;
  margin-bottom: 8px;
  margin-left: 10px;
}
#journal-left li {
  position: relative;
  float: left;
  clear: both;
  display: block;
  margin-bottom: 8px;
  width: 130px;
  margin-right: 0;
  clear: none;
  font-weight: 300;
  font-size: 0.8em;
  margin-top: 10px;
  font-size: 0.7em;
  padding: 5px;
  border: 1px solid rgba(128, 128, 128, 0.3);
}
#journal {
  position: absolute;
  bottom:20px;
  left: 20px;
  width: 430px;
  display: none;
  height:400px;
  max-height: 300px;
}
#journal-left {
  position: absolute;
  padding-top: 10px;
  float: left;
  width: 180px;
  height: auto;
  max-height: 290px;
  overflow-x: hidden;
  overflow-y: scroll;
  border-right: 1px solid rgba(128, 128, 128, 0.3);
}
#journal-right {
  position: fixed;
  padding-top: 5px;
  left: 215px;
  width: 230px;
  height: auto;
}
#searched-star-name,
#searched-star-pop,
#searched-star-planet {
  position: relative;
  display: block;
  width: 200px;
  text-align: left;
  margin-bottom: 5px;
  font-size: 0.7em;
  margin-left: 5px;
  height: 15px;
  color: #f2eeb3;
}
.planet-import,
.planet-export,
.planet-export-price,
.planet-star,
.planet-faction {
  position: relative;
  clear: both;
  display: block;
  margin-left: 20px;
  margin-bottom: 5px;
  color: #f2eeb3;
  width: auto;
  font-size: 0.7em;
  text-align: left;
}
#planet-search,
#item-search {
  position: relative;
  display: block;
  left: 5px;
  top: 10px;
  margin-bottom: 30px;
  letter-spacing: 5px;
  border: 1px solid rgba(128, 128, 128, 0.3);
  background-color: black;
  font-weight: 300;
  z-index: 100;
  font-size: 0.6em;
  width: 149px;
  height: 13px;
  font-family: Arial, Helvetica, sans-serif;
}
.notification {
  position: absolute;
  display: block;
  z-index: 999;
  width: 20px;
  height: 20px;
  color: #f2eeb3;
  font-size: 0.6em;
  text-transform: capitalize;
  left: 85px;
  top: 3px;
}
.panel-default {
  position: absolute;
  display: block;
  clear: both;
  bottom: 20px;
  right: 20px;
  float: right;
  width: 310px;
  height: 200px;
  padding-bottom: 5px;
  border: 1px solid rgba(128, 128, 128, 0.3);
  background-color: rgba(0, 0, 0, 0.3);
}
.list-group {
  width: 67%;
  height: 160px;
  padding-right: 20px;
  max-height: 110px;
  overflow: hidden;
  overflow-x: hidden;
  overflow-y: scroll;
}
.panel-default li {
  position: relative;
  float: left;
  display: block;
  text-align: left;
  left: -30px;
  clear: both;
  margin-bottom: 8px;
  padding: 3px;
  color: #f2eeb3;
  font-size: 0.7em;
  width: auto;
}
.panel-heading {
  font-size: 0.8em;
  color: #f2eeb3;
  padding-left: 5px;
  padding-right: 5px;
  padding-top: 3px;
  padding-bottom: 3px;
  margin-bottom: 20px;
  font-weight: 300;
}
.chat-button {
  position: absolute;
  left: 195px;
  width: 100px;
  height: 20px;
  bottom: 9px;
  color: white;
  cursor: pointer;
  background: black;
  border: 1px solid rgba(128, 128, 128, 0.3);
}
#chat-input {
  position: absolute;
  left: 5px;
  bottom: 9px;
  width: 170px;
  height: 12px;
  border: none;
  border-radius: 0;
  z-index: 9999;
  border: 1px solid rgba(128, 128, 128, 0.3);
  background-color: black;
}
#selected-object {
  position: absolute;
  top: 45px;
  left: 130px;
  width: 115px;
  height: 120px;
  opacity: 0.8;
  border-radius: 50%;
  border-spacing: 10px;
  border:1px solid black;
  background-size: 210px;
  background-repeat: repeat;
  box-shadow: inset 15px 5px 30px 3px rgb(0, 0, 0),
  inset 10px 30px 10px 3px rgba(255, 255, 255, 0.1);
  -moz-animation-iteration-count: infinite;
  -moz-animation-timing-function: linear;
  -moz-animation-duration: 10s;
  -webkit-animation-name: roateobjectFox;
  -webkit-animation-iteration-infinitepla: count;
  -webkit-animation-timing-function: linear;
  -webkit-animation-duration: 10s;    
  -ms-animation-name: roateobjectFox;
  -ms-animation-iteration-count: infinite;
  -ms-animation-timing-function: linear;
  -ms-animation-duration:10s;
  animation-name: roateobjectFox;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  animation-duration: 10s;
}
.travel-button,.journal-back {
  position: absolute;
  bottom: 0px;
  display: block;
  width: 90px;
  height: 25px;
  margin: 0 auto;
  cursor: pointer;
  text-align: center;
  padding: 3px;
  color: #f2eeb3;
  font-size: 0.7em;
  background-color: transparent;
  border: 1px solid rgba(128, 128, 128, 0.3);
}
.area-stats,
.ship-stats,
.galaxy-back,
.ship-computer,
.ship-journal,
#save-game {
  position: relative;
  float: left;
  cursor: pointer;
  text-align: center;
  display: inline-block;
  width: auto;
  font-size: 0.7em;
  height: 32px;
  border: none;
  border-radius: 3%;
  font-family: Arial, Helvetica, sans-serif;
  border: 1px solid rgba(128, 128, 128, 0.8);
  margin-left: 5px;
  margin-top: 5px;
  color: #f2eeb3;
  background: none;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 0px 0px;
  background-color: none;
}
#system-information {
  position: absolute;
  float: right;
  display: none;
  clear: both;
  top: 50px;
  right: 20px;
  width: 500px;
  height: 300px;
}
#galaxy-stats {
  position: relative;
  display: inline-block;
  width: 200px;
  right: 300px;
  height: 200px;
  top: -20px;
  left: 30px;
}
#mini-map {
  position: relative;
  display: inline-block;
  float: right;
  width: 250px;
  height: 250px;
  border-radius: 50%;
  border: 1px solid #f2eeb3;
}
.mini-map-sun {
  position: absolute;
  margin: 0 auto;
  display: block;
  top: 45%;
  left: 45%;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background-color: #f2eeb3;
}
.mini-map-planet {
  position: absolute;
  display: block;
  width: 10px;
  height: 10px;
  left: 30px;
  top: 100px;
  border-radius: 50%;
  background-color: yellow;
}
#user-stats {
  width: 280px;
  top: 50px;
  left: 23px;
  height: auto;
  max-height: 200px;
}
#user-status {
  position: absolute;
  width: 0;
  height: 0;
  left: 120px;
  color: transparent;
  border-left: 30px solid transparent;
  border-right: 30px solid transparent;
  border-bottom: 75px solid #f2eeb3;
  color: black;
  padding: -1px;
  line-height: 100px;
  font-size: 0.7em;
  text-indent: -14px;
  -moz-animation-name: orbit;
  -moz-animation-iteration-count: infinite;
  -moz-animation-timing-function: linear;
  -moz-animation-duration: 10s;
  -webkit-animation-name: orbit;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
  -webkit-animation-duration: 10s;    
  -ms-animation-name: orbit;
  -ms-animation-iteration-count: infinite;
  -ms-animation-timing-function: linear;
  -ms-animation-duration:10s;
  animation-name: orbit;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  animation-duration: 10s;
}
#feed-menu {
  position: relative;
  display: none;
  margin-left: 10px;
  float: left;
  text-align: center;
  width: auto;
  height: auto;
}
#info-buttons {
  position: relative;
  float: left;
  text-align: center;
  width: auto;
  height: auto;
}
#tabs,#contact-menu button {
  position: relative;
  display: inline-block;
  float: left;
  width: auto;
  height: 32px;
  font-size: 0.7em;
  text-align: center;
  border: 1px solid rgba(128, 128, 128, 0.8);
  margin-left: 5px;
  margin-top: 5px;
  background-repeat: no-repeat;
  background-position: center;
  color: #f2eeb3;
  background-size: 0px 0px;
  background-color: transparent;
}
.feed-market {
  position: relative;
  display: block;
  float: left;
  width: 310px;
  overflow-x: hidden;
  overflow-y: scroll;
}
#market-tabs {
  position: relative;
  display: inline-block;
  top: -20px;
  width: 75px;
  height: auto;
  font-size: 0.8em;
  font-weight: 300;
  border: none;
  cursor: pointer;
  color: #f2eeb3;
  background-color: transparent;
  border: 1px solid rgba(128, 128, 128, 0.3);
  font-family: Arial, Helvetica, sans-serif;
}
.market-item {
  position: relative;
  display: inline-block;
  float: left;
  width: 300px;
  height: auto;
  margin-bottom: 3px;
  list-style-type: none;
}
#item-name {
  position: relative;
  float: left;
  font-weight: 300;
  text-indent: 30px;
  width: 110px;
  font-size: 0.7em;
  text-align: left;
  margin-left: 2px;
  color: #f2eeb3;
}
#item-cost {
  position: relative;
  float: left;
  text-align: left;
  display: block;
  padding: 2px;
  width: auto;
  height: 15px; 
  letter-spacing: 1px;
  font-size: 0.7em;
  padding-left: 5px;
  color: #f2eeb3;
}
.feed-market div button,
.buy-items {
  position: relative;
  width: 80px;
  float: right;
  display: inline-block;
  margin-bottom: 10px;
  margin-right: 20px;
  background: none;
  border: none;
  padding: 3px;
  color: #f2eeb3;
  border: 1px solid rgba(128, 128, 128, 0.3);
  font-size: 0.7em;
  font-weight: 300;
  font-family: Arial, Helvetica, sans-serif;
  cursor: pointer;
}
#ship-contact {
  position: relative;
  display: none;
  float: left;
  bottom: 0;
  width: 300px;
  height: 100px;
  padding-left: 3px;
}
#contact-menu {
  position: relative;
  display: none;
  float: left;
  margin-left: 10px;
  width: auto;
  height: 100%;
  bottom: 0;
}
.selected-user-model {
  position: absolute;
  top: 63px;
  right: 40px;
  z-index: 100;
  width: 0;
  height: 0;
  padding: -1px;
  border-left: 25px solid transparent;
  border-right: 25px solid transparent;
  -moz-animation-name: orbit;
  -moz-animation-iteration-count: infinite;
  -moz-animation-timing-function: linear;
  -moz-animation-duration: 10s;
  -webkit-animation-name: orbit;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
  -webkit-animation-duration: 10s;    
  -ms-animation-name: orbit;
  -ms-animation-iteration-count: infinite;
  -ms-animation-timing-function: linear;
  -ms-animation-duration:10s;
  animation-name: orbit;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  animation-duration: 10s;
}
#contact-info {
  position: absolute;
  display: none;
  float: left;
  top: 50px;
  left: 330px;
  width: 240px;
  z-index: 99999; 
}
.hit {
  position: absolute;
  margin-top: -10px;
  display: block;
  width: 100px;
  height: 100px;
  font-size: 1.2em;
  z-index: 9999999;
}
#what-object {
  color: #f2eeb3;
  position: absolute;
  width: auto;
  letter-spacing: 1px;
  font-size: 0.7em;
  line-height: 20px;
  z-index: 200;
  margin-left: 20px;
  margin-top: 20px;
  z-index: 999999;
  text-transform: capitalize;
}
#star-count {
  padding-left: 10px;
  background: none;
  border: none;
  color: #f2eeb3;
  pointer-events: none;
}
#fader {
  position: absolute;
  right: 30px;
  top: 30px;
  height: 30px;
  width: 100px;
  cursor: pointer;
}
#item-demand{
  position: relative;
  float: left;
  top: 0px;
  width: 210px;
  height: auto;
  padding-right: 15px;
  overflow-x: hidden;
  overflow-y: hidden;
}
#journal-right p {
  position: relative;
  top: 10px;
  text-indent: 5px;
  text-align: left;
  font-size: 0.7em;
}
.item-graf {
  position: relative;
  float: left;
  display: block;
  clear: both;
  width: auto;
  height: auto;
  text-align: left;
  list-style-type: none;
  padding-bottom: 8px;
  padding: 3px;
}
#graf-text {
  position: absolute;
  top: -13px;
  text-transform: capitalize;
  color: black;
  z-index: 9999;
}
.item-faction-name,
.item-graf-name,
.item-graf-price,
.item-graf-demand 
 {
  position: relative;
  display: block;
  clear: both;
  margin-bottom: 5px;
  left: 5px;
  float: left;
  color: #f2eeb3;
  font-size: 0.7em;
}
#buy-market {
  height: 100px;
  max-height: 100px;
  padding-top: 30px;
  border-bottom: 1px solid rgba(128, 128, 128, 0.3);
}
#sell-market {
  padding-top: 20px;
  height: auto;
  padding-bottom: 20px;
  max-height: 500px;
}
#market-holder {
  top: 10px;
  left: 30px;
  font-size: 0.7em;
}
#sell-market div {
  text-align: left;
  color: #f2eeb3;
  padding-top: 10px;
}
#search-item {
  position: absolute;
  right: 5px; 
  width: 110px;
  padding: 3px;
  border: 1px solid rgba(128, 128, 128, 0.3);
  color: #f2eeb3;
  font-size: 0.7em;
  background-color: transparent;
}
.buyers {
  bottom: 30px;
  left: 93px;
}
.sellers {
  bottom: 55px;
  left: 93px;
}
.journal-right-back {
  bottom: 5px;
  left: 93px;
}

#player-bounty button {
  margin-top: 10px;
  text-align: center;
  padding-left: 5px;
  padding-top: 3px;
  padding-bottom: 3px;
  width: 130px;
  color: #f2eeb3;
  font-size: 300;
  font-size: 0.9em;
  background: transparent;
  border: 1px solid rgba(128, 128, 128, 0.3);
}
#contact-info button {
  position: absolute;
  display: block;
  float: left;
  right: 10px;
  width: 100px;
  height: 20px;
  margin-bottom: 5px;
  background-color: transparent;
  color: #f2eeb3;
  font-size: 0.7em;
  border: 1px solid rgba(128, 128, 128, 0.3);
}
#feed-info {
  width: 415px;
  height: 220px;
  max-height: 200px;
  text-align: center;
}
#feed-jobs {
  position: absolute;
  right: 0px;
  top:0px;
  display: block;
  width: 180px;
  height:auto;
  max-height: 190px;
  border: none;
  background: none;
}
.ship-stats:hover,
.area-stats:hover,
.ship-computer:hover,
#save-game:hover,
.galaxy-back:hover,
#contact-menu button:hover,
#tabs:hover,
#feed-station button:hover,
.ship-journal:hover,
#quests li:hover,
#cargo li:hover,
#message button:hover,
#search-item:hover,
.support:hover,
#player-bounty button:hover,
#attack-ship:hover,
#trade-ship:hover   {
  opacity: 0.8;
  cursor: pointer;
}
/* objects */
.sun-star {
  position: relative;
  top: 225px;
  display: block;
  margin: 0 auto;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  opacity: 0.7;
  -webkit-box-shadow: inset 5px 3px 7px 2px rgba(0,0,0,0.55);
  -moz-box-shadow: inset 5px 3px 7px 2px rgba(0,0,0,0.55);
  box-shadow: inset 7px 3px 7px 2px rgba(0,0,0,0.55);
  background-image: url(textures/sun.jpg);
  background-size: 100px;
  -moz-animation-iteration-count: infinite;
  -moz-animation-timing-function: linear;
  -moz-animation-duration: 10s;
  -webkit-animation-name: roateobjectFox;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
  -webkit-animation-duration: 10s;    
  -ms-animation-name: roateobjectFox;
  -ms-animation-iteration-count: infinite;
  -ms-animation-timing-function: linear;
  -ms-animation-duration:10s;
  animation-name: roateobjectFox;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  animation-duration: 10s;
}  
.users-ship {
  position: absolute;
  display: none;
  z-index: 100;
  top: 80%;
  left: 50%;
  margin: 0 auto;
  width: 0;
  height: 0;
  color: transparent;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-bottom: 13px solid white;
}
.users-ship-two {
  position: absolute;
  z-index: 100;
  top: 5%;
  left: 5%;
  width: 0;
  height: 0;
  color: transparent;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-bottom: 13px solid white;
}
.trucker, .pirate, .police, .stopped {
  position: absolute;
  display: none;
  top: 0px;
  left: 0px;
  opacity: 0.8;
  width: 0;
  height: 0;
  z-index: 99999;
  color: transparent;
  padding: -1px;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
}
.planet, .selected-planet {
  position: absolute;
  display: inline-block;
  z-index: 1;
  color: transparent;
  border-radius: 50%;
  opacity: 0.8;
  -webkit-box-shadow: inset 5px 3px 7px 2px rgba(0,0,0,0.45);
  -moz-box-shadow: inset 5px 3px 7px 2px rgba(0,0,0,0.45);
  box-shadow: inset 7px 3px 7px 2px rgba(0,0,0,0.45);
}
.unknown, .selected-unknown {
  position: absolute;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  border: 2px solid #f2eeb3;
  color: transparent;
}
.star, .selected-star {
  position: absolute;
  display: inline-block;
  color: transparent;
  border-radius: 50%;
  opacity: 0.8;
  background-color: #FFE5B4;
  -webkit-box-shadow: 0px 0px 1px 1px rgba(255, 255, 0, 0.5); 
  -moz-box-shadow: 0px 0px 1px 1px rgba(255, 255, 0, 0.2);  
  box-shadow: 0px 0px 1px 1px rgba(255, 255, 0, 0.2);
} 





.asteroid, .selected-asteroid,.planet, .selected-planet  {
  position: absolute;
  color: transparent;
}
.unknown, .asteroid {
  -moz-animation-iteration-count: infinite;
  -moz-animation-timing-function: linear;
  -moz-animation-duration: 10s;
  -webkit-animation-name: orbit;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
  -webkit-animation-duration: 10s;    
  -ms-animation-name: orbit;
  -ms-animation-iteration-count: infinite;
  -ms-animation-timing-function: linear;
  -ms-animation-duration: 10s;
  animation-name: orbit;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  animation-duration: 10s;
}
.bomb,.trall {
  position: absolute;
  display: block;
  width: 4px;
  height: 4px;
  border-radius: 10px;
  background-color: yellow;
}
.trall {
  border-radius: 50%;
  width: 5px;
  height: 5px;
  opacity: 0.8;
  background-color: #f2eeb3;
}
#playerHit,
#npcHit  {
  font-weight: 300;
  letter-spacing: 2px;
  font-size: 0.8em;
}
#player-bounty {
  position: absolute;
  right: 45px;
  text-align: left;
  width:100px;
  font-size: 0.7em;
  color: #f2eeb3;
}
.selected-planet:before,
.selected-unknown:before,
.selected-star:before,
.selected-asteroid:before,
#selected-ship:before,
.users-ship:before{
  text-indent: 65px;
  color: #f2eeb3;
  font-size: 0.7em;
  letter-spacing: 1.5px;
  position: absolute;
  text-align: center;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  border: 2px dotted #f2eeb3;
}
.moon {
  position: absolute;
  border-radius: 50%;
}
/* other (wraps) */
body, html {
  height: 99%;
  background-color: black;font-family: Arial, Helvetica, sans-serif;
  cursor: crosshair;
  overflow-x: hidden;
  overflow-y: hidden;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.god {
  position: fixed;
  left: 0;
  top: 0;
  overflow:hidden;
  overflow-x: hidden;
}
#space {
  position: absolute;
  display: none;
  overflow:hidden;
  top: 0;
  left: 0;
}
#game-over {
  position: relative;
  display: none;
  color: #f2eeb3;
  text-align: center;
}
#game-over h1 {
  position: relative;
  display: block;
  margin-top: 15%;
  width: 300px;
  letter-spacing: 5px;
  padding: 10px;
  font-size: 0.7em;
}
#game-over p {
  position: relative;
  display: block;
  width: 200px;
  margin-top: 20px;
  letter-spacing: 1px;
  font-size: 0.6em;
  padding: 10px;
  text-transform: capitalize;
}
#game-over button {
  position: relative;
  margin-top: 20px;
  display: block;
  width: 200px;
  height: 30px;
  padding: 5px;
  border: 1px solid rgba(128, 128, 128, 0.3);
  color: #f2eeb3;
  font-size: 0.9em;
  background-color: transparent;
  font-family: Arial, Helvetica, sans-serif;
}
.sun {
  position: relative;
  display: none;
  top: 20%;
  left: 0;
  margin: 0 auto;
  width: 35%;
  height: 50%;
  z-index: 100;
  z-index: 100;
  background-size: 100% 100%;
  -moz-animation-name: orbit;
  -moz-animation-iteration-count: infinite;
  -moz-animation-timing-function: linear;
  -moz-animation-duration: 90s;
  -webkit-animation-name: orbit;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
  -webkit-animation-duration: 90s;    
  -ms-animation-name: orbit;
  -ms-animation-iteration-count: infinite;
  -ms-animation-timing-function: linear;
  -ms-animation-duration: 90s;
  animation-name: orbit;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  animation-duration: 90s;
}
@-webkit-keyframes orbit {
  from {-webkit-transform: rotate(0deg);}
  to {-webkit-transform: rotate(360deg);}
}
@keyframes orbit {
  from {-webkit-transform: rotate(0deg);}
  to {-webkit-transform: rotate(360deg);}

}
@-moz-keyframes orbit {
  from {-moz-transform: rotate(0deg);}
  to {-moz-transform: rotate(360deg);}
}
::-webkit-scrollbar {
    width: 5px;
    height: 18px;
}
::-webkit-scrollbar-thumb {
    height: 6px;
    border: 1px solid #f2eeb3;
    background-clip: padding-box;
    -webkit-border-radius: 1px;
    background-color: #f2eeb3;
}
::-webkit-scrollbar-button {
    width: 0;
    height: 0;
    display: none;
}
::-webkit-scrollbar-corner {background-color: transparent;}
@-webkit-keyframes roateobjectFox {
  from { background-position: 0 0; }
  to { background-position: 300% 0; }
}
@-moz-keyframes roateobjectFox {
  from { background-position: 0 0; }
  to { background-position: 300% 0; }
}
@keyframes roateobjectFox {
  from { background-position: 0 0; }
  to { background-position: 300% 0; }
} 
@-webkit-keyframes Starflash {
  0% {
    opacity: 1;
    margin-top: 0px;
    margin-left: 5px;
  }
  50% {
    opacity: 0.8;
    margin-top: 5px;
    margin-left: 0px;
  }
  100% {
    opacity: 1;
    margin-top: 0px;
    margin-left: 5px;
  }
}
@keyframes Starflash {
  0% {
    opacity: 1;
    margin-top: 0px;
    margin-left: 5px;
  }
  50% {
    opacity: 0.8;
    margin-top: 5px;
    margin-left: 0px;
  }
  100% {
    opacity: 1;
    margin-top: 0px;
    margin-left: 5px;
  }
}
#computer {
  position: absolute;
  display: none;
  bottom: 20px;
  left: 460px;
  width: 443px;
  height: auto;
  max-height: 300px;
  padding-top: 10px;
  border: 1px solid rgba(128, 128, 128, 0.3);
  background-color: rgba(0, 0, 0, 0.3);
}
#quests,#cargo {
  position: relative;
  float: left;
  top: 0px;
  max-height: 300px;
  display: block;
  border:none;
  padding-bottom: 15px;
  background: none;
  width: 210px;
  overflow-x: hidden;
  overflow-y: scroll;
}
#planet-demand,#item-demand {display: none;}
#planet-demand {height: 100px;}
#cargo h1,
#quests h1 {border: 1px solid rgba(128, 128, 128, 0.3);padding: 5px;border-radius: 0;}
#feed-jobs li {text-align: center;border: 1px solid rgba(128, 128, 128, 0.3);}
#quests li,
#cargo li {padding-bottom: 8px;border-bottom: 0px solid rgba(128, 128, 128, 0.3);}
.custom-file-input::-webkit-file-upload-button {visibility: hidden;}
#galaxy-stats {height: auto;max-height: 200px;}
#feed-info,#feed-station {left:330px;top:50px;height: 230px;}
#feed-station {width:300px;height: 300px;max-height: 300px;padding-right: 10px}
#feed-info li {left: 10px;}
#time-left {position: relative;margin-top: 5px;}
#contact-info {height: 145px;}
#menu-2 {padding-bottom: 5px;width: 185px;}
#menu-4 {position: relative;top: 35px;}
.player-model-text {left: 70px;}
.sun-model-text {top: 25px;left: 60px;}
.planet-model-text {top: 40px;left: 60px;}
#thanks a {font-size: 1.8em;letter-spacing: 1px;line-height: 20px;position: relative;float: left;
display: block;}
#change-log:before {content: "Change Log: "}
#twitter:before {content: "Twitter: "}
button {outline: none}
.travel-button {right: 140px;}
.journal-back {left: 100px;}
.yes {float: right;right: 20px;}
.no {float: left;left: 20px;}
.feed-market h1 {height: auto;}
#user-stats li {width: auto;}
#attack-ship {top: 10px;}
#trade-ship {top: 35px;}
.start-game:hover {bottom: 28px;opacity: 0.8;cursor: pointer;}
#computer div h1:hover,#feed-jobs li:hover,.buy-items:hover {bottom: -2px;opacity: 0.8;cursor: pointer;}
#game-over button:hover {cursor: pointer;opacity: 0.8;margin-top: 22px;}
#planet-name:before {content: "Planet ";}
#planet-pop:before {content: "Population: ";}
#planet-export:before {content: "Main export: ";}
#planet-import:before {content: "Importing: "}
#star-planets:before {content: "This Star System has ";}
#star-planets::after {content: " planets";}
#star-data-base h1:before {content: "Star: "}
#user-name:before {content: "Name: "}
#galaxy-name:before {content: "Name: "}
#ship-faction:before {content: "Faction: "}
#ship-hull:before {content: "Health: ";}
#ship-fuel:before {content: "Fuel: ";}
.empty:before {content: "This is ";}
#ship-cargo:before {content: "Cargo Size: ";}
#ship-quests:before {content: "Quest Size: "}
#ship-credits:before {content: "Credits: ";}
#ship-credits::after {content: "c";}
#star-number:before,#planet-number:before {content: "Galaxy has ";}
#star-number::after {content: " Stars";}
#planet-number::after {content: " Planets";}
.galaxy-home:before {content: "Galaxy home to ";}
.system-home:before {content: "System home to ";}
#people-number::after {content: " living things.";}
#planet-faction:before {content: "Faction: ";}
#planet-cities:before {content: "Major cities: ";}
#planet-feeling:before {content: "Feeling: ";}
#selected-user-size:before {content: "User's cargo: "}
.item:before {content: "Item: "}
.good:before {content: "Quest: "}
#ship-hull::after,
#ship-fuel::after,
#ship-cargo::after,
#ship-quests::after {content: "%";}
#build:before {content: "[ Version "}
#build::after {content: " ]"}
#build {font-size: 0.8em;position: relative;margin-left: 10px;}
#ship-visited:before {content: "Visited planets: "}
.panel-default li::after,#galaxy-name::after,#galaxy-name::after {content: "."}
.data-listing-two:before {content: "Import: ";}
.data-listing-three:before {content: "Export: ";}
.data-listing-four:before {content: "Type: ";}
.data-listing-five:before, #selected-user-faction:before {content: "Faction: ";}
.number-of-planets:before {content: "Planets: "}
.number-of-npcs:before {content: "Users: "}
input:focus { background: black;}
.data-button:before {content: "Star: "}
.data-menu div:before {content: "Planet "}
.jobquest:before {content: "Quest: "}
#item-cost:before {content: "Cost: "}
.selling:before {content: "Buying for: ";}
#item-cost::after,
#total::after,
.item-graf-price::after,#player-bounty button::after {content: "c";}
.planet-export:before {content: "Export: ";}
.planet-import:before {content: "Import: "}
.planet-faction:before {content: "Faction: ";}
.planet-star:before {content: "Star: "}
#visited::after {content: " (Visited) "}
#journal-left li:before {content: "Planet: "}
.planet-data:hover,.jobquest:hover {opacity: 0.8;}
#total:before {content: "Total: ";}
#not-paid::after {content: " (Not paid for)";}
#selected-user-name:before {content: "Name: ";}
#selected-user-job:before {content: "Job: ";}
#contact-info h1::after {content: " Stats"}.selected-planet:before {content: "Planet";top: -18px;left: -18px;}
.selected-unknown:before {content: "Unknown";top: -21px;left: -21px;}
.selected-star:before {content: "Star";top: -26px;left: -25px;}
.selected-asteroid:before {content: "Asteroid";top: -26px;left: -25px;}
#selected-ship:before {top: -23px;left: -31px;}
#selected-ship.trucker:before {content: "Trucker"}
#selected-ship.pirate:before {content: "Pirate"}
#selected-ship.police:before {content: "Police"}
.travel-button:hover,.journal-back:hover {bottom: -1px;opacity: 0.8;}
.planet-item-data:before {content: "Export: "}
.trucker {border-bottom: 13px solid #D4AF37;}
.pirate {border-bottom: 13px solid #FF2400;}
.stopped {border-bottom: 13px solid #f2eeb3;}
.police {border-bottom:  13px solid #89CFF0;}
#time-left:before {content: "Time left: ";}
#searched-star-name:before {content: "Star: "}
#searched-star-pop:before {content: "Population: "}
#searched-star-planet:before {content: "Planets: "}
.item-graf-name:before {content: "Item: "}
.item-graf-price:before {content: "Price: "}
.item-faction-name:before {content: "Faction: "}
.item-graf-demand:before {content: "Quantity: "}
#buy-market:before {content: "Export:";}
#sell-market:before {padding-top: 10px;content: "Import:";}
#attack-ship:before {content: "Fight "}
#trade-ship:before {content: "Trade ";}
#quest-number:before {content: "Available Quests: ";}
#player-bounty:before {content: "Wanted ";}
#player-bounty button:before {content: "Pay this bounty:  ";}
#playerHit::after {content: " /20";}
#npcHit::after {content: " /100";}
#sell-market:before,
#buy-market:before {
  color: #f2eeb3;
  position: absolute;
  float: left;
  font-size: 0.7em;
  top: 3px;
  left: 10px;
}



#user-ship-name {
  font-family: Arial, Helvetica, sans-serif;
  -webkit-box-shadow: -1px 5px 5px 0px rgba(0,0,0,0.45);
  -moz-box-shadow: -1px 5px 5px 0px rgba(0,0,0,0.45);
  box-shadow: -1px 5px 5px 0px rgba(0,0,0,0.45);
}