/*
 * nowy_basic.css
 * Wygenerowany automatycznie — tylko używane selektory
 * Oryginał: /home/www/layouts/lay/basic.css
 * Bloki zachowane: 149 / 185
 * Skrypt by HelpDev
 */

#ContentHelper {
  position: relative;
}

#Themeboxes #CurrentPollBox #CurrentPollText {
  font-family: Verdana, Arial, sans-serif;
  font-weight: bold;
  line-height: 11pt;
  color: #5a2800;
  position: absolute;
  height: 90px;
  width: 150px;
  top: 37px;
  left: 15px;
  padding-top: 5px;
  overflow: hidden;
}

#Themeboxes #PremiumBox {
  height: 164px;
}

#Themeboxes #ScreenshotBox #ScreenshotContent {
  position: relative;
  height: 111px;
  width: 170px;
  top: 31px;
  left: 0px;
  margin-left: 5px;
  margin-right: 5px;
  border: 0;
  cursor: pointer;
}

#Themeboxes #SkyscraperBanner {
  border: 0;
}

#Themeboxes .Bottom {
  position: absolute;
  bottom: 0px;
  left: 0px;
  height: 12px;
  width: 180px;
}

#Themeboxes .ThemeboxButton {
  position: absolute;
  bottom: 20px;
  left: 22px;
  height: 25px;
  width: 137px;
  cursor: pointer;
}

#Themeboxes div {
  font-size: 10pt;
  background-repeat: no-repeat;
}

* html #ContentHelper {
  display: inline-block;
  position: relative;
  top: -800px;
  margin: -20px;
  margin-right: -570px;
}

* html #Themeboxes .Bottom {
  bottom: -3px;
}

* html .Box {
  width: 100%;
}

* html .BoxContent {
  width: 100%;
}

* html .Content {
  top: -5px;
}

* html .Content {
  position: relative;
  top: 796px;
  margin: 20px;
  border: 0px dashed #061222;
  border-right-width: 550px;
}

.Border_1 {
  position: relative;
  height: 6px;
  width: 100%;
  background-repeat: repeat-x;
}

.Border_2 {
  margin: 4px;
  padding: 0px;
  background-color: #793d03;
}

.Border_3 {
  margin: 1px;
  border-top: 1px solid #793d03;
  border-bottom: 1px solid #793d03;
}

.BorderTitleText {
  position: relative;
  height: 24px;
  background-repeat: repeat-x;
}

.Box {
  font-size: 0pt;
  position: relative;
  margin: 5px;
  margin-bottom: 18px;
  color: #5a2800;
  border-left: 2px solid #3a3738;
  border-right: 2px solid #3a3738;
  background-color: #debb9d;
  background-repeat: no-repeat;
  overflow: visible;
}

.BoxContent {
  padding: 10px;
}

.BoxContent {
  font-family: Verdana, Arial, Times New Roman, sans-serif;
  font-size: 9pt;
  background-color: #fff2db;
  color: #5a2800;
  min-height: 395px;
  height: auto !important;
  height: 415px;
}

.BoxContent .ff_correct {
  font-family: Verdana, Arial, Times New Roman, sans-serif;
  font-size: 11pt;
  color: #ff0000;
  visibility: visible;
  font-weight: bold;
}

.BoxContent .ff_info {
  font-family: Verdana, Arial, Times New Roman, sans-serif;
  font-size: 10pt;
  color: #5a2800;
  visibility: visible;
}

.BoxContent .ff_info {
  font-family: Verdana, Arial, Times New Roman, sans-serif;
  font-size: 8pt;
  color: #5a2800;
  visibility: visible;
}

.BoxContent .ff_infotext {
  font-family: Verdana, Arial, Times New Roman, sans-serif;
  font-size: 8pt;
  color: #5a2800;
  visibility: visible;
  line-height: 12pt;
}

.BoxContent .ff_large {
  font-family: Verdana, Arial, Times New Roman, sans-serif;
  font-size: 12pt;
  color: #5a2800;
  visibility: visible;
}

.BoxContent .ff_pagetext {
  font-family: Verdana, Arial, Times New Roman, sans-serif;
  font-size: 9pt;
  color: #5a2800;
  visibility: visible;
  line-height: 13pt;
}

.BoxContent .ff_pagetextgrey {
  font-family: Verdana, Arial, Times New Roman, sans-serif;
  font-size: 9pt;
  color: #505050;
  visibility: visible;
  line-height: 13pt;
}

.BoxContent .ff_pagetextred {
  font-family: Verdana, Arial, Times New Roman, sans-serif;
  font-size: 9pt;
  color: #f00;
  visibility: visible;
  line-height: 13pt;
}

.BoxContent .ff_red {
  font-family: Verdana, Arial, Times New Roman, sans-serif;
  color: #ef0000;
  visibility: visible;
  font-size: 8pt;
  font-weight: bold;
}

.BoxContent .ff_smallinfo {
  font-family: Verdana, Arial, Times New Roman, sans-serif;
  font-size: 7pt;
  color: #5a2800;
  visibility: visible;
}

.BoxContent .ff_white {
  font-family: Verdana, Arial, Times New Roman, sans-serif;
  color: #efefef;
  visibility: visible;
  font-size: 7pt;
  font-weight: bold;
}

.BoxContent .ff_whitelarge {
  font-family: Verdana, Arial, Times New Roman, sans-serif;
  color: #efefef;
  visibility: visible;
  font-size: 9pt;
  font-weight: bold;
}

.BoxContent .white {
  color: #efefef;
  visibility: visible;
}

.BoxContent td {
  font-family: Verdana, Arial, Times New Roman, sans-serif;
  font-size: 10pt;
  color: #5a2800;
}

.BoxContent td .green {
  color: #00bf00;
}

.BoxContent td .grey {
  color: #808080;
}

.BoxContent td .red {
  color: #ef0000;
}

.BoxContent td .white {
  color: #efefef;
  visibility: visible;
}

.BoxContent td .whites {
  color: #efefef;
  visibility: visible;
  font-size: 9pt;
}

.BoxContent td .yellow {
  color: #ffbb05;
}

.Content {
  position: relative;
  top: 0px;
  width: 100%;
}

.Content a {
  font-family: Verdana, Arial, Times New Roman, sans-serif;
  font-weight: bold;
  color: #004294;
  text-decoration: none;
}

.Content a:hover {
  font-family: Verdana, Arial, Times New Roman, sans-serif;
  font-weight: bold;
  text-decoration: underline;
  color: #0063dc;
}

.Content th {
  font-family: Verdana, Arial, Times New Roman, sans-serif;
  font-size: 10pt;
  font-weight: bold;
  text-align: left;
  color: white;
  background-color: #505050;
}

.Corner-bl {
  position: absolute;
  bottom: -4px;
  left: -6px;
  width: 17px;
  height: 17px;
  z-index: 50;
}

.Corner-br {
  position: absolute;
  bottom: -4px;
  right: -6px;
  width: 17px;
  height: 17px;
  z-index: 50;
}

.Corner-tl {
  position: absolute;
  top: -4px;
  left: -5px;
  width: 17px;
  height: 17px;
  z-index: 50;
}

.Corner-tr {
  position: absolute;
  top: -4px;
  right: -5px;
  width: 17px;
  height: 17px;
  z-index: 50;
}

.CornerWrapper-b {
  position: absolute;
  width: 100%;
}

.LabelV {
  font-weight: bold;
  padding-right: 10px;
  white-space: nowrap;
  vertical-align: top;
}

.SmallBox {
  position: relative;
  font-size: 1px;
}

.SmallBox .AttentionSign {
  position: absolute;
  top: 3px;
  left: 8px;
  width: 30px;
  height: 26px;
}

.SmallBox .BoxFrameEdgeLeftBottom {
  position: absolute;
  left: -1px;
  bottom: -1px;
  width: 5px;
  height: 5px;
}

.SmallBox .BoxFrameEdgeLeftTop {
  position: absolute;
  left: -1px;
  top: -1px;
  width: 5px;
  height: 5px;
}

.SmallBox .BoxFrameEdgeRightBottom {
  position: absolute;
  right: -1px;
  bottom: -1px;
  width: 5px;
  height: 5px;
}

.SmallBox .BoxFrameEdgeRightTop {
  position: absolute;
  right: -1px;
  top: -1px;
  width: 5px;
  height: 5px;
}

.SmallBox .BoxFrameHorizontal {
  position: relative;
  height: 4px;
}

.SmallBox .BoxFrameVerticalLeft {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 3px;
  background-repeat: repeat-y;
  height: 100%;
}

.SmallBox .BoxFrameVerticalRight {
  position: absolute;
  right: 0px;
  top: 0px;
  width: 3px;
  background-repeat: repeat-y;
  height: 100%;
}

.SmallBox .ErrorMessage {
  font-size: 8pt;
  position: relative;
  color: red;
  height: 100%;
  background-color: #3e0903;
  padding: 5px;
  padding-left: 43px;
}

.SmallBox .ErrorMessage ul {
  padding-left: 15px;
}

.SmallBox .Message {
  font-size: 10pt;
  position: relative;
  height: 100%;
  background-color: #3e0903;
  padding: 10px;
}

.SmallBox .MessageContainer {
  position: relative;
  height: 100%;
}

.TableContainer {
  position: relative;
  width: 100%;
  font-size: 1px;
}

.TableContainer .CaptionContainer {
  position: relative;
  font-size: 1pt;
  background-color: #5f4d41 !important;
  height: 100%;
  width: 100%;
  text-align: left;
}

.TableContainer .CaptionContainer .CaptionInnerContainer {
  position: relative;
  background-color: #3e0903;
  width: 100%;
  height: 100%;
  padding-top: 3px;
  padding-bottom: 4px;
}

.TableContainer .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: 0px;
  padding-bottom: 0px;
}

.TableContainer .Even {
  background-color: #3e0903;
}

.TableContainer .Odd {
  background-color: #872b21;
}

.TableContainer .Table1 {
  width: 100%;
  background-color: #751106;
  /* border: 2px solid #fb9709; */
}

.TableContainer .Table1 .InnerTableContainer {
  padding: 5px;
}

.TableContainer .Table2 {
  width: 100%;
  border: 2px solid #3e0903;
  background-color: #872b21;
  padding: 0px;
  margin: 0px;
  border-collapse: collapse;
}

.TableContainer .Table2 .InnerTableContainer {
  margin-top: 1px;
}

.TableContainer .Table2 .InnerTableContainer table {
  border-collapse: collapse;
}

.TableContainer .Table2 .InnerTableContainer td {
  padding-top: 2px;
  padding-left: 5px;
  padding-bottom: 2px;
  padding-right: 5px;
  border: 1px solid #faf0d7;
}

.TableContainer .Table2 td {
  padding: 0px;
  margin: 0px;
}

.TableContainer .Table3 {
  width: 100%;
  border: 2px solid #3e0903;
  background-color: #7e1e14;
}

.TableContainer .Table3 .InnerTableContainer {
    width: 100%;
    position: relative;
    margin-top: 5px;
    margin-left: 3px;
}

.TableContainer .Table3 .TableContentAndRightShadow td {
  border: 1px solid #7e1e14;
}

.TableContainer .Table4 {
  width: 100%;
  border: 2px solid #3e0903;
  background-color: #7e1e14;
}

.TableContainer .Table4 .InnerTableContainer {
  width: 100%;
  position: relative;
  margin-top: 3px;
}

.TableContainer .Table4 .TableContentAndRightShadow .TableContent td {
  padding-left: 4px;
  padding-top: 2px;
  padding-bottom: 2px;
}

.TableContainer .Table5 {
  width: 100%;
  border: 2px solid #3e0903;
  background-color: #872b21;
}

.TableContainer .Table5 .InnerTableContainer {
  width: 100%;
  position: relative;
  margin-top: 5px;
  margin-left: 3px;
}

.TableContainer .Table5 .TableContentAndRightShadow .TableContent td {
  padding-left: 4px;
  padding-top: 2px;
  padding-bottom: 2px;
}

.TableContent {
  width: 100%;
  border-collapse: collapse;
}

.TableContent td {
  padding-left: 5px;
  padding-top: 2px;
  padding-right: 5px;
  padding-bottom: 2px;
}

.TableContentContainer {
  border: 1px solid #751106;
  position: relative;
  margin-right: 4px;
  height: 100%;
  background-color: #3e0903;
  padding: 0px;
}

.Themebox {
  position: relative;
  margin-bottom: 10px;
  top: -4px;
  width: 180px;
  height: 154px;
}

.Title {
  position: absolute;
  top: 6px;
  left: 5px;
}

*/
/* } */

/* Prawa kolumna */

.CharDetails {
    width: 200px;
    position: relative;
    /* left: 150px; */
    top: 0px;
    text-align: center;
}

.BackButton {
    width: 131px;
    height: 32px;
    background: url("./images/newcreate/back_btn.png");
    border: 0;
    cursor: pointer;
    transition: 0.5s;
}

.ButtonContainer {
    top: 11px;
    position: relative;
    height: 32px;
    width: 265px;
    left: 85px;
    margin: 0px 0px 5px 0px;
}

.content form.newselcharform {
    height: auto;
    width: 810px;
    margin: 0px auto;
}

.CreateButton {
    width: 131px;
    height: 32px;
    background: url("./images/newcreate/create_btn.png");
    border: 0;
    cursor: pointer;
    transition: 0.5s;
}

.CreateButton:hover, .BackButton:hover {
  filter: brightness(120%);
}

.CreateCharacterContainer {
    display: flex;
    justify-content: space-between;
    width: 100%;
    margin: 8px auto;
    /* gap: 20px; */
}

.CreateCharNew {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    /* gap: 10px; */
}

.error-box {
    background-color: #ffebee;
    border: 1px solid #ffcdd2;
    padding: 10px;
    margin: 10px 0;
    border-radius: 4px;
}

.error-box ul {
    margin: 5px 0 0 20px;
    padding: 0;
}

.GenderOptions {
    top: 0px;
    position: relative;
    left: 146px;
    width: 150px;
}

.GenderOptions label {
    margin: 0 10px;
    font-size: 14px;
    cursor: pointer;
}

.imgselchar {
    width: 80px;
    /* height: 80px; */
    object-fit: contain;
    border: 2px solid transparent;
    border-radius: 5px;
}

.imgselchar.checked {
    border-color: gold;
    box-shadow: 0 0 10px gold;
}

.LeftColumn {
    width: 326px;
    height: 443px;
    flex: 1;
    display: flex;
    /* margin-left: 7px; */
}

.profession-info {
    height: 323px;
    flex-grow: 1;
}

.profession-list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
}

.profession-name {
    display: none;
}

.profession-option {
    width: 81px;
    height: 111px;
    position: relative;
    left: 6px;
    cursor: pointer;
    transition: transform 0.2s;
}

.profession-option:hover {
    transform: scale(1.05);
}

.profession-selection {
    width: 326px;
    height: 330px;
    flex: 1;
    display: flex;
}

.realnick {
    position: relative;
    top: -142px;
    right: 14px;
    font-size: 15px;
}

.RightColumn {
    /* width: 451px; */
    /* height: 120px; */
    /* float: right; */
    /* display: grid; */
    /* justify-content: center; */
}

.SmallBox2 {
    position: relative;
    font-size: 1px;
    margin-bottom: 80px;
}

.SmallBoxCreateChar .AttentionSign {
  position: absolute;
  top: 3px;
  left: 8px;
  width: 30px;
  height: 26px;
}

.SmallBoxCreateChar .BoxFrameEdgeLeftBottom {
  position: absolute;
  left: -1px;
  bottom: -1px;
  width: 5px;
  height: 5px;
}

.SmallBoxCreateChar .BoxFrameEdgeLeftTop {
  position: absolute;
  left: -1px;
  top: -1px;
  width: 5px;
  height: 5px;
}

.SmallBoxCreateChar .BoxFrameEdgeRightBottom {
  position: absolute;
  right: -1px;
  bottom: -1px;
  width: 5px;
  height: 5px;
}

.SmallBoxCreateChar .BoxFrameEdgeRightTop {
  position: absolute;
  right: -1px;
  top: -1px;
  width: 5px;
  height: 5px;
}

.SmallBoxCreateChar .BoxFrameHorizontal {
    position: relative;
    height: 2px;
}

.SmallBoxCreateChar .BoxFrameVerticalLeft {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 2px;
    background-repeat: repeat-y;
    height: 100%;
}

.SmallBoxCreateChar .BoxFrameVerticalRight {
    position: absolute;
    right: 0px;
    top: 0px;
    width: 2px;
    background-repeat: repeat-y;
    height: 100%;
}

.SmallBoxCreateChar .ErrorMessage {
  font-size: 8pt;
  position: relative;
  color: red;
  height: 100%;
  background-color: #3e0903;
  padding: 5px;
  padding-left: 43px;
}

.SmallBoxCreateChar .ErrorMessage ul {
  padding-left: 15px;
}

.SmallBoxCreateChar .Message {
  font-size: 10pt;
  position: relative;
  height: 100%;
  background-color: #3e0903;
  padding: 10px;
}

.SmallBoxCreateChar .MessageContainer {
  position: relative;
  height: 100%;
}

.Table3.dol {
    /* background-color: #7e1e14; */
    background-image: url("images/newcreate/content-bottom.png");
    width: 810px;
    height: 20px;
    border: 0px solid #e4ae74;
    /* margin-left: -50px; */
    top: -17px;
    position: relative;
    margin: 0px 0px 0px 0px;
}

.transform {
    height: 70px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    flex: 1;
}

.transform img {
    max-width: 45px;
    max-height: 32px;
    width: auto;
    height: auto;
    display: block;
}

.transform-type img {
    max-width: 64px;
    max-height: 64px;
    width: auto;
    height: auto;
    display: block;
}

.transform-type {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    width: 64px;
    height: 64px;
}

.transform-level {
    font-size: 12px;
    color: #aaa;
}

.transform-level2 {
    font-size: 12px;
    color: #aaa;
}

.transforms-containerreg {
    display: flex;
    flex-wrap: nowrap;
    gap: 0px;
    right: 0px;
    top: -108px;
    position: relative;
    justify-content: space-between;
    width: 93%;
}

.transforms_container_type {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    flex-wrap: nowrap;
    gap: 0px;
    margin-top: -62px;
    width: 64px;
    height: 64px;
    left: 181px;
    top: -185px;
    position: relative;
    justify-content: start;
}

.WeaponDescription {
    position: relative;
    top: -188px;
    width: 421px;
    height: 31px;
    font-size: 24px;
    color: #fff;
    margin-top: -144px;
}

.WeaponImage {
    width: 421px;
    height: 316px;
    border: 0px solid #e4ae74;
    border-radius: 0px;
    margin: 0px 30px 0px 0px;
}

.WeaponInfo {
    text-align: center;
    margin-bottom: 12px;
    height: 327px;
    /* left: 30px; */
    position: relative;
}

.WeaponSelection {
    margin-bottom: 11px;
    margin-top: 6px;
}

.WeaponType {
    position: relative;
    top: -137px;
    width: 165px;
    height: 20px;
    left: 222px;
    font-size: 16px;
    font-weight: bold;
    color: #d4a017;
    text-align: initial;
}

.WeaponTypeName {
    position: relative;
    top: -153px;
    width: 165px;
    height: 20px;
    left: 152px;
    font-size: 11px;
    /* font-weight: bold; */
    color: #a7a7a7;
    text-align: initial;
    font-family: "Tahoma",sans-serif;
}

div#vocation_check {
    position: relative;
    left: 30px;
}

input[type="textaccmanager"] {
    width: 119px;
    height: 18px;
    border: 0;
    box-sizing: border-box;
    border-image-slice: 8 10 10 10;
    border-image-width: 9px 10px 10px 10px;
    border-image-outset: 0px 0px 0px 0px;
    border-image-repeat: stretch stretch;
    border-image-source: url("./images/newcreate/input-nickname.png");
    padding: 2px 2px 1px 2px;
    margin-left: 156px;
    /* left: 10px; */
    color: #ffffff;
    outline: none;
    text-align: center;
    opacity: .79;
    /* font-family: "Bodoni MT"; */
    font-weight: 400;
    transition: background-color 2147483647s ease-in, background-image 2147483647s ease-in, color 2147483647s ease-in;
}

table.Table3.srodek {
    background: url("images/newcreate/content-center.png") !important; 
    width: 810px;
    border: 0px solid #e4ae74;
}

.TableContainerCreatChars {
    position: relative;
    width: 100%;
    font-size: 1px;
}

.card-bg-layer-accman {
    position: absolute;
    border-radius: 12px;
    background: linear-gradient(145deg, #3d0f0b 0%, #872b21 50%, #2a0a07 100%);
    /* z-index: -2; */
    border: 1px solid rgba(255, 200, 150, 0.1);
    box-shadow: 0 10px 30px rgba(0,0,0,0.6);
}

.tlo-bg-fld {
    width: auto;
    height: auto;
    border-radius: 12px;
    background: linear-gradient(145deg, #3d0f0b 0%, #872b21 50%, #2a0a07 100%);
    border: 1px solid rgba(255, 200, 150, 0.1);
    box-shadow: 0 10px 30px rgba(0,0,0,0.6);
    color: #e1e1e1;
}
.tlo-bg-fld-welcome {
    width: 830px;
    height: auto;
    border-radius: 11px;
    background: linear-gradient(145deg, #3d0f0b 0%, #872b21 50%, #2a0a07 100%);
    border: 0px solid rgba(255, 200, 150, 0.1);
    box-shadow: 0 10px 30px rgba(0,0,0,0.6);
    color: #e1e1e1;
    margin: 0px auto;
    position: relative;
    right: 8px;
}

input[type="radio" i] {
    cursor: pointer;
}

@keyframes playEffect {
    0%    { background-position: 0px 0px; }
    8%    { background-position: 0px -32px; }
    16%   { background-position: 0px -64px; }
    24%   { background-position: 0px -96px; }
    32%   { background-position: 0px -128px; }
    40%   { background-position: 0px -160px; }
    48%   { background-position: 0px -192px; }
    64%  { background-position: 0px -192px; }
    87%  { background-position: 0px -192px; }
    100%  { background-position: 0px -192px; }
}

.efekt-animacja {
    width: 32px;
    height: 32px;
    background-repeat: no-repeat;
    position: absolute;
    top: 13px;
    left: 50%;
    transform: translateX(-50%);
    pointer-events: none;
    animation: playEffect steps(1) 1.2s infinite;
}
.efekt-animacja-char {
    width: 32px;
    height: 32px;
    background-repeat: no-repeat;
    position: absolute;
    top: 9px;
    left: 47%;
    transform: translateX(-47%);
    pointer-events: none;
    animation: playEffect steps(1) 1.2s infinite;
}
.efekt-1500 {
    background-image: url('/selcharnew/effect_6.png');
}
.efekt-2000 {
    background-image: url('/selcharnew/effect2_18.png');
}
.efekt-animacja-spells {
    width: 32px;
    height: 32px;
    background-repeat: no-repeat;
    position: absolute;
    top: 58px;
    left: 50%;
    transform: translateX(-50%);
    pointer-events: none;
    animation: playEffect steps(1) 1.2s infinite;
}