@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Barlow:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Bangers&display=swap');

/*
 * nowy_layout.css
 * Wygenerowany automatycznie — tylko używane selektory
 * Oryginał: /home/www/layouts/lay/layout.css
 * Bloki zachowane: 147 / 171
 * Skrypt by HelpDev
 */

#BackgroundArtwork {
  width: calc(100vw - 17px);
  margin: auto;
  height: 450px;
  background: url("images/background/bg.jpg");
  background-position: center;
  background-size: cover;
  /* background-attachment: fixed; */
}

#donate-button {
  background: url("images/menu_box/button-donate.gif");
  margin-bottom:20px;
  height: 60px;
}

#donate-button:hover {
    background: url("images/menu_box/button-donate-hover.gif");
}

#download-client-button {
  background: url("images/menu_box/button-download.png");
  margin-bottom:20px;
  height: 60px;
}

#download-client-button:hover {
    background: url("images/menu_box/button-download-hover.png");
}

#forum-button {
  background: url("images/menu_box/dc-button.png");
  margin-bottom:20px;
  height: 60px;
}

#forum-button:hover {
    background: url("images/menu_box/dc-button.png");
}

#Header {
  display: flex;
  width: 100%;
  height: 53px;
  /* background: url("images/header/header.png"); */
}

#Header .menu {
  height: 60px;
  flex: 1 1 0%;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8.5rem;
  font-family: "Barlow Condensed", sans-serif;
  font-style: italic;
  text-transform: uppercase;
  font-weight: 600;
  font-size: 28px;
  background-color: #a12416;
  background: url("images/header/menu-bg.png");
}

#Header .menu a {
  text-decoration: none;
  color: #ffffff;
}

#Header .menu a:hover {
  color: #fb9709 !important;
  text-decoration: none;
}

#Header .social {
  width: 120px;
  padding-top: 8px;
  padding-left: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 15px;
}

#Header .status {
  display: flex;
  flex-direction: column;
  /* align-items: center; */
  align-items: center;
  justify-content: start;
  width: 230px;
  height: 146px;
  margin-top: -20px;
  padding-top: 20px;
  gap: 5px;
  background: url("images/header/serverstatus.png");
}

#LayoutWrapper {
  display: flex;
  justify-content: space-between;
}

#logo-wrapper {
  display: flex;
  width: 100%;
  height: 102px;
  margin-top: 50px;
  justify-content: center;
}

#Navigation {
  width: 210px;
  margin-top: 20px;
}

#Others {
  margin-top: 20px;
  width: 210px;
}

* {
  box-sizing: border-box;
}

.BigButton {
  position: relative;
  width: 135px;
  height: 25px;
  z-index: 10;
}

.button {
  width: 135px;
  height: 25px;
  margin: 0;
  padding: 0;
  border: 0;
  background: url("images/buttons/button.png");
  cursor: pointer;
}

.button-login {
  display: block;
  width: 178px;
  height: 35px;
  background: url("images/buttons/login.png");
  border: 0;
  cursor: pointer;
  transition: 0.5s;
}

.button-login:hover {
  background: url("images/buttons/login-hover.png");
}

.button-logout {
  display: block;
  width: 178px;
  height: 35px;
  background: url("images/buttons/logout.png");
  border: 0;
  cursor: pointer;
  transition: 0.5s;
}

.button-logout:hover {
  background: url("images/buttons/logout-hover.png");
}

.button-register {
  display: block;
  width: 178px;
  height: 35px;
  background: url("images/buttons/register.png");
  border: 0;
  cursor: pointer;
  transition: 0.5s;
}

.button-register:hover {
  background: url("images/buttons/register-hover.png");
}

.button:hover {
  background: url("images/buttons/button_hover.png");
}

.login-input {
  width: 178px;
  padding: 8px 6px;
  margin: 8px 0px 0px 1px;
  background: #400903;
  color: #96968f;
  border: 1px solid #a81808;
  border-radius: 3px;
}

.menu-box {
  margin-bottom: 20px;

}

.menu-box .menu-box-bottom {
  width: 210px;
  height: 45px;
  background: url("images/menu_box/box-bottom.png");
  margin-bottom: 20px;
}

.menu-box .menu-box-bottom-library {
  width: 210px;
  height: 45px;
  background: url("images/menu_box/box-bottom-library.png");
  margin-bottom: 20px;
}

.menu-box .menu-box-bottom-partners {
  width: 210px;
  height: 12px;
  background: url("images/menu_box/box-bottom-partners.png");
}

.menu-box .menu-box-bottom-players {
  width: 210px;
  height: 45px;
  background: url("images/menu_box/box-bottom-players.png");
}

.menu-box .menu-box-bottom-status {
  width: 210px;
  height: 30px;
  background: url("images/menu_box/box-bottom-status.png");
}

.menu-box .menu-box-item {
  display: flex;
  align-items: center;
  width: 210px;
  height: 26px;
  padding: 0 25px 0 25px;
  background: url("images/menu_box/box-item.png");
  color: #e5c973;
  font-size: 20px;
}

.menu-box .menu-box-item a {
  display: inline-block;
  color: currentColor;
  text-decoration: none;
  transition-duration: 0.25s;
}

.menu-box .menu-box-item a:hover {
  color: #ff6a4c;
  filter: blur(0);
  transform: translateX(5px);
}

.menu-box .menu-box-pattern {
  display: flex;
  align-items: center;
  width: 210px;
  padding: 5px 15px 0 15px;
  background: url("images/menu_box/box-pattern.png");
  color: #e5bf73;
  font-size: 16px;
  font-weight: 500;
}

.menu-box .menu-box-top {
  width: 210px;
  height: 66px;
  padding-top: 8px;
  background-color: #872b21;
  background: url("images/menu_box/box-top.png");
  display: flex;
  justify-content: center;
}

.menu-box .menu-box-top img {
  height: 36px;
  margin-top: 8px;
}

.menu-box .menu-box-top-players {
  width: 210px;
  height: 66px;
  padding-top: 20px;
  background: url("images/menu_box/box-top-players.png");
  display: flex;
  justify-content: center;
}

.menu-box .menu-box-top-players img {
  height: 34px;
}

.menu-box-background {
  background: url("images/menu_box/box-pattern.png");
}

.menu-box:last-child {
  margin-bottom: 0;
}

.no-drop {
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -o-user-select: none;
  user-select: none;

  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  -o-user-drag: none;
}

.parting {
  width: calc(100vw - 17px);
  height: 12px;
  background-image: url("images/background/parting.jpg");
}

.text-center {
  text-align: center;
}

.text-small {
  font-size: 12px;
}

.top-players-item {
  display: flex;
  align-items: center;
  padding: 4px 4px 4px 20px;
}

.top-players-item .info {
  display: flex;
  align-items: center;
  gap: 8px;
  /* flex-direction: column; */
  font-weight: bold;
  margin-left: 2px;
  font-size: 18px;
}

.top-players-item .info a {
  text-decoration: none;
  color: #e5c973;
  transition: 0.5s;
  font-family: "Barlow Condensed", sans-serif;
  font-style: italic;
}

.top-players-item .info a:hover {
  color: #ff6a4c;
}

.top-players-item .small {
  color: #d99082;
  font-size: 14px;
  font-weight: normal;
}

.top-players-item:nth-child(even) {
  background: url("images/menu_box/top-players-2.png");
}

.top-players-item:nth-child(odd) {
  background: url("images/menu_box/top-players-1.png");
}

.wrapper {
  width: 1286px;
  margin: auto;
}

@media only screen and (max-width: 1286px) {
  #BackgroundArtwork {
    width: 1286px;
  }
}

@media only screen and (max-width: 1286px) {
  .parting {
    width: 1286px;
  }
}

@media only screen and (max-width: 1286px) {
  footer {
    width: 1286px;
  }
}

a {
  color: #cc6600;
  text-decoration: none;
}

a:hover {
  text-decoration: none;
  color: #872b21;
}

a:hover {
  color: #ff6a4c;
}

b {
  font-size: 18px;
}

body {
  margin: 0px;
  padding: 0px;
  background-color: #3e7e97;
  background: url("images/background/artwork-background.jpg");
  background-position: center;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-attachment: fixed;
  color: #000000;
  font-family: "Barlow Condensed", sans-serif;
  font-weight: 400;
  /* overflow-x: hidden; */
}

footer {
  width: calc(100vw - 17px);
  color: #ccbd91;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  height: 100px;
  margin-top: 60px;
  background: url("images/footer/footer.png");
  background-position: center;
}

h1 {
  color: #3e0903;
  font-family: "Roboto", sans-serif;
  font-weight: 600;
  font-size: 20px;
}

h2 {
  color: #3e0903;
  font-family: "Roboto", sans-serif;
  font-weight: 600;
  font-size: 20px;
}

h3 {
  color: #000;
  font-family: "Roboto", sans-serif;
  font-weight: 400;
  font-size: 16px;
}

textarea {
  padding: 4px 6px;
  background: #000;
  color: #8e8d8d;
  border: 1px solid #1a202c;
}

#Content,
#Content .content,
.static-table,
.table-rows,
.table-title {
    width: 98%;                  /* prawie pełna szerokość */
    max-width: none;             /* brak ograniczenia szerokości */
    margin: 0 auto 20px auto;    /* przyklejone do góry, 20px od dołu */
    padding: 20px;               /* wewnętrzny odstęp */
    background: none !important; /* brak tła boxa */
    border: none !important;     /* brak obramowania */
    box-sizing: border-box;      /* padding nie zwiększa szerokości */
}

table {
    width: 100%;                 /* dopasowanie do szerokości #Content */
    margin: 0 auto;
    background: none !important;
    border-collapse: collapse;
    font-size: 18px;
    color:#fff;
}

.BigButtonCreateChar {
    width: 108px;
    height: 24px;
    background: url("images/bg_welcome/btn-change.png") no-repeat !important;
    border: none;
    color: white;
    font-weight: bold;
    cursor: pointer;
    font-size: 11px;
    text-align: center;
}

.BigButtonDelChar {
    width: 108px;
    height: 24px;
    background: url("images/bg_welcome/btn-change.png") no-repeat !important;
    border: none;
    color: white;
    font-weight: bold;
    cursor: pointer;
    font-size: 11px;
    text-align: center;
    /* margin-left: 6px; */
}

.BigButtonDelChar:hover,.BigButtonCreateChar:hover {
    filter: brightness(1.2);
    cursor: pointer;
}

.BigButtonDonate {
    width: 56px;
    height: 15px;
    background: url("images/bg_welcome/btn-donate.png") no-repeat !important;
    border: none;
    color: #ffffff;
    font-weight: unset;
    cursor: pointer;
    font-size: 11px;
    text-align: center;
    padding: 2px 0px 0px 11px;
}

.BigButtonDonate:hover {
    filter: brightness(1.2);
}

.BigButtonMail {
    width: 108px;
    height: 24px;
    background: url("images/bg_welcome/btn-change.png") no-repeat !important;
    border: none;
    color: white;
    font-weight: bold;
    cursor: pointer;
    font-size: 11px;
    text-align: center;
    margin-left: 6px;
    top: -1px;
    position: relative;
}

.BigButtonMail:hover {
    filter: brightness(1.2);
    cursor: pointer;
}

.BigButtonPasswd {
    width: 108px;
    height: 24px;
    background: url("images/bg_welcome/btn-change.png") no-repeat !important;
    border: none;
    color: white;
    font-weight: bold;
    cursor: pointer;
    font-size: 11px;
    text-align: center;
    top: -1px;
    position: relative;
}

.BigButtonPasswd:hover {
    filter: brightness(1.2);
    cursor: pointer;
}

.BigButtonReg {
    width: 108px;
    height: 24px;
    background: url("images/bg_welcome/btn-change.png") no-repeat !important;
    border: none;
    color: white;
    font-weight: bold;
    cursor: pointer;
    font-size: 11px;
    text-align: center;
    margin-right: 6px;
}

.BigButtonReg:hover {
    filter: brightness(1.2);
    cursor: pointer;
}

.CaptionContainerStatus {
    position: relative;
    font-size: 1pt;
    text-align: left;
    margin: 0 auto;
}

.CaptionInnerContainerInf {
    position: relative;
    margin: 7px auto 0px auto;
    height: 143px;
}

.CharactersContainerChar {
    width: 767px;
    margin: 0 auto;
}

.CharBottom {
    background: url("images/bg_welcome/char_bottom.png") no-repeat;
    height: 38px;
    width: 100%;
}

.CharEntryContainer {
    width: 100%;
    height: 32px;
    position: relative;
}

.CharIconBox {
    float: left;
    width: 32px;
    height: 32px;
    margin-right: 4px;
    margin-left: -3px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.CharOutfitImage {
    max-width: 32px;
    max-height: 32px;
    width: auto;
    height: auto;
    display: block;
}

.CharRepeatContent {
    background: url("images/bg_welcome/char_repeat.png") repeat-y;
    width: 100%;
    padding: 0 7px;
    /* margin-top: -35px; */
    position: relative;
    z-index: 2;
}

.CharTextBox {
    float: left;
    position: relative;
    top: 10px;
    font-size: 16px;
    line-height: 16px;
    white-space: nowrap;
}

.CharTop {
    background: url("images/bg_welcome/char_top.png") no-repeat;
    height: 33px;
    width: 100%;
}

.ContainerCharCreat {
    width: 722px;
    height: 504px;
    background: url("images/bg_welcome/create-char-tlo.png") no-repeat center;
    position: relative;
    margin: 21px auto;
    color: #fff;
    font-family: 'Berlin Sans FB Demi', sans-serif;
}

.content_acc {
    width: 837px;
    height: auto;
    margin: 0 auto auto -13px;
}

.content_acc_maximum {
    width: auto;
    height: auto;
    /* margin: -20px -50px 0px -50px; */
    padding: 0px 17px 0px 66px;
    color: #d3c9c9;
}

.content_acc_welcome {
    background: url("images/bg_welcome/welc.png") no-repeat !important;
    background-color: #140000 !important;
    background-position: top center;
    width: 810px;
    height: auto;
    min-height: 100%;
    margin: 0 auto;
    position: relative;
    border-radius: 12px;
}

.content_acc_welcome_srodek {
    position: relative;
    /* margin: 24px 0px 0px 0px; */
    /* top: 51px; */
}

.ContentCharCreat {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.createchar {
    background: url("images/newcreate/content-top.png") no-repeat !important;
    width: 810px;
    height: 34px;
    margin: 0 auto;
    /* margin: -74px 0px 0px 0px; */
    background-color: #5f4d4100 !important;
    position: relative;
}

.DonateButtonWrapper {
    display: inline-block;
    position: relative;
    top: -2px;
}

.EditText {
    color: #ffe200;
}

.EditText:hover {
    color: #ffe200;
    filter: brightness(1.2);
}

.GeneralInf {
    background: url("images/bg_welcome/gen-info.png") no-repeat !important;
    position: relative;
    width: 767px;
    height: 297px;
    font-size: 1px;
    margin: 0 auto;
}

.GeneralInf .CaptionContainer {
    position: relative;
    font-size: 1pt;
    text-align: left;
    margin: 0 auto;
}

.GeneralInf .CaptionContainer .Text {
    font-family: Verdana, Arial, Times New Roman, sans-serif;
    font-size: 10pt;
    font-weight: bold;
    text-align: left;
    color: white;
    padding-left: 10px;
    padding-top: 8px;
    padding-bottom: 0px;
}

.GeneralInf .Table3 {
    width: 100%;
}

.GeneralInf .Table3 .InnerTableContainer {
    width: 100%;
    position: relative;
    margin: 0 auto;
    height: 143px;
}

.GeneralInf .Table3 .TableContentAndRightShadowInf td {
    border: 0px solid #7e1e14;
    vertical-align: top;
}

.HeaderCharContainer {
    background: url("images/bg_welcome/black_tlo.png") no-repeat center;
    height: 18px;
    width: 100%;
}

.HeaderCharCreat {
    width: 100%;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 26px;
    font-weight: bold;
    letter-spacing: 2px;
    text-shadow: 2px 2px 4px #000;
}

.LabelHChar td {
    color: #fff;
    padding-bottom: 1px;
    padding-left: 5px;
    font-size: 16px;
    text-shadow: 1px 1px #000;
}

.LabelVInf {
    padding-right: 10px;
    white-space: nowrap;
    vertical-align: top;
}

.logout-button {
    width: 84px;
    height: 28px;
    background: transparent;
    border: none;
    cursor: pointer;
    font-size: 12px;
    color: #fff;
    text-align: center;
    top: -1px;
    position: relative;
}

.logout-button-cell {
    background: url("images/bg_welcome/ramka-log.png") no-repeat !important;
    border: 0px;
    width: 84px;
    height: 28px;
    cursor: pointer;
    position: relative;
    top: 3px;
    right: 2px;
}

.logout-button-cell:hover {
    filter: brightness(1.2);
}

.logout-button:hover {
    filter: brightness(1.2);
}

.MessageContainerTopRamka {
    background: url("images/bg_welcome/ramka-welcome.png") no-repeat !important;
    background-position: center;
    width: 767px;
    height: 34px;
    margin: 0 auto;
    top: 18px;
    align-items: center;
    position: relative;
}

.OkeyButtonCharCreat {
    width: 249px;
    height: 60px;
    background: url("images/bg_welcome/btn-okey.png") no-repeat center;
    color: #d1d1d1;
    font-size: 20px;
    font-weight: normal;
    cursor: pointer;
    margin-top: 50px;
    border: none;
}

.OkeyButtonCharCreat:hover {
    filter: brightness(1.2);
    color: #fff;
}

.PlayerRowChar {
    font-size: 16px;
}

.PlayerRowChar td {
    padding: 2px 4px 6px 6px;
    background: url("images/bg_welcome/char-info-table.png") no-repeat center;
    height: 32px;
}

.PlayerRowChar:first-child td {
    padding-top: 4px;
}

.PremiumPointsRow {
    display: flex;
    align-items: center;
}

.PremiumPointsText {
    color: #fff;
    margin-right: 15px;
    padding-left: 2px;
}

.ramka-transakcji {
    background: url("images/bg_welcome/ramka-tran.png") no-repeat top center;
    width: 768px;
    height: 34px;
    margin: 0 auto;
	font-weight: bold;
}

.ramka-transakcji-wewn {
    background: url("images/bg_welcome/ramka-tran-wewn.png") no-repeat center;
    width: 768px;
}

.RamkaStatus {
    background: url("images/bg_welcome/ramkastatus.png") no-repeat !important;
    position: relative;
    width: 762px;
    height: 119px;
    font-size: 17px;
    margin: 0 auto;
}

.RamkaTable {
    background: url("images/bg_welcome/gen-info-table.png") no-repeat !important;
    position: relative;
    width: 762px;
    height: 25px;
    font-size: 17px;
    margin: 0 auto;
}

.RamkaTable td {
    border: none;
    padding: 4px 5px;
    top: -3px;
    background: transparent !important;
    position: relative;
}

.spoiler-arrow {
    width: 24px;
    height: 24px;
    background: url('images/content/back-to-top.gif') no-repeat center;
    position: relative;
    right: 23px;
    top: 28px;
    transition: transform 0.3s;
    transform: rotate(180deg);
    cursor: pointer;
}

.spoiler-arrow-open {
    transform: rotate(0deg);
}

.StatusAccountValueGolden {
    background: url("/items/12592.png") no-repeat !important;
    padding: 5px 0px 0px 35px;
    font-size: 18px;
    width: 100%;
    height: 32px;
    color: #fff;
    position: relative;
    /* margin-bottom: 7px; */
    top: -2px;
    right: -2px;
}

.StatusAccountValueVip {
    background: url("/items/5785.png") no-repeat !important;
    padding: 3px 0px 0px 37px;
    width: 100%;
    height: 32px;
    font-size: 18px;
    color: #fff;
}

.StatusContentWrapper {
    padding: 7px 0px 0px 1px;
    margin: 0 auto;
}

.StatusTextCharCreat {
    font-size: 28px;
    font-weight: 900;
    position: relative;
    text-transform: uppercase;
    /* letter-spacing: 4px; */
    /* margin-bottom: 50px; */
    padding: 0px 0px 0px 0px;
    text-shadow: 0px 0px 10px rgba(255, 255, 255, 0.5), 2px 2px 0px #000;
    color: #e0e0e0;
    top: -42px;
    left: 18px;
}

.Tabela_Transakcji {
    position: relative;
    width: 768px;
    font-size: 1px;
    text-align: center;
    margin: 100px auto 0px auto;
}

.tabela_wynikow {
    width: 14%;
	padding-left: 0;
    text-align: center;
}

.table-header-donation {
    background: url("images/bg_welcome/btn-tran.png") no-repeat center;
    height: 28px;
    position: relative;
    font-weight: 400;
    font-size: 16px;
    padding-top: 2px;
    top: 2px;
}

.TableButtonsFooterChar {
    padding-top: 2px;
    display: flex;
    justify-content: flex-start;
    gap: 9px;
    margin-left: 6px;
}

.TableContentChar {
    width: 100%;
    border-collapse: collapse;
    background: transparent !important;
}

.TableContentContainerInf {
    position: relative;
    padding: 0px;
}

.TableContentInf {
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
    margin: auto 1px;
}

.TextChar {
    font-family: Verdana, Arial, Times New Roman, sans-serif;
    font-size: 10pt;
    font-weight: bold;
    text-align: left;
    color: white;
    padding-left: 10px;
    padding-top: 9px;
    padding-bottom: 9px;
}

.TextRegister {
    background: url("images/bg_welcome/btn-yes-no.png") no-repeat !important;
    width: 60px;
    height: 15px;
    font-family: "Tahoma", regular;
    font-size: 14px;
    text-align: center;
    margin-top: 4px;
}

.TextStatus {
    font-family: Verdana, Arial, Times New Roman, sans-serif;
    font-size: 10pt;
    font-weight: bold;
    text-align: left;
    color: white;
    padding-left: 10px;
    padding-top: 8px;
    padding-bottom: 0px;
}

.WelcomeMessage {
    text-align: center;
    vertical-align: middle;
    horizontal-align: center;
    font-size: 17px;
    font-weight: bold;
    left: 48px;
    position: relative;
}

div#name_check {
    width: 431px;
    text-align: center;
}
