/* @import "options.css"; */
/* @import "shop.css"; */
/* @import "stats.css"; */
/* @import "editor.css"; */
/* @import "login.css"; */
@font-face {
  font-family: "LCDSolid";
  src: url("Munro.ttf");
}

#canvas {
  margin: 0;
  padding: 0;
  display: block;
}

html,
body {
  margin: 0;
  padding: 0;
}

body,
p,
button,
input,
select,
textarea,
span {
  font-family: LCDSolid, Verdana, Geneva, Arial, Helvetica, sans-serif;
  /*text-shadow: 1px 1px 0px black;*/
  text-shadow: rgba(0, 0, 0, 1) 0px 0px 2px;
  /* cursor: url("cursor.cur"), auto; */
  color: white;
}

button {
  user-select: none;
}

button:disabled {
  user-select: none;
  color: lightgrey;
}

p {
  font-family: LCDSolid, Verdana, Geneva, Arial, Helvetica, sans-serif;
  margin: 0 4px;
}

/* pretty much all divs */
.ingameWindow,
.ingameDefeat,
.ingameVictory {
  -moz-box-shadow: inset 0px 0px 2px 0px black;
  -webkit-box-shadow: inset 0px 0px 2px 0px black;
  box-shadow: inset 0px 0px 2px 0px black;
  background-color: #275494;
  border: 2px solid #6898dd;
  font-weight: bold;
  box-shadow: rgba(0, 0, 0, 0.6) 0px 0px 8px;
}
.ingameDefeat {
  background-color: rgb(80, 14, 14);
  border: 5px solid rgb(247, 125, 125);
}
.ingameVictory {
  background-color: rgb(126, 102, 22);
  border: 5px solid rgb(240, 232, 125);
}

/* #bingMessageWindow {
  position: absolute;
  top: 10px;
  width: 400px;
  left: 50%;
  margin-left: -200px;
  display: none;
  z-index: 9999;
}

#bingMessageWindow * {
  margin: 10px;
  text-align: center;
} */

.clanListTitleLine {
  font-size: 26px;
  color: darkorange;
}

.draggable_ {
  cursor: url("cursor-drag.cur"), auto;
  line-height: 32px;
}

.ladderGameTimeTD {
  color: rgb(255, 255, 100);
}

.inlineBanButton2 {
  position: absolute;
  top: 10px;
  right: 130px;
}

/* if a div contains text (like a chat window for example) theres a sub div in the div. And this sub div is class=textContainer (its scrollable) */
.textContainer {
  font-size: 16px;
  overflow: auto;
  word-break: break-word;

  position: absolute;
  top: 60px;
  bottom: 6px;
  left: 6px;
  right: 4px;
}

/* the "x" button in the top right of some windows */
.closeButton,
.victoryclosebutton,
.lossclosebutton {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 50px;
  height: 50px;
  color: red;
  font-size: 30px;
}
.victoryclosebutton {
  background-color: rgb(126, 102, 22);
  color: rgb(240, 232, 125);
}
.lossclosebutton {
  background-color: rgb(80, 14, 14);
  color: rgb(247, 125, 125);
}

.quitLogo {
  top: -42px;
  left: 175px;
  width: 60px;
  position: absolute;
}

#freeGoldButton {
  background: #ce4242;
}

h2 {
  font-size: 22px;
}

/* all inputs and buttons */
input:not([type="checkbox"]):not([type="radio"]),
button,
textarea {
  -moz-box-shadow: inset 0px 1px 0px 0px #cae3fc;
  -webkit-box-shadow: inset 0px 1px 0px 0px #cae3fc;
  box-shadow: inset 0px 1px 0px 0px #cae3fc;
  background-color: #5082b5;
  border: 2px solid #0c1c37;
  height: 32px;
  font-size: 22px;
}

input:hover,
button:hover {
  background-color: #769ec8;
}

button:active {
  background-color: #306091;
}

button:disabled {
  background: grey;
  border: 2px solid #0c1c37;
}

/* used in the game ended statistics, where a table is displayed */
td {
  padding: 2px 8px;
}

#loginPromptButton {
  display: inline;
}

#loginWindowBackButton {
  position: absolute;
  bottom: 15px;
  left: 15px;
}

#loginWindow,
#registerWindow,
#recoveryWindow {
  position: absolute;
  left: 50%;
  top: 50px;
  margin-left: -350px;
  width: 700px;
  height: 500px;
}

#agbAcceptDiv {
  position: absolute;
  left: 50%;
  top: 50px;
  margin-left: -350px;
  width: 700px;
  height: 500px;
}

#agbAcceptSentence {
  position: absolute;
  left: 50%;
  top: 20px;
  margin-left: -300px;
  width: 600px;
  text-align: center;
}

.msgFailedStatus {
  color: rgb(189, 189, 189);
}

.highlighted {
  background-color: rgba(255, 255, 255, 0.2);
}

.tabletop {
  font-size: 20px;
}

.underline {
  text-decoration: underline;
}

.league-span {
  background-image: url("/game/league-icons.png");
  background-size: cover;
  display: inline-block;
  vertical-align: middle;
}

#cancelLadderButton {
  font-size: 36px;
  height: 48px;
}

.league-link {
  vertical-align: top;
}

#playerNameDisplay {
  font-size: 25px;
  margin-right: 10px;
  display: inline;
}

#mainLeagueLink {
  float: center;
  width: 164px;
  height: 120px;
  margin: 10px auto;
}

#mainExpDiv {
  margin: 0 auto;
  display: inline;
}

#faqContainer {
  position: absolute;
  right: 340px;
  top: 11px;
}

#faqLink {
  color: #fcefa1;
  font-size: 26px;
  background-color: #275494;
  border: 2px solid #6898dd;
  padding: 4px;
}

/* #versionNumber {
  position: absolute;
  right: 80px;
  top: 11px;
  text-decoration: underline;
  font-size: 24px;
} */

#changelogDiv {
  z-index: 1003;
  display: none;
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.75);
}

.changelogFade {
  position: absolute;
  width: 100%;
  height: 10%;
}

#changelogFadeTop {
  top: 0px;
  background-image: linear-gradient(to top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75) 100%);
}

#changelogFadeBottom {
  bottom: 0px;
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75) 100%);
}

#changelogContents {
  position: absolute;
  width: 54%;
  height: 100%;
  left: 23%;
  background-color: #275494;
  overflow: auto;
  scrollbar-width: none;
}

#changelogContents::-webkit-scrollbar {
  display: none;
}

/* the window where the statistics is displayed in, after a game ended */
/* #winLossWindow {
  position: absolute;
  left: 50%;
  top: 100px;
  margin-left: -200px;
  width: 400px;
  height: 200px;
} */

#statisticsWindow {
  position: absolute;
  left: 50%;
  top: 50px;
  margin-left: -350px;
  width: 800px;
  height: 550px;
  z-index: 1;
}

#showLadderPointsDiv {
  position: absolute;
  width: 100%;
  bottom: 10px;
  text-align: center;
}
/* 
#winLossWindowQuitButton {
  position: absolute;
  left: 50%;
  margin-left: -120px;
  width: 240px;
  top: 120px;
} */

#saveReplayButton {
  position: inherit;
  width: 150px;
  bottom: 26px;
  right: 30px;
}

/* ingame chat history window */
/* #chatHistoryWindow {
  position: absolute;
  left: 50%;
  top: 50px;
  margin-left: -300px;
  width: 600px;
  height: 500px;
} */

/* the chat window in the lobby */
#lobbyChatWindow {
  position: absolute;
  left: 340px;
  top: 56px;
  right: 340px;
  bottom: 230px;
}

/* the chat window in a game lobby */
#lobbyGameChatWindow {
  position: absolute;
  top: 310px;
  width: 520px;
  height: 290px;
  /*bottom: 240px;*/
  z-index: 0;
}

/* the window in the lobby where the list of games is displayed */
#gamesWindow {
  position: absolute;
  left: 20px;
  top: 326px;
  width: 300px;
  bottom: 180px;
}

#accInfoWindow {
  position: absolute;
  left: 20px;
  top: 56px;
  width: 300px;
  height: 250px;
  text-align: center;
}

/* the window in the lobby where the list of players is displayed */
#playersWindow {
  position: absolute;
  right: 20px;
  top: 56px;
  width: 300px;
  bottom: 180px;
}

#lobbyInput {
  position: absolute;
  left: 340px;
  bottom: 180px;
  right: 348px;
}

#lobbyGameInput {
  position: absolute;
  width: 100%;
  bottom: -60px;
  left: -5px;
}

#lobbyChatInput {
  width: 100%;
}

#lobbyChatInput::placeholder {
  color: #d4d4d4;
}

#lobbyGameChatInput {
  width: 100%;
}

#lobbyGameChatInput::placeholder {
  color: #d4d4d4;
}

/* the window where you manage the players and choose a map for a game (the window itself is invisible, but its parent for all the containing objects) */
#gameLobbyWindow {
  background: none;
  border: 0;
  -moz-box-shadow: inset 0px 0px 0px 0px #cae3fc;
  -webkit-box-shadow: inset 0px 0px 0px 0px #cae3fc;
  box-shadow: inset 0px 0px 0px 0px #cae3fc;

  position: absolute;
  left: 50%;
  top: 40px;
  width: 1000px;
  bottom: 230px;
  margin-left: -500px;
}

#mapDescriptionDiv {
  position: absolute;
  background-color: #242424;
  left: 280px;
  top: 0px;
  width: 240px;
  height: 210px;
  font-size: 16px;
}

#mapDescriptionTextArea {
  position: absolute;
  left: 6px;
  top: 6px;
  right: 6px;
  bottom: 6px;
  white-space: pre-wrap;
}

#moveMeToSpecBtn {
  position: absolute;
  left: 80px;
  bottom: -535px;
  width: 200px;
}

#showAllLeaguesButton {
  position: absolute;
  right: 6px;
  top: 10px;
}

/* list where you manage the players */
#playerManagerDiv ul {
  list-style-type: none;
  margin: 0;
  background: rgba(180, 180, 180, 0.2);
}

#playerManagerDiv li {
  margin: 2px;
  padding-left: 8px;
  font-size: 20px;
  width: 360px;
  background: rgba(180, 180, 180, 0.3);
}

.time,
.running {
  font-size: 13px;
  color: rgb(252, 190, 109);
}

.highlighted2 {
  background-color: rgba(255, 255, 255, 0.6);
  color: #ffb065;
}

.notDefault {
  color: yellow;
}

/* this div holds the numbers for the start positions in the manage players screen */
#startPosDiv {
  position: absolute;
  top: 38px;
  left: 68px;
}

#startPosDiv p {
  position: absolute;
}

#playersLabel {
  position: absolute;
  left: 104px;
}

#spectatorsLabel {
  position: absolute;
  top: 280px;
  left: 104px;
}

#inviteButton {
  position: absolute;
  left: 220px;
  width: 130px;
}

#addCpuButton {
  position: absolute;
  left: 360px;
  width: 130px;
}

#inviteWindow {
  position: absolute;
  left: calc(50% - 200px);
  width: 400px;
  height: 350px;
  top: 100px;
}

#inviteWindowContents {
  margin-top: 5px;
}

.inviteLabel {
  margin-top: 10px;
  margin-bottom: 10px;
}

.inviteDiv {
  height: 36px;
  line-height: 36px;
  margin-left: 10px;
  margin-right: 10px;
  margin-bottom: 2px;
}

.inviteName {
  color: #fff839;
  padding-top: 8px;
  float: left;
}

.inviteFriendButton,
.inviteRandomButton {
  float: right;
}

.invis {
  display: none;
}

.connectedSortable {
  width: 390px;
  position: absolute;
  left: 60px;
  height: 36px;
}

#listSpec {
  height: 170px;
  top: 316px;
}

#optionsWindow,
#queriesWindow {
  width: 600px;
  position: absolute;
  left: 50%;
  margin-left: -300px;
  top: 60px;
  height: 660px;
  z-index: 980;
}

#queriesWindow {
  width: 700px;
}

#newFriendInput {
  width: 250px;
}

#logo {
  position: absolute;
  left: 50%;
  margin-left: -112px;
  top: 50px;
  background: url("logo.png");
  width: 224px;
  height: 158px;
}

#buttonDaddy {
  position: absolute;
  bottom: 110px;
  width: 100%;
  text-align: center;
}

#singleplayerButton,
#mapEditorButton,
#replayButton,
#ladderButton,
#lobbyCreateButton,
#tutorialButton {
  font-size: 36px;
  height: 54px;
  margin: 0 2px;
  padding: 0 10px;
}

#ladderButton {
  background: rgb(28, 90, 28);
}

#lobbyCreateButton {
  background: rgb(168, 0, 0);
}

#tutorialButton {
  background: #b97e5c;
  padding-right: 42px;
}

#tutorialButtonSpan {
  position: relative;
}

#killTutorialButtonButton {
  position: absolute;
  top: -12px;
  right: 10px;
  height: 30px;
  width: 30px;
  color: rgb(168, 0, 0);
  font-size: 20px;
}

#killFaqMsgButton {
  color: rgb(168, 0, 0);
  vertical-align: text-bottom;
}

#mapEditorButton,
#replayButton {
  background: rgb(166, 166, 74);
}

#replaysListWindow {
  width: 750px;
  position: absolute;
  left: 50%;
  margin-left: -300px;
  top: 60px;
  height: 580px;
  z-index: 980;
}

#loadExternalReplayButton {
  position: absolute;
  right: 80px;
  top: 10px;
}

/* A single replay in the replays window */
.replayDiv {
  overflow: auto;
  margin-left: 10px;
  margin-right: 10px;
  margin-bottom: 10px;
  padding-top: 2px;
}

.replayName {
  color: #fff839;
  padding-top: 8px;
  float: left;
}

.replayRider {
  float: right;
}

#noReplaysP {
  margin-top: 40px;
  text-align: center;
  font-size: 40px;
}

/* back button, used in several screens */
#backButton {
  position: absolute;
  right: 15px;
  top: 625px;
  width: 100px;
}

/* start button, used in several screens */
#startButton {
  position: absolute;
  right: 135px;
  top: 625px;
}

#premium_window {
  text-align: center;
  padding-top: 10px;
}

.hidden_item {
  text-decoration: underline;
  color: yellow;
}

#ingameChatInput {
  position: absolute;
  left: 350px;
  bottom: 190px;
  width: 600px;
  border: 2px solid white;
  background: black;
}

/* choose between send to allies and send to all */
#ingameChatDropdown {
  position: absolute;
  left: 220px;
  bottom: 190px;
  width: 120px;
  background: black;
  border: 2px solid white;
  height: 38px;
  font-size: 22px;
}

/* load external map button in map editor load map window */
#loadExternalButton {
  position: absolute;
  right: 80px;
  top: 10px;
}

#newMapSizeX,
#newMapSizeY {
  width: 50px;
}

#newMapWindow {
  position: absolute;
  left: 50%;
  margin-left: -150px;
  top: 50px;
  width: 300px;
  height: 300px;
}

#createMapOKButton {
  position: absolute;
  right: 10px;
  bottom: 10px;
  width: 100px;
}

#mapEditorInterface {
  position: absolute;
  left: 192px;
  right: 0;
  bottom: 0;
  height: 200px;
  background: rgb(32, 88, 161);
}

#editorSelectButton {
  position: absolute;
  right: 100px;
  top: 6px;
  width: 64px;
  height: 64px;
  background: url("select.png");
  background-color: rgb(104, 152, 221);
}

#cursorPosDiv {
  position: absolute;
  right: 260px;
  top: 6px;
  width: 90px;
  height: 64px;
  z-index: 11;
  color: #dcd700;
}

#editorHigherTerrainButton {
  position: absolute;
  right: 170px;
  bottom: 50px;
  width: 64px;
  height: 64px;
  background: url("cliff-up.png");
  z-index: 11;
  background-size: 100% 100%;
}

#editorLowerTerrainButton {
  position: absolute;
  right: 100px;
  bottom: 50px;
  width: 64px;
  height: 64px;
  background: url("cliff-down.png");
  z-index: 11;
  background-size: 100% 100%;
}

#addRampButton {
  position: absolute;
  right: 240px;
  bottom: 50px;
  width: 64px;
  height: 64px;
  background: url("ramp-plus.png");
  z-index: 11;
  background-size: 100% 100%;
}

#killRampButton {
  position: absolute;
  right: 310px;
  bottom: 50px;
  width: 64px;
  height: 64px;
  background: url("ramp-minus.png");
  z-index: 11;
  background-size: 100% 100%;
}

#mirrorButton {
  position: absolute;
  right: 380px;
  bottom: 50px;
  width: 64px;
  height: 64px;
  background: url("ramp-minus.png");
  z-index: 11;
  background-size: 100% 100%;
}

#editorUndoButton {
  display: none;
  position: absolute;
  right: 380px;
  width: 64px;
  bottom: 50px;
  height: 64px;
  background: url("undo.png");
  z-index: 11;
}

.mapEditorHotkey {
  position: absolute;
  top: 2px;
  right: 2px;
  opacity: 0.8;
}

/* player dropdown in map editor */
#playerDropdown {
  position: absolute;
  top: 6px;
  right: 180px;
  height: 30px;
  border: 2px solid #0d316b;
  color: #0d316b;
}

#showGridCheckbox {
  position: absolute;
  top: 44px;
  right: 180px;
}

#showGridLabel {
  position: absolute;
  top: 45px;
  right: 206px;
}

#editorPlayButton {
  position: absolute;
  right: 6px;
  top: 4px;
  width: 90px;
  height: 36px;
}

#editorSaveButton {
  position: absolute;
  right: 6px;
  top: 43px;
  width: 90px;
  height: 36px;
}

#editorLoadButton {
  position: absolute;
  right: 6px;
  top: 83px;
  width: 90px;
  height: 36px;
}

#editorNewButton {
  position: absolute;
  right: 6px;
  top: 159px;
  width: 90px;
  height: 36px;
}

.riderButton {
  margin-left: 5px;
}

.menuButtons,
.inlineChatButton,
#inlineFriendButton,
#inlineIgnoreButton,
#inlineUnignoreButton,
#banjaminButton {
  position: absolute;
  width: 40px;
  margin-left: 5px;

  -moz-box-shadow: inset 0px 1px 0px 0px #ebccbf;
  -webkit-box-shadow: inset 0px 1px 0px 0px #ebccbf;
  box-shadow: inset 0px 1px 0px 0px #ebccbf;
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    color-stop(0.05, #ec9a76),
    color-stop(1, #da7143)
  );
  background: -moz-linear-gradient(center top, #ec9a76 5%, #da7143 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#EC9A76', endColorstr='#DA7143');
  background-color: #da7143;
  border: 2px solid #62320f;

  background-position: center;
  background-repeat: no-repeat;
}

.inlineChatButton {
  background-image: url("imgs/m_chat.png");
  position: relative;
}

#inlineFriendButton {
  background-image: url("imgs/m_friends_add.png");
  position: relative;
}

#inlineIgnoreButton,
#inlineUnignoreButton,
#banjaminButton {
  position: relative;
  width: auto;
}

#riders_ * {
  vertical-align: middle;
  font-size: 20px;
}

.menuButtons:hover {
  border: 2px solid yellow;
}

#ingameMenuButton {
  left: 10px;
  top: 10px;
  background-image: url("imgs/m_options.png");
}

#clansButton {
  left: 110px;
  top: 10px;
  background-image: url("imgs/m_clan.png");
}

#friendsButton {
  left: 60px;
  top: 10px;
  background-image: url("imgs/m_friends.png");
}

#emotesButton {
  left: 160px;
  top: 10px;
  background-image: url("imgs/m_emotes.png");
}

#achivementsButton {
  left: 210px;
  top: 10px;
  background-image: url("imgs/m_leagues.png");
}

#ingameChatHistoryButton {
  left: 110px;
  top: 10px;
  background-image: url("imgs/m_history.png");
}

#queriesTitle {
  position: absolute;
  left: 380px;
  font-size: 28px;
  margin-top: 16px;
}

#noFriendsMessageDiv {
  margin: 20px;
  font-size: 26px;
}

.head_rider {
  position: absolute;
  top: 10px;
  right: 90px;
}

.head_rider * {
  vertical-align: middle;
}

.achivement_div {
  float: left;
  width: 135px;
  height: 160px;
  text-align: center;
  margin-top: 20px;
}

.achivement_div2 {
  float: left;
  width: 94px;
  height: 110px;
  text-align: center;
  margin-top: 20px;
  font-size: 14px;
}

.gold_buy_div {
  float: left;
  width: 165px;
  text-align: center;
  padding: 10px 0;
  margin: 30px 10px 0;
  background-color: rgba(255, 255, 255, 0.2);
}

.greyfont {
  color: rgb(150, 150, 150);
}

.achivement_img_locked {
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
}

.buy_gold_span {
  vertical-align: super;
  color: rgb(255, 255, 99);
}

.pixelated {
  image-rendering: -moz-crisp-edges;
  image-rendering: -webkit-optimize-contrast;
  image-rendering: pixelated;
}

#playerGold {
  font-size: 34px;
  color: rgb(255, 255, 99);
}

#playerGoldWrap {
  position: absolute;
  left: 280px;
  top: 8px;
}

#playerGoldWrap * {
  vertical-align: middle;
}

#playerSearchInput {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 120px;
}

#playerSearchInput::placeholder {
  color: #d4d4d4;
}

.invis {
  display: none;
}

.imgPreview {
  max-height: 30px;
  vertical-align: middle;
}

.microTransButton {
  width: 100%;
  height: 100px;
  margin-top: 3px;
  font-size: 46px;
  position: relative;
  font-weight: 800;
}

.buy_gold_reward_div {
  font-size: 32px;
  margin: 12px 0 2px;
}

.buy_gold_title {
  font-size: 22px;
  color: rgb(132, 187, 126);
}

.size24px {
  font-size: 22px;
}

.mapButton {
  position: relative;
  background: #739d83;
}

.mapButtonMod {
  position: relative;
  background: rgb(104, 151, 205);
}

.modLabel {
  color: #db4300;
  position: absolute;
  bottom: 6px;
  right: 4px;
  font-size: 14px;
  font-weight: bold;
}

.mapListMod {
  position: relative;
  color: #db4300;
  font-size: 14px;
  font-weight: bold;
}

.b_active {
  background: green;
}

.b_inactive {
  background: none;
}

.b_disabled {
  background: grey;
}

.victoryTitle {
  color: rgb(255, 241, 195);
  font-size: 50px;
  margin-left: 300px;
}

.defeatTitle {
  color: #ff6464;
  font-size: 50px;
  margin-left: 300px;
}

.victoryImg {
  margin: 0 auto;
  display: block;
  height: 120px;
}

.lcg_command {
  color: #cfffb7;
}

#nameSuggestDiv {
  position: absolute;
  bottom: 24px;
  left: 24px;
  display: none;
  padding: 8px;
}

.suggestedName {
  font-size: 22px;
}

.suggestedName:hover,
.suggestedNameActive {
  background: rgba(255, 255, 255, 0.2);
}

#goldRewardONLvlUp {
  position: absolute;
  left: 10px;
  bottom: 10px;
  font-size: 24px;
  background: rgba(255, 255, 255, 0.2);
  padding: 4px;
}

#goldRewardONLvlUp * {
  vertical-align: middle;
}

.buytable,
.buytable2 {
  float: left;
  margin: 12px;
  text-align: center;
  background: rgba(255, 255, 255, 0.2);
  border: 1px solid rgba(255, 255, 255, 0.4);
  padding: 6px;
}

.buytable2 {
  height: 120px;
}

.buytable div {
  float: left;
  margin: 8px;
}

.dancediv {
  height: 100px;
  overflow: hidden;
  float: none !important;
  margin: 0 auto !important;
}

.buytable_title {
  font-size: 24px;
  color: #fcbe6d;
}

.buytableimgs {
  height: 50px;
  margin-top: 4px;
}

.buytableimgs2 {
  height: 120px;
  image-rendering: pixelated;
  padding: 0;
}

.buytableNames {
  font-size: 26px;
}

.buytablePurchased {
  font-size: 20px;
  color: #fcbe6d;
}

.buy_button {
  background-color: #8cc58a;
  /* background-color: grey; */
}

.buy_button:disabled {
  background-color: grey;
}

.buy_button_buy {
  color: rgb(14, 71, 19);
  text-shadow: none;
}

.buy_button_buy:disabled {
  background-color: grey;
}

.buy_button_price {
  color: rgb(255, 255, 157);
}

.achivement_text {
  font-size: 22px;
  color: rgb(255, 255, 157);
}

#reward_amount {
  color: yellow;
  font-size: 32px;
}

#ach_lowline {
  font-size: 26px;
}

#ach_lowline * {
  vertical-align: middle;
}

.ach_name {
  font-size: 32px;
  color: #27b600;
}

#customHotkeysWindow {
  position: absolute;
  width: 600px;
  height: 600px;
  top: 50px;
  left: 50%;
  margin-left: -300px;
}

.hotkeyEntry {
  padding-left: 10px;
  margin-right: 10px;
  background: rgba(255, 255, 255, 0.2);
}

.hotkeyInputActive {
  background-color: #fff839 !important;
  color: red !important;
}

.hotkeyInput {
  width: 60px;
  text-align: center;
}

.hotkeyHeadline {
  font-size: 24px;
  color: #fcefa1;
  margin: 12px 8px 3px;
}

.hotkeySectionTitle {
  font-size: 20px;
  color: yellow;
  margin: 12px 8px 3px;
}

.hotkeyGroupDescription {
  margin: 12px 8px 3px;
  font-size: 18px;
}

#accGuestMsgDiv {
  position: absolute;
  top: 70px;
  left: 30px;
  right: 30px;
  background: rgba(255, 255, 255, 0.15);
  font-size: 20px;
  padding: 10px;
}

#noRankingYetDiv {
  position: absolute;
  left: 30px;
  right: 30px;
  background: rgba(255, 255, 255, 0.15);
  font-size: 20px;
  padding: 10px;
}

#xpBarDiv {
  position: absolute;
  bottom: 80px;
  width: 100%;
}

.xpBarContainer {
  position: relative;
  padding: 0;
  background-color: black;
  border: 2px solid white;
  text-align: center;
  height: 30px;
  margin-left: 10px;
  margin-right: 10px;
}

.xpBar {
  position: relative;
  background-color: #33a530;
  height: 100%;
  text-align: left;
}

.xpGainText {
  margin-left: 10px;
  /* To center vertically */
  height: 30px;
  line-height: 30px;
  white-space: nowrap;
}

.xpRequiredDiv {
  margin-top: 4px;
  text-align: center;
}

.online {
  color: green;
  font-size: 14px;
}

.offline {
  color: #b60000;
  font-size: 14px;
}

.greenfont {
  color: #27b600;
}

.greenfont2 {
  color: #27b600;
}

.redfont {
  color: rgb(255, 82, 7);
}

.yellowfont {
  color: #fff559;
}

.biggerFont {
  font-size: 19px;
}

.lobbyLabel {
  font-size: 13px;
}

.clanLink {
  text-decoration: underline;
}

#playerManagerDiv {
  position: absolute;
  left: 500px;
  font-size: 26px;
  top: 10px;
}

#changeMapButton {
  position: absolute;
  bottom: -50px;
  right: 1px;
  width: 240px;
}

#mapPreviewImg {
  width: 256px;
  height: 256px;
  margin: 0;
  padding: 0;
  border: 2px solid #337fed;
}

.windowTitle {
  position: absolute;
  left: 30px;
  font-size: 28px;
  margin-top: 16px;
}
.windowTitle2 {
  position: absolute;
  left: 10px;
  font-size: 24px;
  margin-top: 16px;
}

.gameVictoryTitle,
.gameLossTitle {
  position: absolute;
  left: 114px;
  font-size: 64px;
  margin-top: 16px;
}
.gameVictoryTitle {
  color: rgb(255, 241, 195);
}
.gameLossTitle {
  color: rgb(255, 214, 214);
}

.editorTypeButton {
  width: 64px;
  height: 64px;
  margin: 0;
  padding: 0;
  overflow: hidden;
  position: relative;
  vertical-align: top;
}

.editorTypeButton div {
  overflow: hidden;
  margin: auto;
  position: relative;
}

#loginWindowNameLabel,
#registerWindowNameLabel {
  position: absolute;
  left: 90px;
  top: 154px;
  font-size: 28px;
}

#loginWindowPwLabel,
#registerWindowEmailLabel {
  position: absolute;
  left: 90px;
  top: 204px;
  font-size: 28px;
}

#loginWindowPwCheckbox {
  position: absolute;
  left: 510px;
  top: 250px;
  font-size: 28px;
}

#loginWindowSavePwLabel {
  position: absolute;
  left: 370px;
  top: 248px;
  font-size: 20px;
}

#recoveryWindowEmailLabel {
  position: absolute;
  left: 70px;
  top: 204px;
  font-size: 28px;
}

#loginWindowUsername {
  position: absolute;
  left: 260px;
  top: 150px;
}

#loginWindowPassword {
  position: absolute;
  left: 260px;
  top: 200px;
}

#loginWindowState {
  position: absolute;
  right: 50px;
  bottom: 40px;
  font-size: 20px;
}

#loginWindowLoginButton {
  position: absolute;
  left: 90px;
  top: 300px;
}

#loginWindowGuestButton {
  position: absolute;
  left: 162px;
  top: 300px;
}

#loginWindowCreateAccount {
  position: absolute;
  left: 90px;
  top: 350px;
}

#recoverPWButton {
  position: absolute;
  left: 250px;
  top: 350px;
}

#createAccLabel {
  position: absolute;
  left: 90px;
  top: 50px;
  font-size: 28px;
}

#registerAGBs {
  position: absolute;
  left: 320px;
  top: 418px;
  font-size: 16px;
}

#registerWindowPwLabel {
  position: absolute;
  left: 90px;
  top: 254px;
  font-size: 28px;
}

#registerWindowFirstName {
  position: absolute;
  left: 260px;
  top: 300px;
}

#registerWindowFirstNameLabel {
  position: absolute;
  left: 90px;
  top: 304px;
  font-size: 28px;
}

#registerWindowLastName {
  position: absolute;
  left: 260px;
  top: 350px;
}

#registerWindowLastNameLabel {
  position: absolute;
  left: 90px;
  top: 354px;
  font-size: 28px;
}

#recoveryWindowPWLabel {
  position: absolute;
  left: 70px;
  top: 254px;
  font-size: 28px;
}

#registerWindowUsername {
  position: absolute;
  left: 260px;
  top: 150px;
}

#registerWindowEmail,
#recoveryWindowEmail {
  position: absolute;
  left: 260px;
  top: 200px;
}

#registerWindowPassword,
#recoveryWindowPW {
  position: absolute;
  left: 260px;
  top: 250px;
}

#registerWindowState,
#recoveryWindowState {
  position: absolute;
  left: 50px;
  bottom: 5px;
  font-size: 20px;
}

#registerWindowCreate,
#recoveryWindowCreate {
  position: absolute;
  left: 90px;
  top: 410px;
}

#registerWindowBack,
#recoveryWindowBack {
  position: absolute;
  left: 184px;
  top: 410px;
}

#replayControlWindow {
  position: absolute;
  right: 16px;
  bottom: 160px;
  width: 180px;
  height: 60px;
}

#replayPlusButton {
  position: absolute;
  left: 10px;
  top: 10px;
}

#replayMinusButton {
  position: absolute;
  left: 120px;
  top: 10px;
}

#replayShowSpeed {
  position: absolute;
  left: 45px;
  top: 10px;
  font-size: 26px;
  width: 60px;
  text-align: center;
}

#mapSettingsButton {
  position: absolute;
  right: 100px;
  top: 159px;
  height: 36px;
}

#uploadMapButton {
  position: absolute;
  right: 6px;
  top: 121px;
  width: 90px;
  height: 36px;
}

#manageMapsButton {
  position: absolute;
  right: 192px;
  top: 159px;
  height: 36px;
}

#dataButton {
  position: absolute;
  right: 286px;
  top: 159px;
  height: 36px;
}

#customGraphicsButton {
  position: absolute;
  right: 350px;
  top: 159px;
  height: 36px;
}

.customImgPrv {
  float: left;
  background: rgba(255, 255, 255, 0.15);
  margin: 3px;
  padding: 2px;
}

.customImgPrv img {
  max-width: 420px;
  max-height: 400px;
}

#editorUndoButton {
  position: absolute;
  right: 348px;
  top: 159px;
  height: 36px;
}

#editorRotateButton {
  position: absolute;
  right: 474px;
  top: 159px;
  height: 36px;
}

#mapSettingsWindow {
  position: absolute;
  left: 50%;
  margin-left: -450px;
  width: 910px;
  height: 450px;
  top: 200px;
}

#mapSettingsWindowSubdiv {
  padding-left: 10px;
  padding-right: 10px;
}

#customGraphicsWindow {
  position: absolute;
  left: 50%;
  margin-left: -450px;
  width: 900px;
  height: 550px;
  top: 100px;
}

#playerSettingsDiv {
  position: absolute;
  top: 0;
  left: 440px;
}

#playerSettingsDivHeader {
  font-size: 24px;
  margin-left: 20px;
}

#playerSettingsDiv table {
  font-size: 20px;
}

.disabledEditorSetting {
  color: rgb(189, 189, 189);
}

#mapDescriptionInput {
  width: 380px;
  height: 120px;
}

/* #pickMapWindow {
  position: absolute;
  width: 1000px;
  height: 510px;
  left: 50%;
  margin-left: -400px;
  top: 40px;
  z-index: 1006;
} */

#selectMapArea {
  position: absolute;
  top: 90px;
  left: 2px;
  right: 2px;
  text-align: center;
}

#selectMapArea button {
  width: 186px;
  height: 124px;
  margin: 2px;
  padding: 3px;
  font-size: 17px;
  vertical-align: bottom;
}

.mapPreviewImg2 {
  height: 90px;
  width: 90px;
  border: 2px solid #0d316b;
  margin-top: 2px;
}

#manageMapsWindow {
  position: absolute;
  width: 600px;
  height: 500px;
  left: 50%;
  margin-left: -300px;
  top: 100px;
}

#infoWindow {
  position: absolute;
  width: 400px;
  height: 230px;
  left: 50%;
  margin-left: -200px;
  top: 200px;
  text-align: center;
  vertical-align: center;
  z-index: 1005;
}

.infoWindowText {
  position: absolute;
  top: 40%;
  left: 50%;
  transform: translate(-50%, -50%);
  min-width: 95%;
}

#infoWindow2 {
  position: absolute;
  width: 500px;
  height: 400px;
  left: 50%;
  margin-left: -250px;
  top: 120px;
  text-align: center;
  vertical-align: center;
  z-index: 1004;
}

#darkScreenDiv {
  z-index: 1003;
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.75);
  display: none;
}

#ladderWindow {
  position: absolute;
  width: 500px;
  height: 300px;
  left: 50%;
  margin-left: -250px;
  top: 200px;
  text-align: center;
  z-index: 9999;
  vertical-align: center;
  padding: 8px;
  font-size: 17px;
}

#ladderCancelButton2 {
  margin-left: 6px;
}

#infoWindowTextArea,
#infoWindowTextArea2 {
  margin: 0 auto;
}

#clanWallMsgInput,
#clanTextTextArea {
  width: 440px;
  height: 120px;
}

#personalTextDiv,
#clanTextDiv,
.profileTextDiv {
  background-color: rgba(255, 255, 255, 0.2);
  padding: 4px;
}

#personalTextTextArea {
  height: 100px;
}

#ladderStartCounter {
  font-size: 100px;
  color: rgb(94, 255, 62);
}

#selectMapPages {
  position: absolute;
  left: 10px;
  bottom: 4px;
  right: 10px;
  text-align: center;
}

#selectMapPages span {
  font-size: 20px;
}

.query {
  position: absolute;
  width: 500px;
  height: 400px;
}

.queryInput {
  position: absolute;
  bottom: 10px;
  left: 10px;
  width: 472px;
}

.queryTextContainer {
  bottom: 60px;
  top: 70px;
  right: 8px;
}

#resetHotkeysButton {
  position: absolute;
  top: 10px;
  right: 80px;
}

.playerNameInList {
  font-size: 18px;
}

.playerLinkRegistered {
  color: #fff839;
  text-decoration: underline;
}

.playerLinkPremium {
  color: #5fff39;
  text-decoration: underline;
}

.likePremiumColor {
  color: #5fff39;
}

.playerLinkGuest {
  color: #dbdbdb;
  text-decoration: underline;
}

.playerLinkMod {
  color: #f38f3c;
  text-decoration: underline;
}

.playerLinkAdmin {
  color: #e84141;
  text-decoration: underline;
}

.profileButton {
  font-size: 16px;
  text-align: center;
  width: 86px;
  margin: 7px;
  margin-bottom: 1px;
  height: 24px;
}

.minimizeButton {
  position: absolute;
  top: 10px;
  right: 70px;
  width: 50px;
  height: 50px;
  color: red;
  font-size: 30px;
}

#chatListSubDiv {
  left: 350px;
  right: 10px;
  top: 70px;
  bottom: 70px;
  background-color: rgba(255, 255, 255, 0.2);
}

#chatListSubDiv * {
  width: 300px;
  text-align: center;
}

#friendsSubdiv {
  left: 10px;
  right: 360px;
  top: 70px;
  bottom: 70px;
  background-color: rgba(255, 255, 255, 0.2);
}

#addFriendSubDiv {
  position: absolute;
  bottom: 0px;
  height: 70px;
}

#noMessagesP {
  margin: 20px auto;
  font-size: 40px;
}

.queryButtonLink {
  margin-top: 5px;
  margin-left: auto;
  margin-right: auto;
  display: block;
}

.backgroundRed {
  background-color: rgba(255, 0, 0, 0.5) !important;
}

.blinkBGRed {
  animation: blinkBGRedAnimation 1s steps(1) infinite;
}

@keyframes blinkBGRedAnimation {
  50% {
    background-color: rgba(255, 0, 0, 0.5);
  }
}

.blinkBorderRed {
  animation: blinkBorderRedAnimation 1s steps(1) infinite;
}

@keyframes blinkBorderRedAnimation {
  50% {
    border: 2px solid rgba(255, 0, 0, 0.7);
  }
}

.blink {
  -webkit-transition: backgroundColor 0.05s ease-in-out;
  -moz-transition: backgroundColor 0.05s ease-in-out;
  -ms-transition: backgroundColor 0.05s ease-in-out;
  transition: backgroundColor 0.05s ease-in-out;
}

a {
  color: white;
  text-decoration: none;
  font-weight: bold;
}

a:hover {
  color: #2e6cd4;
}

.playerSettingsTD {
  color: rgb(68, 76, 166);
  font-size: 20px;
}

#playerInfoWindow {
  position: absolute;
  width: 650px;
  height: 500px;
  left: 50%;
  margin-left: -300px;
  top: 100px;
  z-index: 1;
}

.nowrap {
  white-space: nowrap;
}

#riderDiv {
  position: relative;
  left: 15px;
}

#riderDiv button {
  margin-left: 5px;
}

#playerInfoWindow2 {
  position: absolute;
  width: 700px;
  height: 500px;
  left: 50%;
  margin-left: -350px;
  top: 50px;
  z-index: 1;
}

#playerInfoWindow .textContainer,
#playerInfoWindow2 .textContainer {
  font-size: 18px;
}

#playerInfoWindow .textContainer {
  top: 115px;
  left: 15px;
  width: 95%;
}

#playerInfoWindow .windowTitle {
  position: relative;
  top: 15px;
  display: inline-block;
  color: rgb(255, 248, 57);
}

#faqWindow {
  position: absolute;
  width: 700px;
  height: 500px;
  top: 100px;
  left: 50%;
  margin-left: -350px;
  z-index: 1001;
}

#adsense {
  position: absolute;
  width: 740px;
  height: 94px;
  left: 2px;
  bottom: 2px;
  text-align: center;
}

/* #tipsDiv {
  position: absolute;
  width: 680px;
  height: 80px;
  left: 30px;
  bottom: 5px;
  font-size: 18px;
  color: #c3c3c3;
} */

#loadingWindow {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 9999;
  background-color: black;
  display: none;
}

#loadingText {
  position: absolute;
  width: 98%;
  left: 1%;
  bottom: 50px;
  text-align: center;
  font-size: 40px;
}

#loadingScreenMapImg {
  position: absolute;
  width: 256px;
  height: 256px;
  top: 200px;
  left: 50%;
  margin-left: -128px;
  border: 2px solid white;
}

#mapScreenName {
  position: absolute;
  width: 98%;
  left: 1%;
  top: 500px;
  text-align: center;
  font-size: 60px;
}

#playersDisplay {
  position: absolute;
  width: 98%;
  left: 1%;
  top: 590px;
  text-align: center;
  font-size: 40px;
}

#spectatorDropdown {
  position: absolute;
  left: 190px;
  top: 30px;
  color: #2e6cd4;
}

#visionDropdown {
  position: absolute;
  left: 336px;
  top: 30px;
  color: black;
}

#spectatorLabel {
  position: absolute;
  left: 190px;
  top: 10px;
  user-select: none;
}

#visionLabel {
  position: absolute;
  left: 336px;
  top: 10px;
  user-select: none;
}

#spectatorDiv {
  position: absolute;
  left: 10px;
  top: 80px;
  user-select: none;
}

#spectatorDiv div {
  position: absolute;
  width: 54px;
  height: 54px;
}

#spectatorDiv div img {
  position: absolute;
}

#spectatorDiv div p {
  position: absolute;
  right: 4px;
  bottom: 4px;
}

#spectatorDiv div div {
  position: absolute;
  bottom: 1px;
  left: 1px;
  height: 6px;
  background-color: #0d316b;
}

.whitebar {
  background-color: white !important;
  height: 8px !important;
  bottom: 0px !important;
  left: 0px !important;
}

.playerIndicator {
  position: absolute;
  width: 10px !important;
  height: 54px !important;
}

#legalities {
  position: absolute;
  top: 2px;
  right: 10px;
}

/* #linksMenu {
  position: absolute;
  top: 22px;
  right: 10px;
  background-color: #275494;
  background-image: url("imgs/links-bg-2.png");
  background-repeat: no-repeat;
  border: 2px solid white;
  width: 120px;
}

#linksMenu div {
  display: none;
}

#linksMenu:hover div {
  display: inline;
}

#linksMenu p,
#linksMenu div p {
  height: 22px;
  margin-left: 32px;
  vertical-align: middle;
} */

#links-title {
  margin-top: 2px;
}

#themeSelecter,
#heightLevelSelect {
  color: #0d316b;
}

#time2Ban {
  width: 80px;
}

.kappa {
  margin-bottom: -5px;
  min-height: 25px;
}

#dataRiders {
  position: absolute;
}

#typesList {
  position: absolute;
  top: 60px;
  left: 10px;
  height: 460px;
  overflow: auto;
}

.dataTypeListDiv:hover {
  background-color: rgba(255, 255, 255, 0.2);
}

.dataTypeListDivActive {
  background-color: rgba(255, 255, 255, 0.3);
}

.mapDataInput {
  height: 22px;
}

.dataSelect {
  background-color: #2e6cd4;
}

.strWidth {
  width: 300px;
}

.numberWidth {
  width: 50px;
}

#dataNewButton {
  position: absolute;
  top: 60px;
  left: 620px;
}

#dataDeleteButton {
  position: absolute;
  top: 60px;
  left: 747px;
}

#dataResetButton {
  position: absolute;
  top: 60px;
  left: 680px;
}

/* #dataNewObjectWindow,
#dataAddListWindow {
  position: absolute;
  left: 50%;
  margin-left: -170px;
  top: 100px;
  width: 340px;
  height: 300px;
  z-index: 1004;
} */

/* #dataAddListWindow select,
#dataNewObjectWindow select {
  background-color: #79bbff;
} */

#loading {
  font-size: 30px;
}

#mapSearchInput {
  position: absolute;
  top: 50px;
  left: 134px;
  width: 130px;
}

#searchLabel {
  position: absolute;
  top: 58px;
  left: 30px;
  font-size: 21px;
}

#clanSearchInput {
  position: absolute;
  top: 0px;
  left: 134px;
  width: 130px;
}

#clanSearchLabel {
  position: absolute;
  top: 8px;
  left: 10px;
  font-size: 21px;
}

#mapSearchSelect {
  position: absolute;
  top: 55px;
  left: 280px;
  font-size: 20px;
  color: rgb(68, 76, 166);
}

#mapPopularitySelect {
  position: absolute;
  top: 55px;
  left: 430px;
  font-size: 20px;
  color: rgb(68, 76, 166);
}

#gameNameLabel {
  position: absolute;
  top: 12px;
  left: 661px;
  font-size: 21px;
}

#gameNameInput {
  position: absolute;
  top: 6px;
  left: 770px;
  font-size: 21px;
  width: 140px;
}

#gamePWLabel {
  position: absolute;
  top: 58px;
  left: 678px;
  font-size: 21px;
}

#gamePWInput {
  position: absolute;
  top: 50px;
  left: 770px;
  font-size: 21px;
  width: 140px;
}

#lobbyDiv {
  position: absolute;
  width: 100%;
  height: 100%;
}

input[type="text"],
input[type="password"] {
  padding-left: 4px !important;
}

.legalDiv {
  background: rgba(255, 255, 255, 0.2);
  padding: 4px;
  margin-top: 10px;
}

.teamSelection {
  text-shadow: rgba(0, 0, 0, 1) 0px 0px 2px;
  color: white;
  background-color: #275494;
  float: right;
  margin: 2px;
  font-size: 20px;
}