:root {

    /**
    * colors
    */
    --navbar-color-logo: rgba(19, 20, 22, 0.88);
    --md-gray: #3A3D43;
    --lightest-gray: #CED2D9;

    --font-family-paragraph: "Open Sans",sans-serif;
    --yellow: #fbc321;

    --rich-black-fogra-29_95: hsla(222, 18%, 11%, 0.95);
    --raisin-black-1: hsl(0, 0%, 16%);
    --raisin-black-2: hsl(236, 17%, 17%);
    --raisin-black-3: hsl(280, 11%, 11%);
    --raisin-black-4: hsl(280, 8%, 15%);
    --english-violet: hsl(274, 21%, 23%);
    --eerie-black-1: hsl(277, 25%, 10%);
    --eerie-black-2: hsl(280, 7%, 8%);
    --roman-silver: hsl(220, 6%, 59%);
    --quick-silver: hsl(0, 1%, 65%);
    --lightest-gray: #ced2d9;
    --light-gray: #a6aab2;
    --light-gray-1: hsl(0, 0%, 80%);
    --light-gray-2: hsl(0, 2%, 82%);
    --marigold_75: hsla(42, 99%, 46%, 0.75);
    --xiketic_90: hsla(280, 37%, 8%, 0.9);
    --cultured-2: hsl(0, 0%, 97%);
    --marigold: hsl(42, 99%, 46%);
    --platinum: hsl(0, 0%, 89%);
    --dim-gray: hsl(0, 0%, 42%);
    --white_15: hsla(0, 0%, 100%, 0.15);
    --white_10: hsla(0, 0%, 100%, 0.1);
    --xiketic: hsl(277, 25%, 10%);
    --silver: hsl(0, 0%, 78%);
    --white: hsl(0, 0%, 100%);
    --jet: hsl(236, 13%, 23%);
    --navbar-color: rgba(19, 20, 22, 0.9);
    --bs-body-bg: #fff;

    /**
    * typography
    */
    --bs-border-width: 1px;
    --bs-modal-border-width: var(--bs-border-width);
    --ff-oxanium: 'Oxanium', cursive;
    --ff-poppins: 'Poppins', sans-serif;

    --fs-1: 7rem;
    --fs-2: 4.5rem;
    --fs-3: 3.6rem;
    --fs-4: 2.4rem;
    --fs-5: 2.2rem;
    --fs-6: 2rem;
    --fs-7: 1.6rem;
    --fs-8: 1.5rem;
    --fs-9: 1.4rem;
    --fs-10: 1.3rem;
    --fs-11: 1.2rem;

    --fw-500: 500;
    --fw-600: 600;
    --fw-700: 700;
    --fw-800: 800;
    --darkblue: #040a2c;
    --lightblue: #00f0ff;

    /**
    * spacing
    */

    --section-padding: 120px;

    /**
    * gradient
    */

    --gradient: radial-gradient(circle, hsl(250, 7%, 17%), hsl(250, 11%, 11%));

    /**
    * box shadow
    */

    --shadow-1: 0px 2px 8px 0px hsla(0, 0%, 0%, 0.2), inset 0px 2px 8px 0px hsla(0, 0%, 0%, 0.4);
    --shadow-2: 0px 5px 10px 1px hsla(0, 0%, 0%, 0.4);
    --shadow-3: 0px 5px 10px 1px hsla(219, 98%, 17%, 0.2);
    --shadow-4: 0px 5px 10px 1px hsla(0, 0%, 0%, 0.15);

    /**
    * transition
    */

    --transition: 0.25s ease;
    --cubic-out: cubic-bezier(0.33, 0.85, 0.4, 0.96);

  /* === SweetAlert2 Dark Theme Overrides === */
  --swal2-background: #1e1e1e !important;
  --swal2-title-color: #ffffff !important;
  --swal2-html-container-color: #dddddd !important;

  --swal2-confirm-button-background: linear-gradient(to right, #f7b733, #fc4a1a) !important;
  --swal2-confirm-button-color: #ffffff !important;
  --swal2-confirm-button-border: 3px solid #ff8600 !important;

  --swal2-cancel-button-background: #d33 !important;
  --swal2-cancel-button-color: #ffffff !important;

  --swal2-backdrop: rgba(0, 0, 0, 0.7) !important;

}

@font-face {
  font-family: martelTibia;
  src: url('/fonts/martel.ttf');
}

section {
    min-height: 150px;
    background-color: #d4c0a1;
    border: 1px solid #5f4d41;
    box-shadow: 3px 3px 2px #875f3e;
    padding: 8px;
}

hr {
    width: 100%;
}


section .resizeSectionImg {
    width: 140px;
    float: right;
    margin: 10px;
    position: relative;
    top: -29px;
}
.sectionX {
    display: none; /* Esconde todas as seções inicialmente */
    border-top: 1px solid #ddd; /* Linha separadora sutil */
}

.sectionX.active {
    display: block;
}

.sectionX img {
    max-width: 100%;
    height: auto;
    display: block;
}
.NavigationBarLinkListX {
    text-align: center;
    order: 1;
}
body {
    margin: 0px;
    padding:  0px !important; /* adicionei !important para parar a movimentação da tela ao abrir swal */
    position: relative;
    /*min-height: 300vh;*/
    min-width: 359px;

    /* para parar a movimentação da tela ao abrir swal */
    overflow-y: scroll !important;
}

p {
    text-align: justify;
}

#ArtworkHelper {
  text-align: center;
  background-position: top center;
  background-attachment: scroll;
  background-repeat: no-repeat;
  width: 100%;
  /*height: 100%;*/
  min-width: 1000px;/*
  min-height: 800px;*/
}

/* container to implement min/max width */
#Bodycontainer {
  text-align: left;
  min-width: 1000px;
  max-width: 1280px;
  width: 100%;
  height: 100%;
  margin: 0px;
  margin-left: auto;
  margin-right: auto;
  padding: 0px;
  display: table;
}

#ContentRow {
  position: relative;
  top: 170px;
  max-width: 1280px;
}

/* "star-HTML-hack" to correct the position of the content row */
* html #ContentRow {
  display: inline-block;
}

#MenuColumn {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 180px;
  margin-right: 15px;
  margin-left: 15px;
  padding: 0px;
  font-family:  Arial, sans-serif;
  font-size: 10pt;
  font-weight: bold;
  line-height: 12pt;
}

#ContentColumn {
  position: relative;
  margin: 0px;
  margin-left: 205px;
  margin-right: 205px;
}

#ThemeboxesColumn {
  text-align:  center;
  position: absolute;
  top: 0px;
  right: 0px;
  width: 180px;
  margin: 0px;
  margin-right: 15px;
  margin-left: 25px;
}

/* alterar bootstrap */
.bg-body {
    font-weight: 400;
}

#Footer {
  font-family: Verdana, Arial, Times New Roman, sans-serif;
  font-size: 7pt;
  font-weight: normal;
  text-align: center;
  position: relative;
  width: 100%;
  padding-bottom: 20px;
  color: white;
}
* html #Footer {
  padding-bottom: 120px;
  margin-bottom: 50px;
}

/* Footer linkes */
#Footer a:link    { color: white; text-decoration: none; }
#Footer a:visited { color: white; text-decoration: none; }
#Footer a:focus   { color: white; text-decoration: none; }
#Footer a:active  { color: white; text-decoration: underline; }
#Footer a:hover   { color: white; text-decoration: underline; }

/** -------------------------------
 *  Stylesheet declarations for the
 *  HEADER AREA
 *  -------------------------------
 */

.InfoBar {
  position: relative;
  height: 28px;
  top: 6px;
  margin-left: 5px;
  margin-right: 5px;
  font-size: 10px;
  color: #fff;
  font-family:
    Verdana,
    Arial,
    Times New Roman,
    sans-serif;
}
.InfoBar a {
  border: 0;
}
.InfoBarBlock {
  margin-right: 15px;
  border: 0;
}
.InfoBarBigLogo {
  margin-bottom: 0;
margin-top: -3px;
  border: 0;
}
.InfoBarSmallElement {
  margin-left: 5px;
  border: 0;
}
.InfoBarNumbers {
  top: -2px;
  position: relative;
}
.InfoBar a {
margin-top: 10px;
  font-family:
    Verdana,
    Arial,
    Times New Roman,
    sans-serif;
  font-size: 7pt;
  font-weight: 400;
  color: #fff;
}
.InfoBar a:link {
  color: #fff;
  font-weight: 400;
  text-decoration: none;
}
.InfoBar a:visited {
  color: #fff;
  font-weight: 400;
  text-decoration: none;
}
.InfoBar a:focus {
  color: #fff;
  font-weight: 400;
  text-decoration: none;
}
.InfoBar a:active {
  color: #fff;
  font-weight: 400;
  text-decoration: underline;
}
.InfoBar a:hover {
  color: #fff !important;
  font-weight: 400 !important;
  text-decoration: underline !important;
}
.InfoBarLinks {
  text-decoration: none;
  font-size: 10px;
}
.InfoBarLinks a:hover {
  text-decoration: none;
  font-size: 10px;
}

#LeftArtwork {
    position: absolute;
    top: 30px;
}

#LeftArtwork img {
    top: -230px;
    width: 280px;
    left: 172%;
    transform: translateX(-50%);
    z-index: 9;
    position: relative;
}

#LeftArtwork #TibiaLogoArtworkTop {
  cursor: pointer;
  border: 0px;
  /*
  overflow: hidden;
  transform: scale(.8);
  transition: transform .25s cubic-bezier(.5,0,0,1.75);*/
}

#LeftArtwork #LogoLink {
  position: absolute;
  bottom: 14px;
  left: 58px;
  height: 14px;
  width: 50px;
  z-index: 99;
  cursor: pointer;
}


#RightArtwork {
    position: absolute;
    /* top: 38px; */
    /* right: 26px; */
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    margin: auto;
    padding: 0px;
}

#RightArtwork #Monster {
    position: relative;
    left: -8px;
    cursor: pointer;
    top: -88px;
    z-index: 100;
}
#Pedestal {
    position: absolute;
    width: 160px;
    top: -82px;
    right: 10px;
}

.countdownLeftChain {
    background-image: url(../images/general/chain.gif);
    height: 35px;
    width: 100%;
    right: 130px;
    background-position-x: right;
    background-repeat: repeat-y;
    position: relative;
    top: 3px;
    display: inline-block;
}

.countdownMidNoChain {
    position: relative;
    left: 103px;
    top: -22px;
}

.countdownRightChain {
    background-image: url(../images/general/chain.gif);
    height: 31px;
    width: 100%;
    left: 130px;
    background-position-x: left;
    background-repeat: repeat-y;
    position: relative;
    top: -39px;
    display: inline-block;
}

#RightArtwork #Boss {
    position: relative;
    right: 24px;
    cursor: pointer;
    top: -88px;
    z-index: 100;
}

#PedestalAndOnline {
  position: absolute;
  left: -10px;
  top: -105px;
  width: 153px;
  height: 107px;
}

#RightArtwork #PlayersOnline {
  font-family : Verdana, Arial, Times New Roman, sans-serif;
  font-size: 7pt;
  line-height: 8pt;
  text-align: center;
  position: absolute;
  width: 92px;
  bottom: 11px;
  left: 21px;
  color: #cfa600;
  border-bottom: 1px solid #010101;
  cursor: pointer;
}

/** -------------------------------
 *  Stylesheet declarations for the
 *  LOGINBOX
 *  -------------------------------
 */

#Loginbox {
  position: relative;
  left: 5px;
  top: 8px;
  width: 100%;
  margin-bottom: 42px;
  background-repeat: no-repeat;
}
#HelperDivContainer {
    display: none;
    position: absolute;
    width: 225px;
    z-index: 1000;
    color: #5a2800;
    font-family: Verdana,Arial,Times New Roman,sans-serif;
    font-size: 9pt;
    text-align: left;
    padding: 10px;
    border: 1px double #5a2800;
    margin-left: 8px;
}
.HelperDivIndicator {
    position: relative;
    cursor: help;
}
#HelperDivContainer .HelperDivArrow {
    position: absolute;
    top: -1px;
    left: -8px;
    width: 8px;
    height: 13px;
}
#HelperDivContainer .Ornament {
    width: 200px
}
#HelperDivContainer #HelperDivHeadline {
    font-size: 12pt;
    font-weight: 700
}
#HelperDivContainer #HelperDivHeadline {
    position: relative;
    white-space: normal;
    margin-top: 0;
    margin-bottom: 15px
}

#HelperDivContainer #HelperDivText {
    text-align: justify;
}
#HelperDivContainer #HelperDivText ul {
    padding-left: 20px
}
#HelperDivContainer #HelperDivText .ItemOverLabel {
    margin-top: 7px;
    float: left
}
#HelperDivContainer #HelperDivText .ItemOverImage {
    float: left;
    margin-right: 20px;
    clear: both;
    margin-bottom: 10px
}

.LabelV120 {
    font-weight: 700;
    padding-right: 10px;
    white-space: nowrap;
    vertical-align: top;
    width: 120px;
}
.LabelV150 {
    font-weight: 700;
    padding-right: 10px;
    white-space: nowrap;
    vertical-align: top;
    width: 150px;
}
.LabelV175 {
    font-weight: 700;
    padding-right: 10px;
    white-space: nowrap;
    vertical-align: top;
    width: 175px;
}
.LabelV180 {
    font-weight: 700;
    padding-right: 10px;
    white-space: nowrap;
    vertical-align: top;
    width: 180px;
}
.LabelV200 {
  font-weight: 700;
  padding-right: 10px;
  white-space: nowrap;
  vertical-align: top;
  width: 200px;
}
.GuildInformationTable {
    padding-right: 5px;
    vertical-align: top;
}
.text-disabled {
  color: gray;
  cursor: no-drop;
}
.text-enabled {
  /*color: green;*/
  cursor: pointer;
}
.loginBoxLogin {
  display: flex;
  flex-wrap: wrap;
}

.loginBoxLogin .Cell {
  flex-basis: 190px;
  margin-bottom: 5px;
}

.loginBoxLogin .InputField {
  flex: 0 0 150px; /* grow=0, shrink=0, basis=150px */
  width: 150px;    /* garante largura */
  margin-right: 7px;
}

.loginBoxLogin .InputField input {
  width: 250%;
  max-width: 250%;
  height: 20px;
  line-height: 1.2;
  box-sizing: border-box; /* garante que padding não estoure o tamanho */
}

.loginBoxLogin .Break {
  flex-basis: 100%;
  height: 0;
}
.LoginButtons {
  vertical-align: top;
}
.LoginButtons .ButtonField {
    margin-bottom: 1px
}

#Loginbox #LoginTop {
  position: absolute;
  left: -5px;
  top: -12px;
  height: 12px;
  width: 300px;
  background-repeat: no-repeat;
}

#Loginbox #LoginBottom {
  position: absolute;
  top: 52px;
  left: -5px;
  height: 12px;
  width: 180px;
  background-repeat: no-repeat;
}

#Loginbox .LoginBorder {
  position: absolute;
  top: 0px;
  height: 52px;
  width: 8px;
  background-repeat: repeat-y;
  z-index: 10;
}

#Loginbox #BorderRight {
  right: 9px;
}

#Loginbox .Loginstatus {
  position: relative;
  top: -40px;
  left: 35px;
  height: 28px;
  width: 150px;
}

#Loginbox .LoginstatusText {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 150px;
  height: 28px;
  cursor: pointer;
}

.LoginstatusTextLogout {
  position: absolute;
  top: -30px;
  left: 25px;
  width: 150px;
  height: 28px;
  cursor: pointer;

  z-index: 9999; /* adiciona isso */

  background-image: url(../images/loginbox/loginbox-font-logout.gif);
}
.LoginstatusTextLogout:hover {
  background-image: url(../images/loginbox/loginbox-font-logout-over.gif);
}
.LoginstatusTextLogin {
  position: absolute;
  top: -30px;
  left: 25px;
  width: 150px;
  height: 28px;
  cursor: pointer;

  z-index: 9999; /* adiciona isso */

  background-image: url(../images/loginbox/loginbox-font-create-account.gif);
}
.LoginstatusTextLogin:hover {
  background-image: url(../images/loginbox/loginbox-font-create-account-over.gif);
}

#Loginbox #LoginButtonContainer {
  margin-left: 5px;
  height: 26px;
  width: 160px;
  background-repeat: repeat-y;
}

#Loginbox #LoginButton {
  position: relative;
  top: 1px;
  left: 12px;
  height: 25px;
  width: 135px;
}

#Loginbox #LoginButton .Button {
  position: relative;
  top: 0px;
  left: 0px;
  width: 135px;
  height: 25px;
  visibility: hidden;
}

#Loginbox #LoginButton #ButtonText {
  position: absolute;
  top: 0px;
  left: 0px;
  height: 22px;
  width: 135px;
  z-index: 15;
  cursor: pointer;
}

.SmallMenuBox .Loginstatus {
    position: relative;
    top: 0;
    left: 5px;
    height: 13px;
    width: 160px
}

.SmallMenuBox {
  position: relative;
  left: -47px;
  top: 0px;
  width: 208px;
  height: 105px;
  margin-bottom: 15px;
  background-repeat: no-repeat;
}

.SmallMenuBox .SmallBoxTop {
    position: absolute;
    left: -5px;
    top: -12px;
    height: 12px;
    width: 180px;
    background-repeat: no-repeat
}

.SmallMenuBox .SmallBoxBottom {
    position: absolute;
    top: 52px;
    left: -5px;
    height: 12px;
    width: 180px;
    background-repeat: no-repeat
}

.SmallMenuBox .SmallBoxBorder {
    position: absolute;
    top: 0;
    height: 52px;
    width: 8px;
    background-repeat: repeat-y;
    z-index: 10
}

.SmallMenuBox .BorderRight {
    right: 9px
}

.SmallMenuBox .SmallBoxButtonContainer {
  position: relative;
  height: 105px;
  width: 208px;
  left: 0px;
  background-repeat: no-repeat;
  z-index: 1;
}

.SmallMenuBox#DownloadBox {
    top: 4px
}

.SmallMenuBox#DownloadBox .SmallBoxBottom {
    top: 39px
}

.SmallMenuBox#DownloadBox .SmallBoxBorder {
    height: 39px
}

.SmallMenuBorder {
    display: none
}

#PlayNowContainer {
    width: 100%;
    height: 100%;
    cursor: pointer;
    position: absolute;
    z-index: 99;
    background-image:url(../images/buttons/mediumbutton.gif);
    background-position: center; 
    background-repeat: no-repeat;
}

#PlayNowContainer:hover {
  background-image:url(../images/buttons/mediumbutton-over.gif);
}

#PlayNowContainer form {
    width: 100%;
    height: 100%;
    cursor: pointer;
    margin: 0;
    padding: 0;
    border: 0
}

.MediumButtonBackground {
  position: relative;
  top: 0;
  left: 0;
  width: 177px;
  height: 48px;
  z-index: 10;
}

/* BUTTONS */
.MediumButtonText {
  background: none !important;
  border: none;
  position: absolute;
  top: 27px;
  left: 17px;
  height: 48px;
  width: 177px;
  z-index: 20;
}

.MediumButtonText3 {
  background: none !important;
  border: none;
  position: absolute;
  top: 27px;
  left: 17px;
  height: 48px;
  width: 177px;
  z-index: 20;
}

.MediumButtonText2 {
  background: none !important;
  border: none;
  position: absolute;
  top: 27px;
  left: 17px;
  height: 48px;
  width: 177px;
  z-index: 20;
}


/** -------------------------------
 *  Stylesheet declarations for the
 *  MENU
 *  -------------------------------
 */

#Menu {
  position: relative;
  left: -32px;
  background-repeat: no-repeat;
}

#MenuBottom {
  position: relative;
  left: 2px;
  bottom: 0px;
  height: 12px;
  width: 180px;
  background-repeat: no-repeat;
}
#LeftArtwork img {
    animation: float 3s ease-in-out infinite;
}

@keyframes float {
    0% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-6px); /* sobe levemente */
    }
    100% {
        transform: translateY(0px);
    }
}

/* Menuitems */

.MenuButton {
  position: relative;
  height: 32px;
  width: 170px;
  display: block;
  cursor: pointer;
}

.Button {
  position: relative;
  height: 32px;
  width: 170px;
  visibility: hidden;
  display: block;
}

.Extend {
  position: absolute;
  top: 20px;
  right: -2px;
  height: 12px;
  width: 12px;
  background-repeat: no-repeat;
}

@keyframes slideIn {
    from {
        transform: translateY(-50px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}
.Lights {
  visibility: hidden;
}

.Light_lu {
  position: absolute;
  top: 2px;
  left: 3px;
  height: 2px;
  width: 2px;
  background-repeat: no-repeat;
}

.Light_ru {
  position: absolute;
  top: 2px;
  right: 3px;
  height: 2px;
  width: 2px;
  background-repeat: no-repeat;
}

.Light_ld {
  position: absolute;
  height: 2px;
  width: 2px;
  top: 28px;
  left: 3px;
}

.Icon {
  position: absolute;
  height: 32px;
  width: 32px;
  top: 0px;
  left: 8px;
  background-repeat: no-repeat;
  background-size: 32px 32px;
}

.Label {
  position: absolute;
  height: 22px;
  width: 116px;
  top: 6px;
  left: 42px;
}

.MenuButton .Label {
    position: absolute;
    height: 24px;
    width: 116px;
    top: 5px;
    left: 38px;
    padding: 3px;
    text-align: left;
    color: #E8DC33;
    text-shadow: -1px -1px 0 #000000,
                 1px -1px 0 #2c2c2c,
                -1px  1px 0 #000000,
                 1px  1px 0 #000;
    font-weight: 100;
	font-family: 'Metal Mania', cursive;
    font-size: 20px;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Submenus(items) */

.LeftChain {
  position: absolute;
  top: 0px;
  left: 0px;
  height: 33px;
  width: 7px;
  background-repeat: repeat-y;
}

.RightChain {
  position: absolute;
  top: 0px;
  right: 0px;
  height: 33px;
  width: 7px;
  background-repeat: repeat-y;
}

.Submenu {
  position: relative;
  margin-left: 1px;
  margin-right: 2px;
  background-color: #0F2336;
  width: 168px;
}

.Submenuitem {
  position: relative;
  z-index: 2;
  margin: 0px;
  padding: 0px;
}

.ActiveSubmenuItemIcon {
  position: absolute;
  top: 5px;
  left: 3px;
  width: 10px;
  height: 10px;
  background-repeat: no-repeat;
  visibility: hidden;
}

.SubmenuitemLabel {
  margin: 0px;
  border-top: 0;
  padding-top: 2px;
  padding-bottom: 2px;
  padding-left: 5px;
  border-bottom: 1px solid #222C4D;
  overflow: hidden;
}

/* Submenu links */
.Submenu a:link    { color: #d7d7d7; text-decoration: none; }
.Submenu a:visited { color: #d7d7d7; text-decoration: none; }
.Submenu a:focus   { color: #d7d7d7; text-decoration: none; }
.Submenu a:active  { color: white; text-decoration: none; }
.Submenu a:hover   { color: white; text-decoration: none; }

/** -------------------------------
 *  Stylesheet declarations for the
 *  CONTENT AREA
 *  -------------------------------
 */

.Content .BoxContent {
  padding: 10px;
}

/* "tanhack" for correction of IE bug */
* html .Content {
  top: -5px;
}

.Content {
  position: relative;
  top: 0px;
  width: 100%;
  /*z-index: 100;*/
}

/* "star-HTML-hack" to correct the position of the content area */
* html .Content {
  position: relative;
  top: 796px;
  margin: 20px;
  border: 0px dashed #061222;
  border-right-width: 550px;
}

#ContentHelper {
  position: relative;
  /* coloquei max-width por causa dos tickers, estava expandindo a tela */
}

/* "star-HTML-hack" to to implement min-width in IE */
* html #ContentHelper {
  display: inline-block;
  position: relative;
  top: -800px;
  margin: -20px;
  margin-right: -570px;
}

.Content .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;
}

.Content .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;
}

/* "star-HTML-hack" to correct Box width in IE */
* html .Content .Box {
  width: 100%;
}
/* "star-HTML-hack" to correct BoxContent width in IE */
* html .Content .BoxContent {
  width: 100%;
}

.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;
}

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

/* Content Links */

.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 .HelpLink {
  font-size: 7pt;
  cursor: pointer;
}

.Content .ThreeColumnsForm {
  display: flex;
  flex-wrap: wrap;
}
.Content .ThreeColumnsForm .ThreeColumnsFormCell {
    flex-basis: 145px;
    margin-top: 5px;
    margin-bottom: 5px;
    margin-right: 5px;
    flex-grow: 0;
}
.Content .ThreeColumnsForm .ThreeColumnsFormButton {
    margin-left: auto;
}

.Content .ThreeColumnsForm .ThreeColumnsFormInputCell {
    flex-basis: 200px;
    flex-grow: 2;
}
.ServerInformationIconContainer_Worlds {
    position: absolute;
    right: 10px;
}
.TableHeadlineNavigation {
    margin-top: 4px;
    font-size: 8px;
    float: right;
}
.TableHeadlineNavigation a {
  font-family: Verdana,Arial,Times New Roman,sans-serif;
  color: #fff;
}
.TableHeadlineNavigation a:hover {
  font-family: Verdana,Arial,Times New Roman,sans-serif;
  color: #fff;
  text-decoration: underline;
}
.sortarrow {
    width: 10px;
    height: 10px;
}
/* Corners */

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

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

.Content .BottomCornersHelper {
  position: absolute;
  width: 100%;
}

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

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

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

/* Borders */

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

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

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

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

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

/** -------------------------------
 *  Stylesheet declarations for the
 *  THEMEBOXES of the Tibia
 *  website
 *  -------------------------------
 */

.main-themboxes {
  grid-area: sidebar
}

.main-themboxes {
    position: relative;
    display: flex;
    flex-direction: column;
    height: 100%;
    z-index: 100
}
#DeactivationContainerThemebox {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 95;
    height: 1000px;
    width: 100%;
    display: none
}


.Themebox {
    position: relative;
    top: 0;
    margin-bottom: 10px;
    width: 180px;
    /*height: 154px;*/
    margin-left: auto;
    margin-right: auto;
    background-repeat: no-repeat;
}

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

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

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

.Themeboxes #AnniversaryCountDownBox {
    height: 120px;
    margin-bottom: 30px
}

.Themeboxes #AnniversaryCountDownExtendedBox {
    height: 146px
}

.Themeboxes #AnniversaryBox {
    height: 188px
}

.Themeboxes #NewcomerBox .ThemeboxButton {
    bottom: 15px
}

.Themeboxes #JobBox {
    height: 164px
}

#TrailerBox {
    height: 153px
}

.box-header-font {
    font-family: martel;
    /* font-weight: bold; */
    text-transform: uppercase;
    color: #efefef;
    text-shadow: 2px 2px 4px rgb(0 0 0);

    position: relative;
    top: 2px;
}

.box-content-header-font {
    font-family: martel;
    text-transform: uppercase;
    color: #efd4ad;
    text-shadow: 2px 2px 4px rgb(0 0 0);
    position: absolute;
    font-size: 23px;
    top: 0;
}

.sorteio-box {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 35px;
    font-weight: 400;
    position: absolute;
    z-index: 1;
    color: #fff;
    font-family: Verdana, sans-serif;
    text-align: center;
    font-size: 11px;
}
.loading-bar {
    height: 5px;
    width: 85%;
    background-color: #ccc; /* Cor de fundo da barra (cinza claro, por exemplo) */
    position: relative;
    bottom: 0;
    overflow: hidden;
}

.sorteio-loading-bar-fill {
    height: 100%;
    width: 100%; 
    transition: width 0.5s ease; 
    position: absolute;
    bottom: 0;
    left: 0;
    --progress: 100%; /* Define o valor inicial de --progress para 100% (barra totalmente preta) */
}

.sorteio-loading-bar-fill::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #000; /* Cor de fundo inicial preta */
    background: linear-gradient(to right, 
        #000 0%,      
        #008000 20%,    
        #ffff00 40%,    
        #ffa500 60%,   
        #ff0000 80%);   

    clip-path: inset(0 var(--progress) 0 0); 
}
 
#streamersBox {
    width: 178px;
    height: 195px;
    margin: auto;
}

#SorteioBox {
    width: 178px;
    height: 195px;
    margin: auto;
}

#TrailerIdleFrame {
    position: absolute;
    top: 31px;
    left: 5px
}

#TrailerOverFrame {
    position: absolute;
    top: 31px;
    left: 5px;
    visibility: hidden;
    cursor: pointer
}

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

.Themeboxes #ScreenshotBox #ScreenshotContentImageContainer {
    position: absolute;
    top: 35px;
    left: 5px;
    overflow: hidden;
    width: 170px;
    height: 102px
}

.Themeboxes #ScreenshotBox #ScreenshotContentImage {
    position: absolute;
    width: 480px;
    height: 352px;
    left: -155px;
    top: -120px
}

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

.Themeboxes #FansiteBox {
    position: relative;
    height: 188px;
    text-align: center
}

.Themeboxes #FansiteLogoFrame {
    position: relative;
    top: 31px;
    width: 180;
    height: 145px
}

.Themeboxes #FansiteLogo {
    position: relative;
    height: 100px;
    width: 150px;
    top: 8px;
    border: 0;
    cursor: pointer
}

.Themeboxes #FansiteBox .ThemeboxButton {
    bottom: 19px
}

.Themeboxes #NetworksBox {
    position: relative;
    height: 204px
}

.Themeboxes #NetworksBox #FacebookBlock {
    position: relative;
    top: 32px;
    height: 113px
}

.Themeboxes #NetworksBox #FacebookPageLink {
    position: absolute;
    left: 37px;
    top: 12px;
    height: 50px;
    width: 50px
}

.Themeboxes #NetworksBox #FacebookLikeButton {
    position: absolute;
    left: 92px;
    top: 40px
}

.Themeboxes #NetworksBox #FacebookShareButton {
    position: absolute;
    left: 92px;
    top: 14px
}

.Themeboxes #NetworksBox #FacebookLikes {
    position: relative;
    top: 75px;
    width: 145px;
    height: 50px;
    left: 18px;
    overflow: hidden
}

.Themeboxes #NetworksBox #FacebookLikes div {
    position: relative;
    height: 50px;
    left: -106px
}

.Themeboxes #NetworksBox #FacebookLikes div iframe {
    height: 50px!important
}

.Themeboxes #NetworksBox #TwitterBlock {
    position: relative;
    top: 47px;
    text-align: center
}

.Themeboxes #CMTrackerBox {
    position: relative;
    height: 204px
}

.Themeboxes #CMTrackerBox #CMTrackerContent {
    position: relative;
    top: 45px;
    height: 135px;
    padding-left: 20px;
    padding-right: 20px;
    font-size: 8px
}

.Themeboxes #CMTrackerBox #CMTrackerContent div {
    font-family: Verdana,Arial,Times New Roman,sans-serif;
    font-size: 8pt;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 140px
}

.Themeboxes #CMTrackerBox #CMTrackerContent .CMTrackerPostArrow {
    width: 10px;
    height: 9px;
    margin-right: 2px
}

.Themeboxes #CMTrackerBox #CMTrackerContent .CMTrackerTitle {
    margin-bottom: 2px
}

.Themeboxes #CMTrackerBox #CMTrackerContent .CMTrackerMoreLink {
    position: absolute;
    bottom: 0;
    text-align: right
}

.Themeboxes #TournamentBox {
    height: 225px
}

.Themeboxes #TournamentBox #TournamentBoxContent {
    position: relative;
    top: 50px;
    color: #5a2800;
    font-family: Verdana,Arial,Times New Roman,sans-serif;
    text-align: center
}

.Themeboxes #TournamentBox #TournamentBoxContent .TournamentBoxContentName {
    font-weight: 700;
    font-size: 9pt;
    margin-bottom: 10px
}

.Themeboxes #TournamentBox #TournamentBoxContent .TournamentBoxContentHeadline {
    font-weight: 700;
    font-size: 9pt
}

.Themeboxes #TournamentBox #TournamentBoxContent .TournamentBoxContentDateTime {
    font-size: 8pt;
    margin-left: 20px;
    margin-right: 20px;
    margin-bottom: 10px
}


#PremiumBoxContainer {
    position: relative;
    height: 204px
}

#PremiumBox {
    position: relative;
    height: 195px;
    background-repeat: no-repeat;
}

#PremiumBoxDecor {
    margin: 0;
    position: absolute;
    top: -28px;
    left: 5px;
    width: 64px;
    height: 64px;
    z-index: 2;
}

#PremiumBoxBg {
    display: flex;
    margin: 0;
    position: relative;
    top: -13px;
    left: -1px;
    justify-content: center;
}

#PremiumBoxBg img {
    width: 162px;
    height: 112px;
}

#PremiumBoxOverlay {
    margin: 0;
    position: absolute;
    top: 29px;
    left: 8px;
    width: 163px;
    height: 26px;
}

#PremiumBoxOverlayText {
    color: #fff;
    font-family: Verdana,sans-serif;
    margin-top: 3px;
    text-align: center;
    font-size: 11px;

    z-index: 1;
    position: relative;
    text-shadow: -1px -1px 0 #000, 0 -1px 0 #000, 1px -1px 0 #000, 1px 0 0 #000, 1px 1px 0 #000, 0 1px 0 #000, -1px 1px 0 #000, -1px 0 0 #000;
}

#PremiumBoxButtonDecor {
    position: absolute;
    width: 114px;
    height: 26px;
    left: 13px;
    bottom: -13px;
    z-index: 25;
}

#PremiumBoxButton {
  position: absolute;
  bottom: 43px;
  left: 18px;
  text-align: center;
}
#NetworksBox {
  background-image:url(../images/themeboxes/networks/networksbox4.png);     
  height: 192px;
}

.WebshopButton {
    position: absolute;
    width: 142px;
    height: 34px;
    z-index: 10;
    background-size: 142px 34px;
    background-repeat: no-repeat;
    background-image: url(../images/themeboxes/premium/button.png);
}
.WebshopButton:hover {
  background-image: url(../images/themeboxes/premium/button_hover.png);
}

.WebshopButton a {
  color: white;
  text-decoration: none;
}

.ThemeboxesHeader {
    background-size: 179px;
    background-repeat: no-repeat;
    z-index: 8;
    width: 100%;
    height: 33px;
    top: -3px;
    position: relative;
    z-index: 1;
}

.openingText {
    position: relative;
    top: 8px;
    color: wheat;
}

.WebshopButtonTC {
    position: absolute;
    width: 142px;
    height: 49px;
    z-index: 10;
    top: -11px;
    background-size: 142px 50px;
    background-repeat: no-repeat;
    background-image: url(../images/themeboxes/premium/button_tc.png);
}
.WebshopButtonTC:hover {
  background-image: url(../images/themeboxes/premium/button_hover_tc.png);
}

.WebshopButtonTC a {
  color: white;
  text-decoration: none;
}
.WebshopButtonDivs {
    width: 100%; display: flex; justify-content: center;top: 22px;gap: 10px; position: relative;
}
.WebshopButtonTRADE {
    position: relative;
    width: 70px;
    height: 34px;
    z-index: 10;
    top: -11px;
    background-size: 70px 34px;
    background-repeat: no-repeat;
    background-image: url(../images/themeboxes/premium/button.png);
}
.WebshopButtonTRADE:hover {
  background-image: url(../images/themeboxes/premium/button_hover.png);
}

.WebshopButtonTRADE a {
  color: white;
  text-decoration: none;
}

.WebshopButtonOver {
    position: absolute;
    top: 0px;
    left: 0;
    width: 142px;
    height: 34px;
    visibility: hidden;
    z-index: 15;
    vertical-align: middle
}

.WebshopButtonText {
  position: relative;
  top: 4px;
  z-index: 20;
  font-family: fantasy;
}

.WebshopButtonText a {
  color: white;
  text-decoration: none;
  text-shadow: 0px 1px 5px black;
}

.MediumButtonOver {
    position: relative;
    top: 0;
    left: 0;
    width: 150px;
    height: 37px;
    visibility: hidden;
    z-index: 15
}

/** -------------------------------
 *  OLD Stylesheet declarations for
 *  the CONTENT AREA
 *  -------------------------------
 */

.Content .BoxContent td .white {
  color: #EFEFEF;
  visibility: visible;
}
.Content .BoxContent td .whites {
  color: #EFEFEF;
  visibility: visible;
  font-size: 9pt;
}
.Content .BoxContent .white {
  color : #EFEFEF;
  visibility : visible;
}
.white {
  margin: auto;
  color : #EFEFEF !important;
}
.Content .BoxContent td .green {
  color : #00BF00;
}
.green {
  margin: auto;
  color : darkgreen !important;
}
.Content .BoxContent td .yellow {
  color : #FFBB05;
}
.yellow {
  margin: auto;
  color : #FFBB05 !important;
}
.Content .BoxContent td .red {
  color : #EF0000;
}
.red {
  margin: auto;
  color : #EF0000 !important;
}
.Content .BoxContent td .grey {
  color : #808080;
}
.grey {
  margin: auto;
  color : #808080 !important;
}

.TableContainer .Table3 .TableContent td {
    border: 1px solid #faf0d7;
}

.greenNeon {
    color: seagreen;
    text-shadow: -1px -1px 0 #6bff00, 0 -1px 0 #8fff00, 1px -1px 0 #4cff00, 1px 0 0 #5fff00, 1px 1px 0 #73ff00, 0 1px 0 #6cff00, -1px 1px 0 #4fff00, -1px 0 0 #b3ff00;
}
/* TABLE CONTENT */
.TableContentContainer {
	border: 1px solid #5f4d41;
	position: relative;
	margin-right: 7px;
	margin-bottom: 5px;
	height: 100%;
	background-color: #d4c0a1;
	padding: 0;
}

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

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

/* INNERLYOUT 1 */
.TableContainer .Table1 {
	width: 100%;
	background-color: #d4c0a1;
	border: 2px solid #55636c;
}

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

.InnerTableContainer .TableContentContainer {
	box-shadow: 3px 3px 2px #875f3e;
}

/* INNERLYOUT 2 */
.TableContainer .Table2 {
	width: 100%;
	border: 2px solid #55636c;
	background-color: #f1e0c5;
	padding: 0px;
	margin: 0px;
	border-collapse: collapse;
}

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

.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;
}

/* INNERLYOUT 3 */
.TableContainer .Table3 {
	width: 100%;
	border: 2px solid #55636c;
	background-color: #f1e0c5;
}

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

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

/* INNERLYOUT 4 */
.TableContainer .Table4 {
	width: 100%;
	border: 2px solid #55636c;
	background-color: #f1e0c5;
}

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

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

/* INNERLYOUT 5 */
.TableContainer .Table5 {
	width: 100%;
	border: 2px solid #55636c;
	background-color: #f1e0c5;
}

.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;
}

/* SHADOWS */
.TableShadowContainerRightTop {
	position: relative;
	top: 0px;
	right: 3px;
	margin-right: 0px;
	font-size: 1px;
	float: right;
	z-index: 99;
}

.TableShadowRightTop {
	position: absolute;
	top: 0px;
	right: 0px;
	width: 4px;
	height: 5px;
	z-index: 99;
}

.TableContentAndRightShadow {
	position: relative;
	background-repeat: repeat-y;
	background-position: top right;
	margin-right: 3px;
	margin-left: 3px;
	font-size: 1px;
}

.TableShadowContainer {
	position: relative;
	widht: 100%;
	margin-right: 5px;
}

.TableBottomShadow {
	position: relative;
	font-size: 1px;
	height: 5px;
	width: 99%;
	padding: 0px;
	margin-left: 6px;
}

.TableBottomLeftShadow {
	position: relative;
	height: 5px;
	width: 4px;
	float: left;
	padding: 0px;
	margin: 0px;
}

.TableBottomRightShadow {
	position: relative;
	float: right;
	right: -2px;
	top: 0px;
	height: 5px;
	width: 4px;
}
/** -------------------------------
 *  OLD Stylesheet declarations for
 *  the CONTENT AREA (forum)
 *  -------------------------------
 */

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

.Content .ff_white a {
  color: #FFFFFF;
}

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

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

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

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

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

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

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

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

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

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

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

/** --------------------------------------
 *  ### not final versions for tests
 *  ### concerning the new payment process
 *  --------------------------------------
 */

/* new error handling concept tests */

.FormFieldError {
  font-size: 8pt;
  color: red;
}
.SmallBox {
  position: relative;
  font-size: 1px;
}
.SmallBox .ErrorMessage {
  font-size: 8pt;
  position: relative;
  color: red;
  height: 100%;
  background-color: #d4c0a1;
  padding: 5px;
  padding-left: 43px;
}
.SmallBox .Message {
  font-size: 10pt;
  position: relative;
  height: 100%;
  background-color: #d4c0a1;
  padding: 10px;
}
.SmallBox .ErrorMessage ul {
  padding-left: 15px;
}
.SmallBox .BoxFrameHorizontal {
  position: relative;
  height: 4px;
}
.SmallBox .BoxFrameVerticalRight {
  position: absolute;
  right: 0px;
  top: 0px;
  width: 3px;
  background-repeat: repeat-y;
  height: 100%;
}
.SmallBox .BoxFrameVerticalLeft {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 3px;
  background-repeat: repeat-y;
  height: 100%;
}
.SmallBox .MessageContainer {
  position: relative;
  height: 100%;
}
.SmallBox .BoxFrameEdgeLeftTop {
  position: absolute;
  left: -1px;
  top: -1px;
  width: 5px;
  height: 5px;
}
.SmallBox .BoxFrameEdgeLeftBottom {
  position: absolute;
  left: -1px;
  bottom: -1px;
  width: 5px;
  height: 5px;
}
.SmallBox .BoxFrameEdgeRightTop {
  position: absolute;
  right: -1px;
  top: -1px;
  width: 5px;
  height: 5px;
}
.SmallBox .BoxFrameEdgeRightBottom {
  position: absolute;
  right: -1px;
  bottom: -1px;
  width: 5px;
  height: 5px;
}
.SmallBox .AttentionSign {
  position: absolute;
  top: 3px;
  left: 8px;
  width: 30px;
  height: 26px;
}


/** ---------------------------------
 *  ### not finished versions for the
 *  ### payment process PROGRESS BAR
 *  ---------------------------------
 */

#ProgressBar #Headline {
  text-align: center;
  font-size: 12pt;
  font-weight: bold;
  margin-bottom: 5px;
}
#ProgressBar #MainContainer {
  position: relative;
  top: 10px;
  height: 50px;
  margin-bottom: 25px;
}
#ProgressBar #BackgroundContainer {
  position: relative;
  width: 100%;
}

#ProgressBar #BackgroundContainerLeftEnd {
  position: absolute;
  float: left;
}
#ProgressBar #BackgroundContainerCenter {
  position: absolute;
  left: 0px;
  top: 0px;
  height: 17px;
  width: 100%;
}
#ProgressBar #BackgroundContainerCenterImage {
  position: relative;
  margin-left: 25px;
  margin-right: 25px;
  height: 17px;
}
#ProgressBar #BackgroundContainerRightEnd {
  position: absolute;
  right: 0px;
  top: 0px;
  float: right;
}
#ProgressBar #TubeLeftEnd {
  position: absolute;
  left: 25px;
  top: 4px;
}
#ProgressBar #TubeRightEnd {
  position: absolute;
  right: 25px;
  top: 4px;
  z-index: 0;
}
#ProgressBar .Steps {
  position: relative;
  height: 39px;
  font-size: 9px;
  float: left;
  top: -11px;
  margin-left: -1px;
}
#ProgressBar #StepsContainer1 {
  text-align: right;
  margin-left: 92px;
  margin-right: 40px;
  height: 10px;
}
#ProgressBar #StepsContainer2 {
  width: 100%;
  height: 10px;
}
#ProgressBar .TubeContainer {
  position: relative;
  padding-right: 47px;
}
#ProgressBar .Tube {
  position: relative;
  top: 16px;
  left: 0px;
  width: 100%;
  height: 7px;
  background: #FFFFFF none repeat scroll 0%;
}
* html #ProgressBar .Tube {
  top: 13px;
}
#ProgressBar .SingleStepContainer {
  position: absolute;
  top: 0px;
  width: 47px;
  height: 30px;
  right: 0px;
  text-align: center;
}
#ProgressBar #FirstStep .SingleStepContainer {
  left: 45px;
  width: 47px;
  position: absolute;
}
#ProgressBar .StepIcon {
  position: absolute;
  right: 0px;
}
* html #ProgressBar .StepIcon {
  right: -1px;
}
#ProgressBar #FirstStep .StepIcon {
  top: 0px;
  left: 0px;
}
#ProgressBar .StepText {
  top: 40px;
  position: absolute;
  width: 200px;
  right: -77px;
}


/** -------------------------------
 *  Stylesheet declarations for the
 *  NEW TABLES
 *  -------------------------------
 */

.TableContainer {
  border: 1px solid black;
  position: relative;
  width: 100%;
  font-size: 1px;
}
.TableContainer .Odd {
  background-color: #f1e0c6;
}
.TableContainer .Even {
  background-color: #d5c0a1;
}
.CreateAccountFormInput, .ChangePasswordFormInput, .SetPasswordFormInput {
  width: 206px;
  /*float: left;*/
}
.passwordStrength {
    width: 200px;
    background-color: #ec644b; 
    color: white;    
    text-align: center;  
    position: absolute;  
    top: 55px;  
    right: 20px;  
    height: 18px;
}
/* TABLEHEADER DECORATION */
.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: #5f4d41;
  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 .CaptionContainer .CaptionEdgeLeftTop {
  position: absolute;
  width: 5px;
  height: 5px;
  top: -2px;
  left: -2px;
  z-index: 1;
}
.TableContainer .CaptionContainer .CaptionEdgeRightTop {
  position: absolute;
  width: 5px;
  height: 5px;
  top: -2px;
  right: -2px;
  z-index: 1;
}
.TableContainer .CaptionContainer .CaptionEdgeLeftBottom {
  position: absolute;
  width: 5px;
  height: 5px;
  left: -2px;
  bottom: -3px;
  z-index: 1;
}
.TableContainer .CaptionContainer .CaptionEdgeRightBottom {
  position: absolute;
  width: 5px;
  height: 5px;
  right: -2px;
  bottom: -3px;
  z-index: 1;
}
.TableContainer .CaptionContainer .CaptionBorderTop {
  position: absolute;
  width: 100%;
  height: 4px;
  left: 0px;
  top: -1px;
}
.TableContainer .CaptionContainer .CaptionBorderBottom {
  position: absolute;
  width: 100%;
  height: 4px;
  left: 0px;
  bottom: -2px;
}
.TableContainer .CaptionContainer .CaptionVerticalLeft {
  position: absolute;
  height: 100%;
  width: 3px;
  left: -1px;
  top: 0px;
}
.TableContainer .CaptionContainer .CaptionVerticalRight {
  position: absolute;
  height: 100%;
  width: 3px;
  right: -1px;
  top: 0px;
}
* html .TableContainer .CaptionContainer .CaptionEdgeRightTop {
  right: -3px;
}
* html .TableContainer .CaptionContainer .CaptionEdgeLeftBottom {
  bottom: -4px;
}
* html .TableContainer .CaptionContainer .CaptionEdgeRightBottom {
  right: -3px;
  bottom: -4px;
}
* html .TableContainer .CaptionContainer .CaptionBorderBottom {
  bottom: -3;
}
* html .TableContainer .CaptionContainer .CaptionVerticalRight {
  right: -2px;
}
/* ====== Vari�veis de cores ====== */
:root {
    --light-bg: #f9f9f9;         /* fundo principal */
    --dark-bg: #333333;          /* texto e bordas escuras */
    --accent-bg: #e0d8c6;        /* boxes e itens */
    --highlight-bg: #555555;     /* cabe�alhos de boxes e linhas de destaque */
    --text-color: #333333;       /* texto principal */
    --subtext-color: #555555;    /* texto secund�rio / detalhes */
    --tooltip-bg: rgba(0,0,0,0.92);
    --tooltip-title: #333333;
}

/* ====== Base Look Adaptado ====== */
body {
    background: var(--light-bg);
    color: var(--text-color);
    font-family: Arial, sans-serif;
}

.tibia-wrapper {
    max-width: 100%;
    width: 96%;
    margin: 20px auto;
    background: var(--accent-bg);
    border: 2px solid var(--dark-bg);
    box-shadow: 0 0 8px rgba(0,0,0,0.25);
    overflow-x: auto;
}

.tibia-header {
    background: linear-gradient(var(--dark-bg), var(--highlight-bg));
    padding: 14px 18px;
    border-bottom: 2px solid var(--dark-bg);
    color: white;
    font-size: 22px;
    font-weight: bold;
    text-align: center;
    text-shadow: 0 1px 0 #000;
}

.tibia-subtitle {
    color: white;
    font-size: 13px;
    margin-top: 6px;
    font-style: italic;
}

.tibia-content {
    padding: 16px;
    background: var(--accent-bg);
    color: var(--text-color);
}

/* ====== Boxes ====== */
.tibia-box {
    border: 1px solid var(--dark-bg);
    margin-bottom: 16px;
    background: var(--accent-bg);
    max-width: 100%;
}

.tibia-title {
    background: linear-gradient(var(--dark-bg), var(--highlight-bg));
    color: white;
    padding: 8px 12px;
    font-weight: bold;
    border-bottom: 1px solid var(--dark-bg);
    text-shadow: 0 1px 0 #000;
}

.tibia-body {
    background: var(--accent-bg);
}

/* ====== Grids ====== */
.tibia-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
}

.top-items {
    display: grid;
    grid-template-columns: repeat(5, minmax(120px, 1fr));
    gap: 10px;
}

.top-item {
    background: var(--accent-bg);
    border: 1px solid var(--dark-bg);
    padding: 8px;
    text-align: center;
}

.top-item img {
    width: 46px;
    height: 46px;
    display: block;
    margin: 0 auto 6px;
    background: var(--accent-bg);
    border: 1px solid var(--highlight-bg);
}

.top-item a {
    color: var(--text-color);
    text-decoration: none;
    font-weight: bold;
}

.top-item a:hover { text-decoration: underline; }

.top-item .count {
    font-size: 12px;
    color: var(--highlight-bg);
    margin-top: 2px;
}

.top-players {
    display: grid;
    grid-template-columns: repeat(3, minmax(160px, 1fr));
    gap: 10px;
}

.top-player {
    background: var(--accent-bg);
    border: 1px solid var(--dark-bg);
    padding: 10px;
    text-align: center;
}

.top-player img {
    width: 64px;
    height: 64px;
    border: 1px solid var(--highlight-bg);
    background: var(--accent-bg);
}

.top-player a {
    color: var(--text-color);
    font-weight: bold;
    text-decoration: none;
}

.top-player a:hover { text-decoration: underline; }

.top-player .count {
    font-size: 12px;
    color: var(--highlight-bg);
    margin-top: 3px;
}

/* ====== Inputs / Forms ====== */
.tibia-input, .tibia-select {
    border: 1px solid var(--highlight-bg);
    padding: 6px 8px;
    background: var(--accent-bg);
    color: var(--text-color);
}

/* ====== Resultados / Tabelas ====== */
.tibia-table {
    border: 1px solid var(--dark-bg);
    background: var(--accent-bg);
}

.tibia-row {
    display: grid;
    grid-template-columns: 60px 100px 1.4fr 1.4fr 1.2fr 100px;
    gap: 8px;
    padding: 8px;
    border-bottom: 1px solid var(--highlight-bg);
    align-items: center;
}

.tibia-row.is-today { background: var(--highlight-bg); border-left: 4px solid var(--dark-bg); }

.tibia-head {
    background: linear-gradient(var(--dark-bg), var(--highlight-bg));
    color: white;
    text-shadow: 0 1px 0 #000;
    display: grid;
    grid-template-columns: 60px 100px 1.4fr 1.4fr 1.2fr 100px;
    gap: 8px;
    padding: 8px;
    border-bottom: 2px solid var(--dark-bg);
    font-weight: bold;
}

.tibia-cell { font-size: 14px; color: var(--text-color); }
.tibia-rank span {
    display: inline-block;
    min-width: 44px;
    text-align: center;
    background: var(--highlight-bg);
    color: var(--accent-bg);
    padding: 3px 6px;
    border: 1px solid var(--dark-bg);
}

.world-badge {
    background: var(--accent-bg);
    border: 1px solid var(--dark-bg);
    padding: 2px 6px;
    font-weight: bold;
}

/* ====== Bot�es ====== */
.tibia-btn {
    background: linear-gradient(var(--dark-bg), var(--highlight-bg));
    border: 1px solid var(--dark-bg);
    color: var(--accent-bg) !important;
}

.tibia-btn:hover {
    background: linear-gradient(var(--highlight-bg), var(--dark-bg));
    color: var(--accent-bg) !important;
}
/* LABELS */
.LabelV {
  font-weight: bold;
  padding-right: 10px;
  white-space: nowrap;
  vertical-align: top;
}
.LabelH {
  font-weight: bold;
  padding-right: 10px;
  white-space: nowrap;
  background-color: #d5c0a1;

}
.LabelH td {
  background-color: #d5c0a1;
  padding-left: 5px;
  padding-top: 2px;
  padding-right: 5px;
  padding-bottom: 2px;
}

/* BUTTONS */
.InnerTableButtonRow {
  width: 100%;
  padding-left: 1px;
  padding-right: 0px;
  padding-bottom: 4px;
  border: 0px;
}
.InnerTableButtonRow td {
  padding-right: 4px;
}
.BigButtonNoImage {
  display: inline-block;
  margin: auto;
  top: -1px;
  background-color: #2f2fe2;
  border-radius: 8px;
  width: 60px;
  text-align: center; 
}
.BigButtonNoImage:hover {
  background-color: #0000ff;
}

.BigButton {
  position: relative;
  width: 135px;
  height: 25px;
  cursor: pointer;
  z-index: 10;
  background-image:url(../images/buttons/sbutton.gif);
}
.BigButton:hover {
  background-image:url(../images/buttons/sbutton_over.gif);
}
.BigButtonGrey {
  position: relative;
  width: 135px;
  height: 25px;
  cursor: pointer;
  z-index: 10;
  background-image:url(../images/buttons/sbutton_grey.png);
}
.BigButtonGrey:hover {
  background-image:url(../images/buttons/sbutton_grey_over.png);
}

.carousel-control-prev-icon-new {
  position: relative;
  width: 32px;
  height: 32px;
  cursor: pointer;
  background-image:url(../images/themeboxes/videos/arrow_left.png);
  background-repeat: no-repeat;
  background-size: 32px 32px;
}
.carousel-control-prev-icon-new:hover {
  background-image:url(../images/themeboxes/videos/arrow_left_hover.png);
  background-repeat: no-repeat;
  background-size: 32px 32px;
  width: 32px;height: 32px;
}
.carousel-control-next-icon-new {
  position: relative;
  width: 32px;
  height: 32px;
  cursor: pointer;
  background-image:url(../images/themeboxes/videos/arrow_right.png);
  background-repeat: no-repeat;
  background-size: 32px 32px;
}
.carousel-control-next-icon-new:hover {
  background-image:url(../images/themeboxes/videos/arrow_right_hover.png);
  background-repeat: no-repeat;
  background-size: 32px 32px;
  width: 32px;height: 32px;
}

.carousel-control-prev {
  height: 50px;
  width: 4%;
  position: absolute;
  opacity: 1;
  left: 0px;
  margin-top: 50%;
}
.carousel-control-next {
  height: 50px;
  width: 4%;
  position: absolute;
  opacity: 1;
  right: 0px;
  margin-top: 50%;
}



.carousel-control-prev-icon-videos {
  position: relative;
  width: 20px;
  height: 20px;
  cursor: pointer;
  background-image:url(../images/themeboxes/videos/arrow_left.png);
  background-repeat: no-repeat;
  background-size: 20px 20px;
}
.carousel-control-prev-icon-videos:hover {
  background-image:url(../images/themeboxes/videos/arrow_left_hover.png);
  background-repeat: no-repeat;
  background-size: 20px 20px;
  width: 20px;height: 20px;
}
.carousel-control-next-icon-videos {
  position: relative;
  width: 20px;
  height: 20px;
  cursor: pointer;
  background-image:url(../images/themeboxes/videos/arrow_right.png);
  background-repeat: no-repeat;
  background-size: 20px 20px;
}
.carousel-control-next-icon-videos:hover {
  background-image:url(../images/themeboxes/videos/arrow_right_hover.png);
  background-repeat: no-repeat;
  background-size: 20px 20px;
  width: 20px;height: 20px;
}


.carousel-indicators li {
    top: 20px;
}

.BigButtonRed {
  position: relative;
  width: 135px;
  height: 25px;
  cursor: pointer;
  z-index: 10;
  background-image:url(../images/buttons/button_red.gif);
}
.BigButtonRed:hover {
  background-image:url(../images/buttons/button_red_over.gif);
}
.BigButtonGreen {
  position: relative;
  width: 135px;
  height: 25px;
  cursor: pointer;
  z-index: 10;
  background-image:url(../images/buttons/button_green.gif);
}
.BigButtonGreen:hover {
  background-image:url(../images/buttons/button_green_over.gif);
}

.ButtonText {
    position: absolute;
    top: 0;
    left: 0;
    height: 25px;
    width: 135px;
    z-index: 20
}

.BigButtonText {
    position: absolute;
    top: 0;
    left: 0;
    width: 135px;
    height: 25px;
    margin: 0;
    padding: 0;
    cursor: pointer;
    background: 0 0;
    border: none;
    text-align: center;
    color: #ffd18c;
    font-family: Verdana,Arial,Times New Roman,sans-serif;
    font-size: 12px;
    font-weight: 400;
    z-index: 20;
    text-shadow: -1px -1px 0 #000,0 -1px 0 #000,1px -1px 0 #000,1px 0 0 #000,1px 1px 0 #000,0 1px 0 #000,-1px 1px 0 #000,-1px 0 0 #000
}

.HeaderPagesText {
    position: absolute;
    top: 0;
    left: 13px;
    margin: 0;
    padding: 0;
    color: #E8DC33; /* dourado */
    font-family: 'Metal Mania', cursive;
    font-size: 22px;
  
    z-index: 20;

    /* contorno preto em volta */
    text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, 
                 -1px 1px 0 #000, 1px 1px 0 #000, 
                 0 -1px 0 #000, 0 1px 0 #000, 
                 -1px 0 0 #000, 1px 0 0 #000;
}

.stylishText {
    background: 0 0;
    border: none;
    text-align: center;
    color: #ffd18c;
    font-family: Verdana,Arial,Times New Roman,sans-serif;
    font-size: 12px;
    font-weight: 400;
    text-shadow: -1px -1px 0 #000,0 -1px 0 #000,1px -1px 0 #000,1px 0 0 #000,1px 1px 0 #000,0 1px 0 #000,-1px 1px 0 #000,-1px 0 0 #000
}

.stylishText { /* Classe para o elemento que contém o texto "Próximo Sorteio" */
  animation: glowText 1s ease-in-out infinite alternate;
}

@keyframes glowText {
  from {
    text-shadow: 0 0 10px #ffd700; /* Cor de brilho (amarelo dourado) */
  }
  to {
    text-shadow: 0 0 20px #ffd700; 
  }
}

.drawText {
    text-shadow: -1px -1px 0 #000,0 -1px 0 #000,1px -1px 0 #000,1px 0 0 #000,1px 1px 0 #000,0 1px 0 #000,-1px 1px 0 #000,-1px 0 0 #000;     
    transition: color 0.5s ease; 
    transform: translateZ(0); 
    backface-visibility: hidden; /* Otimiza a renderização */
}
.acumulatedCodes {
    margin-top: 10px; margin-bottom: 10px; text-align: center;
    text-shadow: -1px -1px 0 #000, 0 -1px 0 #000, 1px -1px 0 #000, 1px 0 0 #000, 1px 1px 0 #000, 0 1px 0 #000, -1px 1px 0 #000, -1px 0 0 #000;
}

.pulsateText {
    text-shadow: -1px -1px 0 #000,0 -1px 0 #000,1px -1px 0 #000,1px 0 0 #000,1px 1px 0 #000,0 1px 0 #000,-1px 1px 0 #000,-1px 0 0 #000;
    animation: pulsateScale 1s ease-in-out infinite;
    transform-origin: center;
}

@keyframes pulsateScale {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.1) translateY(-5%); /* Aumenta a escala e ajusta a posição vertical */
  }
  100% {
    transform: scale(1);
  }
}

.icone-presente { /* Classe para o ícone de presente */
  animation: swing 2s ease-in-out infinite;
}

@keyframes swing {
  0% {
    transform: rotate(-5deg);
  }
  50% {
    transform: rotate(5deg);
  }
  100% {
    transform: rotate(-5deg);
  }
}

.BigButtonTextLink {
  font-weight: 400 !important;
  color: #ffd18c !important;
  position: absolute;
  top: 0;
  left: 0;
  width: 135px;
  height: 25px;
  margin: 0;
  padding: 0;
  border: none;
  text-align: center;
  font-family: Verdana,Arial,Times New Roman,sans-serif;
  font-size: 12px;
  z-index: 20;
  text-shadow: -1px -1px 0 #000,0 -1px 0 #000,1px -1px 0 #000,1px 0 0 #000,1px 1px 0 #000,0 1px 0 #000,-1px 1px 0 #000,-1px 0 0 #000; 
  text-decoration: none;
  cursor: pointer; 
  background: none;
}
.BigButtonTextLink:hover {
  font-weight: 400;
  color: #ffd18c;
  text-decoration: none;
}
/*
span.BigButtonText,a.BigButtonText {
  margin-top: 5px
}
.BigButtonText:hover {
  top: 1px;
  left: 1px
}
*/
a.BigButtonText,a.BigButtonText:link,a.BigButtonText:visited,a.BigButtonText:focus,a.BigButtonText:active,a.BigButtonText:hover {
  font-weight: 400;
  color: #ffd18c;
  text-decoration: none;
}

.SubmitButtonRow {
  position: relative;
  margin-top: 25px;
  margin-bottom: 25px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-evenly;
}
.SubmitButtonRow .LeftButton, .SubmitButtonRow .CenterButton, .SubmitButtonRow .RightButton {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 5px;
    text-align: center;
}
.SubmitButtonRow .LeftButton,.SubmitButtonRow .CenterButton,.SubmitButtonRow .RightButton {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 5px;
    text-align: center
}

.TopButtonContainer {
  position: relative;
  right: 4px;
  top: 4px;
  z-index: 60;
}
* html .TopButtonContainer {
  right: 27px;
}
.TopButtonContainer .TopButton {
  position: absolute;
  right: 0px;
  z-index: 55;
}
.Content .BoxContent .Odd {
  background-color: #f1e0c6;
  padding: 2px;
}

.Content .BoxContent .Even {
  background-color: #d5c0a1;
  padding: 2px;
}

.Content .NewsCategoryIconSmall {
  position: absolute;
  top: 1px;
  left: 1px;
  height: 16px;
  width: 16px;
  background-repeat: no-repeat;
}

/* News Ticker */

.Content #NewsTicker .BoxContent {
  padding: 5px;
  min-height: 90px;
  height: auto !important;
  height: 100px;
}

.Content #NewsTicker .BoxContent .Row {
  position: relative;
  width: 100%;
}

.Content #NewsTicker .NewsTickerIcon {
  position: absolute;
  top: 1px;
  left: 1px;
  height: 16px;
  width: 16px;
  background-repeat: no-repeat;
}

.Content #NewsTicker .NewsTickerText {
  font-size: 9pt;
  position: relative;
  margin-left: 20px;
}
.Content #NewsTicker .NewsTickerShortText p {
    text-overflow: ellipsis;
    overflow: hidden;
}
.Content #NewsTicker .NewsTickerText p {
    font-weight: 400;
    margin: 0;
}
.Content #NewsTicker .NewsTickerDate {
    font-size: 7pt;
    position: absolute;
    top: 0px;
    float: left;
    font-weight: 400;
}
.Content #NewsTicker .NewsTickerTime {
    font-size: 9pt;
    position: absolute;
    top: 16px;
    display: none;
    float: left;
}
.Content #NewsTicker .NewsTickerTextContainer {
    margin-left: 90px;
    margin-right: 20px;
}
.Content #NewsTicker .NewsTickerShortText {
  display: table;
  table-layout: fixed;
  width: 100%;
  height: 16px;
  white-space: nowrap;
  min-width: 622px;/*custom*/
}

.Content #NewsTicker .NewsTickerFullText {
  min-height: 30px;
  display: none;
  min-width: 622px;/*custom*/
}

.Content #NewsTicker .NewsTickerExtend {
  position: relative;
  right: 0px;
  top: 1px;
  right: 1px;
  height: 12px;
  width: 12px;
  background-repeat: no-repeat;
  float: right;
  cursor: pointer;
  z-index: 10;
}

/* Featured Article */

.Content #FeaturedArticle .BoxContent {
  position:relative;
  height: 100px;
  padding: 5px;
  padding-left: 10px;
  min-height: 100px;
  height: auto !important;
  height: 110px;
  line-height: 10.5pt;
}

.Content #FeaturedArticle #TeaserThumbnail {
  position: relative;
  top: 0px;
  right: 0px;
  height: 100px;
  width: 150px;
  margin-left: 10px;
  background-color: black;
  z-index: 90;
  float: right;
}

#ContentHelper #FeaturedArticle:first-child .BoxContent {
  padding: 10px;
}

.Content #FeaturedArticle #TeaserText {
  height: 100px;
  margin-top: 5px;
  overflow: hidden;
  z-index: 0;
}

.Content #FeaturedArticle #Link {
  position: absolute;
  top: 0px;
  right: 0px;
  margin: 83 15 0 0;
  z-index: 99;
}

.Content #FeaturedArticle .NewsHeadlineBackground {
  position: relative;
  height: 28px;
  margin-bottom: 5px;
  background-repeat: repeat-x;
  border-left: 1px solid #000000;
  border-right: 1px solid #000000;
}

.Content #FeaturedArticle .NewsHeadlineIcon {
  position: absolute;
  top: -1px;
  left: 0px;
  margin-left: 5px;
  margin-right: 5px;
  float:left;
}

.Content #FeaturedArticle .NewsHeadlineDate {
  font-size: 7pt;
  position: absolute;
  top: 9px;
  left: 50px;
  width: 85px;
  color: white;
}

.Content #FeaturedArticle .NewsHeadlineText {
  position: relative;
  top: 8px;
  left: 135px;
  font-size: 10pt;
  font-weight: bold;
  color: white;
}

/* News */

.Content .BoxContent {
  min-height: 100px;
  height: auto !important;
  height: 110px;
}

.Content .NewsHeadlineBackground {
  position: relative;
  height: 28px;
  margin-bottom: 5px;
  background-repeat: repeat-x;
  border-left: 1px solid #000000;
  border-right: 1px solid #000000;
}

.Content .NewsHeadlineIcon {
  position: absolute;
  top: -1px;
  left: 0px;
  margin-left: 5px;
  margin-right: 5px;
  width: 32px;
}

.Content .NewsHeadlineDate {
  font-size: 7pt;
  position: absolute;
  top: 10px;
  left: 50px;
  width: 85px;
  color: white;
}

.Content .NewsHeadlineText {
  position: relative;
  top: 7px;
  left: 135px;
  font-size: 10pt;
  font-weight: bold;
  color: white;
  width: 350px;
}

/* News Archive */

.Content #NewsArchive .NewsHeadlineBackground {
  position: relative;
  height: 28px;
  margin-bottom: 5px;
  background-repeat: repeat-x;
  border-left: 1px solid #000000;
  border-right: 1px solid #000000;
}

.Content #NewsArchive .NewsHeadlineIcon {
  position: absolute;
  top: -1px;
  left: 0px;
  margin-left: 5px;
  margin-right: 5px;
}

.Content #NewsArchive .NewsHeadlineDate {
  font-size: 7pt;
  position: absolute;
  top: 9px;
  left: 50px;
  width: 85px;
  color: white;
}

.Content #NewsArchive .NewsHeadlineText {
  position: relative;
  top: 7px;
  left: 135px;
  font-size: 10pt;
  font-weight: bold;
  color: white;
}

/* customs  */

.radial-background{position:relative}
.radial-background::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%!important;
    background-image: url(../../../../layouts/newlayout/images/landing/section-wrapper-bg.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: bottom;
    z-index: -1;
}
 
/**/

.wizard-content .wizard .actions ul li a {
    color: #fff !important;
    background: #fc4a1a;
    background: -webkit-linear-gradient(to right, #f7b733, #fc4a1a);
    background: linear-gradient(to right, #f7b733, #fc4a1a);
    color: #fff;
    border: 3px solid #ff8600 !important;
    text-align: center;
    min-width: 100px;
}

.wizard-content .wizard .actions ul li a:hover, 
wizard-content .wizard .actions ul li a:focus {
    background: #fc4a1a !important;
    filter: drop-shadow(0 0 20px #fc4a1a) contrast(1) brightness(1);
    /* border: 3px solid #ff8600 !important; */
    text-align: center;
    min-width: 100px;
}

.cursor-pointer:hover {
    color: #ffb10a;
    filter: drop-shadow(0 0 20px #ffa300) contrast(2) brightness(4);
}

.btn-dark-success:hover {
    filter: drop-shadow(0 0 3px #2f6303);
    background-color: #1a3602 !important;
}

.btn-dark-primary:hover {
    color: #81caff !important;
    filter: drop-shadow(0 0 3px #3F51B5);
    background-color: #3F51B5 !important;
}

.btn-dark-danger:hover {
    filter: drop-shadow(0 0 3px #69240d);
    background-color: #862323e0 !important;
}

.#registerModal .modal {
    background-color: rgb(87 75 75 / 50%) !important;
    --bs-modal-bg: unset !important;
    --bs-modal-padding: 0 !important;
    --bs-modal-box-shadow: 0px 4px 21px rgb(128 100 255) !important;
}
.#loginModal .modal {
    background-color: rgb(87 75 75 / 50%) !important;
    --bs-modal-padding: 0 !important;
    --bs-modal-box-shadow: 0px 4px 21px rgb(128 100 255) !important;
}

.validationCustomInvalid {
    filter: drop-shadow(0 0 20px #dc3545) contrast(2) brightness(1);
    border-color: #dc3545;
    padding-right: calc(1.5em + 0.75rem);
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right calc(0.375em + 0.1875rem) center;
    background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
}
.validationCustomValid {
    filter: drop-shadow(0 0 20px #198754) contrast(2) brightness(1);
    border-color: #198754;
    padding-right: calc(1.5em + 0.75rem);
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23198754' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right calc(0.375em + 0.1875rem) center;
    background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
}

.grecaptcha-badge {
    z-index: 30;
}







/* form buttons  */
#regForm {
    background-color: #ffffff;
    margin: 0px auto;
    font-family: Raleway;
    padding: 40px;
    border-radius: 10px
}

.formTab {
    display: none
}
.formStep {
    height: 15px;
    width: 15px;
    margin: 0 2px;
    background-color: #bbbbbb;
    border: none;
    border-radius: 50%;
    display: inline-block;
    opacity: 0.5
}
.formStep.active {
    opacity: 1
}
.formStep.finish {
    background-color: #4CAF50
}

.all-steps {
    text-align: center;
    margin-top: 30px;
    margin-bottom: 30px
}

.thanks-message {
    display: none
}

/* Create a custom radio button */
.checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 25px;
    width: 25px;
    background-color: #eee;
    border-radius: 50%;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}


.btn-ultra-voilet {
    color: #fff !important;
    background: #654ea3;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #eaafc8, #654ea3);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #eaafc8, #654ea3); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    color: #fff;
    border: 3px solid #eee !important;
}

.btn-pink-moon {
    color: #fff !important;
    background: #ec008c;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #fc6767, #ec008c);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #fc6767, #ec008c); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    color: #fff;
    border: 3px solid #eee !important;
}

.btn-cool-blues {
    color: #fff !important;
    background: #2193b0;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #6dd5ed, #2193b0);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #6dd5ed, #2193b0); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    color: #fff;
    border: 3px solid #eee !important;
}

.btn-dark-blue {
    color: #fff !important;
    background: #7474BF;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #348AC7, #7474BF);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #348AC7, #7474BF); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    color: #fff;
    border: 3px solid #eee !important;
}

.btn-green-moon {
    color: #fff !important;
    background: #56ab2f;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #a8e063, #56ab2f);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #a8e063, #56ab2f); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    color: #fff;
    border: 3px solid #eee !important;
}

.btn-orange-moon {
    color: #fff !important;
    background: #fc4a1a;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #f7b733, #fc4a1a);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #f7b733, #fc4a1a); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    color: #fff;
    border: 3px solid #ff8600 !important;
}
.btn-orange-moon:hover {
  filter: drop-shadow(0 0 20px #fc4a1a) contrast(2) brightness(1);
  border: 3px solid #ff8600 !important;
}

.btn-dark-light {
  color: #fff !important;
  background: linear-gradient(to right, #090909b5, #47251aa3);
  border: 1px solid #90550c !important;
  width: 40px;
  height: 40px;
  border-radius: 8px;
}
.btn-dark-light:hover {
  background: linear-gradient(to right, #38230f, #a2300b);
  border: 1px solid #be6401 !important;
}

.btn-buy-now {
  background-image: url(../images/news/comprar_agora.png);
  background-size: 249px 56px;
  background-repeat: no-repeat;
  width: 249px;
  height: 56px;
  border: none;
}
.btn-buy-now:hover {
  transform: scale(1.1);
}


.btn-violet-moon {
    color: #fff !important;
    background: #831afc;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #e676ff, #831afc);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #e676ff, #831afc); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    border: 3px solid #c050f7 !important;
}
.btn-violet-moon:hover {
    filter: drop-shadow(0 0 20px #831afc) contrast(2) brightness(1);
    border: 3px solid #c050f7 !important;
}

.linkText {
  font-family: Verdana,Arial,Times New Roman,sans-serif;
  font-weight: 700;
  color: #004294;
  text-decoration: none;
  cursor: pointer;
  border: 0;
  padding: 0;
  background: none;
}
.linkText:hover {
  border: 0;
  padding: 0;
  font-family: Verdana,Arial,Times New Roman,sans-serif;
  font-weight: 700;
  text-decoration: underline;
  color: #0063dc;
  background: none;
}
.linkTextRed {
  font-family: Verdana,Arial,Times New Roman,sans-serif;
  font-weight: 700;
  color: red;
  text-decoration: none;
  cursor: pointer;
  border: 0;
  padding: 0;
  background: none;
}
.linkTextRed:hover {
  border: 0;
  padding: 0;
  font-family: Verdana,Arial,Times New Roman,sans-serif;
  font-weight: 700;
  text-decoration: underline;
  background: none;
}
.PageNavigation {
    padding-right: 10px;
    padding-bottom: 7px;
}

.DoNotBreak {
    white-space: nowrap;
}
.Width100Percent {
    width: 100%;
}
.TextCenter, .TextCenter td {
    text-align: center;
}
a .rounded-circle:hover {
    /*filter: drop-shadow(0 0 20px #831afc) contrast(1) brightness(1);*/
    filter: drop-shadow(0 0 20px #0067ff) contrast(1) brightness(1);    
}
a .img-fluid:hover {
    filter: drop-shadow(0 0 20px #831afc) contrast(1) brightness(1);
    
}
a .img-cover:hover {
    filter: drop-shadow(0 0 20px #831afc) contrast(1) brightness(1);
    
}

.btn-purple-moon {
    color: #fff !important;
    background: #3c09d0;
    background: -webkit-linear-gradient(to right, #e676ff, #831afc);
    background: linear-gradient(to right, #a276ff, #3c09d0);
    border: 3px solid #795be3 !important;
}
.btn-purple-moon:hover {
    filter: drop-shadow(0 0 20px #831afc) contrast(2) brightness(1);
    border: 3px solid #795be3 !important;
}

.btn-purple-moonNB {
    color: #fff !important;
    border: 3px solid #795be3 !important;
}
.btn-purple-moonNB:hover {
    filter: drop-shadow(0 0 20px #831afc) contrast(2) brightness(1);
    border: 3px solid #795be3 !important;
}

.btn-dark-moon {
    color: #fff !important;
    background: #141E30;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #243B55, #141E30);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #243B55, #141E30); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    color: #fff;
    border: 3px solid #eee !important;
}

.btn-light-moon {
    color: #fff !important;
    background: #FFEFBA;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #FFFFFF, #FFEFBA);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #FFFFFF, #FFEFBA); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    color: #000;
    border: 3px solid #eee !important;
}

.btn-funky-moon {
    color: #fff !important;
    background: #A770EF;  /* fallback for old browsers */
    background: -webkit-linear-gradient(145deg, #FDB99B, #CF8BF3, #A770EF);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(145deg, #FDB99B, #CF8BF3, #A770EF); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    color: #fff;
    border: 3px solid #eee !important;
}

.btn-rounded {
    color: #fff !important;
    border-radius: 35px;
}

.btn-fab {
    color: #fff !important;
    height: 50px;
    width: 53px;
    border-radius: 50%;
}
.CaptionContainer .RightArea {
    float: right;
    font-weight: 400;
    margin-right: 5px;
}
.whiteTextWithBlackBorder {
  font-size: 12px;  
  font-weight: 700; 
  color: #fff !important; 
  text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
}
#preloaderLogin {
  background-color: var(--raisin-black-2);
  box-shadow: 0 0 8px 3px rgba(0, 0, 0, .3);
  color: #eee!important;

  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #221e20;
  z-index: 999999;
}

#preloader {
  background-color: var(--raisin-black-2);
  box-shadow: 0 0 8px 3px rgba(0, 0, 0, .3);
  color: #eee!important;

  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #221e20;
  z-index: 999999
}
.preloader--bounce {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    /*width: 40px;
    height: 40px*/
}
.preloader-bouncer--1,
.preloader-bouncer--2 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background-color: #fff;
    opacity: .6;
    filter: alpha(opacity=60);
    -webkit-animation: bounce 2s infinite ease-in-out;
    animation: bounce 2s infinite ease-in-out
}

@keyframes l24{
  100%{background-position: left}
}

/**
 * ==============================================
 * Dot Floating
 * ==============================================
 */
.dot-floating {
  position: relative;
  width: 10px;
  height: 10px;
  border-radius: 5px;
  background-color: #9880ff;
  color: #9880ff;
  animation: dot-floating 3s infinite cubic-bezier(0.15, 0.6, 0.9, 0.1);
}
.dot-floating::before, .dot-floating::after {
  content: "";
  display: inline-block;
  position: absolute;
  top: 0;
}
.dot-floating::before {
  left: -12px;
  width: 10px;
  height: 10px;
  border-radius: 5px;
  background-color: #9880ff;
  color: #9880ff;
  animation: dot-floating-before 3s infinite ease-in-out;
}
.dot-floating::after {
  left: -24px;
  width: 10px;
  height: 10px;
  border-radius: 5px;
  background-color: #9880ff;
  color: #9880ff;
  animation: dot-floating-after 3s infinite cubic-bezier(0.4, 0, 1, 1);
}

@keyframes dot-floating {
  0% {
    left: calc(-50% - 5px);
  }
  75% {
    left: calc(50% + 105px);
  }
  100% {
    left: calc(50% + 105px);
  }
}
@keyframes dot-floating-before {
  0% {
    left: -50px;
  }
  50% {
    left: -12px;
  }
  75% {
    left: -50px;
  }
  100% {
    left: -50px;
  }
}
@keyframes dot-floating-after {
  0% {
    left: -100px;
  }
  50% {
    left: -24px;
  }
  75% {
    left: -100px;
  }
  100% {
    left: -100px;
  }
}
.preloader-bouncer--2 {
    -webkit-animation-delay: -1s;
    animation-delay: -1s
}
@-webkit-keyframes bounce {
    0%, 100% {
        -webkit-transform: scale(0)
    }
    50% {
        -webkit-transform: scale(1)
    }
}
@keyframes bounce {
    0%, 100% {
        transform: scale(0);
        -webkit-transform: scale(0)
    }
    50% {
        transform: scale(1);
        -webkit-transform: scale(1)
    }
}
/**
 * ==============================================
 * Dot Typing
 * ==============================================
 */
.dot-typing {
  margin-left: 50%; /*custom*/
  position: relative;
  left: -9999px;
  width: 10px;
  height: 10px;
  border-radius: 5px;
  background-color: #ffa080;
  color: #ffa080;
  box-shadow: 9984px 0 0 0 #ffa080, 9999px 0 0 0 #ffa080, 10014px 0 0 0 #ffa080;
  animation: dot-typing 1.5s infinite linear;
}

@keyframes dot-typing {
  0% {
    box-shadow: 9984px 0 0 0 #ffa080, 9999px 0 0 0 #ffa080, 10014px 0 0 0 #ffa080;
  }
  16.667% {
    box-shadow: 9984px -10px 0 0 #ffa080, 9999px 0 0 0 #ffa080, 10014px 0 0 0 #ffa080;
  }
  33.333% {
    box-shadow: 9984px 0 0 0 #ffa080, 9999px 0 0 0 #ffa080, 10014px 0 0 0 #ffa080;
  }
  50% {
    box-shadow: 9984px 0 0 0 #ffa080, 9999px -10px 0 0 #ffa080, 10014px 0 0 0 #ffa080;
  }
  66.667% {
    box-shadow: 9984px 0 0 0 #ffa080, 9999px 0 0 0 #ffa080, 10014px 0 0 0 #ffa080;
  }
  83.333% {
    box-shadow: 9984px 0 0 0 #ffa080, 9999px 0 0 0 #ffa080, 10014px -10px 0 0 #ffa080;
  }
  100% {
    box-shadow: 9984px 0 0 0 #ffa080, 9999px 0 0 0 #ffa080, 10014px 0 0 0 #ffa080;
  }
}

.fieldNews {
  border: 1px #000000 solid;
  text-align: justify;
  background-image: linear-gradient(rgb(255 146 0 / 43%), rgb(0 0 0 / 92%));
}

.fixTitleThemebox {
  position: absolute;
  width: 100%;
}
.fixTitleThemebox img {
  width: 158px;
  height: 110px;
}
.translatorImg  {
  width: 24px; 
  cursor: pointer;
}
.translatorImg:hover  {
  transform: scale(1) rotate(-5deg);
}

.newsTickerButton {
  position: absolute;
  top: 5px;
  right: 14px;
  z-index: 1;
}

.premiumbenefits {
  text-align: center;
  display: flex;
  flex: 50px;
  justify-content: center;
}  

.premiumbenefits > div { 
  display: flex;align-items: center;flex: 1; margin: auto 5x;
}

.VouchersBenefits {
  text-align: center;
  display: flex;
  flex: 50px;
  justify-content: space-between;
  align-content: space-between;
  align-items: flex-end;
}  


.linkButton {
    border: none;
    background: 0 0;
    cursor: pointer;
    padding: 0;
    font-family: inherit;
    font-size: inherit;
    font-weight: 700;
    color: #23527c;
    text-decoration: none !important;
    outline: 0;
}
.linkButton:hover {
    text-decoration: underline !important;
    color: #0063DC;
}

.OptionsContainer {
}

.VSCCoinImages {
  position: relative;
  margin-left: 2px;
  margin-right: 2px;
}
.DisplayOptionsButton {
    position: absolute;
    right: 3px;
    top: 3px;
}
.DisplayOptionsContent {
    min-height: 25px;
    min-width: 600px;
}
.DisplayOptionsContent .DisplayOptionsLabel {
    float: left;
    padding-top: 2px;
}
.AuctionInput {
    width: 115px;
    margin-right: 7px;
    float: left;
}
.inputCustom {
  width: 100%;
  height: 25px;
}

#CurrentTradesItemSearch #ItemInput {
    width: 308px;
}
#FilterCharacterTrades .DisplayOptionsContent .InInputResetButton {
    left: 474px;
}
.DisplayOptionsContent .InInputResetButton {
  position: absolute;
  width: 18px;
  text-align: center;
  top: 2px;
  RIGHT: 271px;
  cursor: pointer;
}
.LevelRangeInput {
    text-align: right;
    width: 100px;
}
.AuctionFilterHelper {
    clear: both;
}
.AuctionInputLong {
    width: 237px;
}
.LevelRange {
    float: left;
    height: 8px;
    width: 8px;
    margin-right: 5px;
    border-bottom: 1px solid #000
}
.gradeBazar {
  float: right;
  min-width: 143px!important;
  right: 3px;
  background-color: #e0d0b8;
  text-align: center;
  border: 1px solid #5a2800;
  min-height: 135px;
  margin-top: 5px;
  margin-bottom: 5px;
  margin-left: 9px;
  display: grid;
  align-items: center;
}

legend.scheduler-border {
    width:inherit; /* Or auto */
    padding:0 10px; /* To give a bit of padding on the left and right */
    border-bottom:none;
}

.PMCID_Icon_Container {
    position: relative;
    margin: 3px;
    display: inline-block; /* faz os bot�es ficarem um ao lado do outro */
}

.PMCID_Icon_Container label {
    top: 6px;
    cursor: pointer;
}

.PMCID_QuicknessIndicator {
    left: 25px;
    right: 0;
    position: absolute;
    bottom: 25px;
    z-index: 98;
}

.PMCID_QuicknessIndicatorLabelContainer {
    /* display: table; */
    /* height: 40px; */
    width: 100%;
    margin-top: 6px;
    color: #cccc;
}

.PMCID_QuicknessIndicatorLabel {
    display: table-cell;
    vertical-align: middle;
}

.PMCID_Icon:hover {
    background-image: url(../images/payment/pmcid_icon_hover.png);
}

.PMCID_Icon .PMCID_CP_Icon {
    border: solid 1px #532002;
    position: relative;
    margin-left: auto;
    margin-right: auto;
    margin-top: 15px;
    width: 100px;
    height: 40px;
    background-color: white;
}

.PMCID_Icon .PMCID_CP_Label {
    position: relative;
    margin-left: auto;
    margin-right: auto;
    top: 9px;
    z-index: 99;
}

.PMCID_Icon .PMCID_Icon_Selected {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 97;
    width: 180px;
    height: 147px;
    background-size: 180px 147px;
}

.PMCID_Icon .PMCID_Deactivated {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 99;
    width: 180px;
    height: 147px;
    background-size: 180px 147px;
}

.PMCID_Icon .PMCID_Icon_Over {
    position: absolute;
    top: 0;
    left: 0;
    width: 180px;
    height: 147px;
    background-size: 180px 147px;
}

.ServiceID_Icon_New {
    display: flex;
    position: absolute;
    left: 26px;
    top: 45px;
    height: 64px;
    width: 130px;
    background-repeat: no-repeat;
    align-items: center;
    justify-content: space-evenly;
    flex-wrap: wrap;
    z-index: 99;
}

.textPack {
    display: flex;
    flex-direction: column;
    justify-content: center;
    z-index: 1;
    margin: auto;
    padding: 0;
    list-style-type: none;
    text-align: left;
    margin-left: 10px;
    font-size: 11px;
    top: 30px;
    position: relative;
    height: 100px;
    width: 89%;
}
.ServiceID_Icon .ServiceID_Deactivated {
    position: absolute;
    top: 0;
    left: 0;
    width: 200px;
    height: 250px;
    z-index: 99
}

.ServiceID_Icon .ServiceID_Icon_Selected {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 98;
    background-repeat: no-repeat;
    background-size: 180px 140px;
}

.ServiceID_Icon .ServiceIDLabelContainer {
    position: relative;
    left: 0;
    display: table;
    top: 15px;
    height: 40px;
    width: 160px;
    margin-left: 10px;
    margin-right: 10px;
    z-index: 99;
}

.ServiceID_Icon .ServiceIDLabel {
    display: table-cell;
    vertical-align: middle;
    position: relative;
    top: -12px;
}

.ServiceIDLabel {
  cursor: pointer;
}
.ServiceID_Icon .ServiceIDPriceContainer {
    position: absolute;
    bottom: 14px;
    width: 160px;
    margin-left: 5px;
    margin-right: 5px;
    z-index: 99;
}

.ServiceID_Icon .ServiceIDSpecialOffer {
    position: absolute;
    left: 0;
    top: -5px;
    z-index: 100
}

.charBadge {
  position: absolute;
  float: right;
  right: 20px;
  top: 13px;
  text-align: center;
}
.charOutfit {
  top: 60px;
  right: 115px;
  border: 2px solid #F1E0C6;
  border-radius: 100px;
  padding: 13px;
  position: absolute;
}
.charOutfit img {
  width: 140px;
}
.lastUpdate {
  float: right;
  right: 10px;
  position: relative;
  margin: auto;
  font-family: math;
  font-size: 11px;
  top: 3px;
}

/*-----------------------------------*\
  #BACK TO TOP
\*-----------------------------------*/

.back-top-btn {
    display: block;
    padding: 5px;
    /*background-color: yellowgreen;*/
    border-radius: 15px;
    position: fixed;
    bottom: 40px;
    right: 193px;
    padding: 12px;
    z-index: 100;
    transition: var(--transition);
    opacity: 0;
    visibility: hidden;
}

.back-top-btn.active {
  opacity: 1;
  visibility: visible;
  transform: translateY(-10px);
}

.back-top-btn img {
  border: 0px;
  width: 30px;
}
.streamLiveDotBoxRed {
  position: absolute;
  top: 0px;
  left: 30px;
  width: 8px;
  height: 8px;
  margin: 2px;
  background-color: #ff0000;
  border-radius: 50%;
  opacity: 1;
  animation: fade 2s linear infinite;
}
.streamLiveDotBoxGreen {
  position: absolute;
  top: 0px;
  left: 30px;
  width: 8px;
  height: 8px;
  margin: 2px;
  background-color: #199a00;
  border-radius: 50%;
  opacity: 1;
  animation: fade 2s linear infinite;
}
.streamers {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    /*align-items: center;
    justify-content: center;*/
}

.streamer {
    display: flex;
    flex-direction: row;
}

.streamerRightSide {
  display: flex;
  flex-direction: column;
  margin-left: 20px;
  width: 45%;
}

.streamLiveDotRed {
    width: 8px;
    height: 8px;
    margin: 2px;
    background-color: #ff0000;
    border-radius: 50%;
    opacity: 1;
    animation: fade 2s linear infinite;
}
.streamLiveDotGreen {
    width: 8px;
    height: 8px;
    margin: 2px;
    background-color: #199a00;
    border-radius: 50%;
    opacity: 1;
    animation: fade 2s linear infinite;
}

.viewersBox {
    display: flex;
    flex-direction: row;
}

.viewerCount {
    line-height: 0;
    margin-top: 7px;
    margin-left: 3px;
}
.viewerCountBox {
  position: absolute;
  left: -8px;
  top: -17px;
}

.streamerName {
  position: absolute;
  right: 96px;
  top: 45px;
  display: flex;
  justify-content: center;
}

.textWithContour {
    /*position: absolute;*/
    background: 0 0;
    border: none;
    text-align: center;
    color: cornsilk;
    font-family: sans-serif;
    font-size: 13px;
    font-weight: 400;
    z-index: 20;
    text-shadow: -1px -1px 0 #000, 0 -1px 0 #000, 1px -1px 0 #000, 1px 0 0 #000, 1px 1px 0 #000, 0 1px 0 #000, -1px 1px 0 #000, -1px 0 0 #000;
}

form {
  padding: 0px;
  margin: 0px;
}

ul {
  margin: 0px;
  font-weight: 400;
}

.automargin {
  margin: auto;
}
.NavigationBarLinkList {
    text-align: center;
    order: 1;
}
.NavigationBarLinkListX {
    text-align: center;
}
@keyframes shakeUpDown {
  0%, 100% {
      transform: translateY(0);
  }
  50% {
      transform: translateY(-8px);
  }
}

.balanceUpDown {
  animation: shakeUpDown 3s ease-in-out infinite;
}
.BlockPageNavigationRow {
    height: 20px;
    margin-top: 3px;
    margin-bottom: 5px;
    padding: 6px;
    padding-top: 3px;
    padding-bottom: 0;
    background-color: #d5c0a1;
    border: 1px solid #5a2800;
}
.BlockPageNavigationRow .FirstOrLastElement:first-child,.BlockPageNavigationRow .FirstOrLastElement a {
    width: 70px;
    text-align: left;
}
.CVIcon {
  float: left;
  position: relative;
  z-index: 150;
  cursor: help;
  background-color: #d5c0a1;
  border: 1px solid #5A2800;
  margin: auto;
  padding: 1px;
  width: 64px;
  height: 64px;
  overflow: hidden;
  image-rendering: crisp-edges;
  image-rendering: pixelated;
}
.CVIcon.CVIconObject {
  width: 36px;
  height: 36px;
  overflow: hidden;
}
.CVIcon.CVIconObject img {
  width: 32px;
  height: 32px;
}
.ObjectAmount {
  position: absolute;
  bottom: 0px;
  right: 2px;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 10px;
  font-weight: bold;
  z-index: 100;
  color: white;
  text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
}
.CVIconOutfit {
  float: left;
  position: relative;
  z-index: 150;
  cursor: help;
  /*background-color: #d5c0a1;*/
  background-color: #f1e0c5;
  border: 1px solid #5a2800;
  margin: auto;
  padding: 1px;
  min-width: 64px;
  min-height: 64px;
  /*overflow: hidden;*/
  image-rendering: crisp-edges;
  image-rendering: pixelated;
}
.CVIconOutfit.CVIconObject {
    width: 40px;
    height: 40px;
    overflow: hidden
}
.CVIconOutfit.CVIconObject img {
  width: 32px;
  height: 32px;
  top: 2px;
  left: 1px;
  position: relative;
}


.CVIconPacks {
  float: left;
}
.backgroundPacks {
    background-color: #000000b3;
    width: 167px;
    height: 91px;
    top: -16px;
    position: absolute;
    left: -3px;
}

.ObjectAmountPacks {
    position: absolute;
    bottom: -2px;
    right: 16px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: 700;
    z-index: 9000;
    color: bisque;
    text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
}

.ObjectAmountBox {
  /* left: 50; */
  margin-left: 90px;
  top: 23px;
  font-size: 18px;
  /* color: red; */
  position: absolute;
  /* bottom: 0; */
  /* right: 2px; */
  font-family: sans-serif;
  /* font-size: 10px; */
  font-weight: 700;
  z-index: 100;
  color: #fff;
  text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
}

.ObjectTier {
    position: absolute;
    bottom: 32px;
    left: 25px;
    width: 9px;
    height: 8px;
    z-index: 100
}

.ObjectTier img {
    max-width: 100%;
    max-height: 100%
}

.CVIcon.CVIconObject.GreyedOutObject {
    filter: grayscale(.8)
}

.CharacterView .TopButton {
    right: -4px;
    top: -4px
}

.ViewBlockTopRow {
    height: 30px
}

.AuctionCharacterName {
    font-weight: 700;
    margin-bottom: 4px
}

.AuctionInfo {
  width: 100%;
  text-align: center;
  font-weight: 700;
  font-size: 12px;
  color: #ff9712
}

.AuctionNewIcon {
    position: absolute;
    left: -4px;
    top: -4px;
    z-index: 100
}

.AuctionLinks {
  position: relative;
  right: 6px;
  top: 4px;
  height: 15px;
  float: right;
}

.AuctionLinks a {
    margin-left: 5px
}

.BlockPageNavigationRow .CipAjaxLink {
    display: block;
    min-width: 15px;
    padding-left: 1px;
    padding-right: 1px;
    border: 1px solid transparent
}
.BlockPage {
    display: grid;
    grid-template-columns: repeat(auto-fill,minmax(68px,1fr));
    grid-auto-rows: 73px;
    grid-gap: 1px;
}
.BlockPage.BlockPageObject {
    grid-template-columns: repeat(auto-fill,minmax(36px,1fr));
    /*grid-auto-rows: 38px;*/
}
.WatchOrUnwatchLink {
    position: absolute;
    top: 0;
    right: 70px
}

.AuctionLinks .WatchListIndicator {
  width: 100%;
  text-align: right;
  position: relative;
  right: 50px;
  top: 0px;
  color: green;
  animation: fadeOut 4s forwards;
  animation-delay: 4s;
}

@keyframes fadeOut {
    from {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

.AuctionBody {
  display: flex;
  width: 100%;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: stretch;
  align-content: stretch;
  margin-top: 5px;
  padding-top: 5px;
  border-top: 1px dashed #5A2800;
}
.AuctionDisplay {
  flex-basis: 76px;
  flex-grow: 0;
  flex-shrink: 0;
  order: 0;
  padding: 1px;
  background-color: #f1e0c6;
  border: 1px solid #5A2800;
  box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.75);
  float: left;
  margin-right: 10px;
}
.AuctionBodyBlock {
  margin-top: 5px;
  margin-bottom: 5px;
}
.AuctionOutfit {
  position: relative;
}

.AuctionItemsViewBox {
    display: grid;
    grid-template-columns: repeat(auto-fill,minmax(36px,1fr));
    grid-auto-rows: 38px
}

.AuctionOutfitImage {
  position: absolute;
  left: -7px;
  top: -3px;
  z-index: 100;
  image-rendering: crisp-edges;
  image-rendering: pixelated;
}

.ShortAuctionData {
    font-size: .875em;
    position: relative;
    min-width: 300px;
    flex-shrink: 0;
    flex-grow: 1;
    padding: 10px;
    padding-top: 2px;
    padding-bottom: 2px;
    text-align: left;
    background-color: #f1e0c6;
    border: 1px solid #5a2800;
    box-shadow: 2px 2px 5px 0 rgba(0,0,0,.5)
}

.ShortAuctionData .AuctionTimer {
    position: absolute;
    top: 18px;
    right: 10px;
    width: 200px;
    text-align: right;
    background-color: #f1e0c6;
    color: red
}

.ShortAuctionData .ShortAuctionDataLabel {
    width: 145px;
    font-weight: 700;
    float: left;
}

.ShortAuctionDataValue {
    text-align: right
}

.ShortAuctionDataBidRow {
    /*margin-top: 5px*/
}

.CurrentBid {
  width: 142px;
  flex-shrink: 0;
  margin-left: 10px;
  padding: 5px;
  text-align: center;
  background-color: #f1e0c6;
  border: 1px solid #5a2800;
  box-shadow: 2px 2px 5px 0 rgba(0,0,0,.5);
  display: flex;
  justify-content: space-around;
  align-content: stretch;
  flex-direction: column;
  align-items: center;
}

.CurrentBid .Container {
    margin-right: auto;
    margin-left: auto;
    text-align: center
}

.CurrentBid .BigButton {
    margin-left: auto;
    margin-right: auto;
    text-align: center
}

@media all and (max-width: 1170px) {
    .SpecialCharacterFeatures {
        margin-right: 10px  !important;
    }

    .CurrentBid {
        order: 5 !important;
        margin-left: auto !important;
    }

    .DisplayOptionsContent .DisplayOptionsLabel {
        width: 100px !important;
    }

    canvas {
      left: 90% !important;
  }
}

.MyMaxBidLabel {
    font-weight: 700
}

.MyMaxBidInput {
    width: 131px;
    margin-top: 4px;
    margin-bottom: 4px;
    /*height: 13px;*/
    height: 18px;
    text-align: right
}
.newFlag {
  position: absolute;
  top: -3px;
  left: -3px;
}
.SpecialCharacterFeatures {
  min-height: 135px;
  flex-basis: 300px;
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-content: stretch;
  align-items: center;
  padding: 10px;
  background-color: #f1e0c6;
  border: 1px solid #5a2800;
  box-shadow: 2px 2px 5px 0 rgba(0,0,0,.5);
}

.SpecialCharacterFeatures .Entry {
    width: 100%;
    min-width: 300px;
    text-align: left
}

.SpecialCharacterFeatures .CharacterFeatureCategory {
    margin-right: 5px
}

.RWTExperimentalWorldsText {
    color: red
}

.PercentageColumn {
    width: 100%;
    position: relative
}

.LabelColumn {
    width: 80px!important;
    white-space: nowrap
}

.LevelColumn {
    width: 30px!important;
    text-align: right
}

.PercentageColumn {
    position: relative;
    margin-right: 2px
}
#StickyNavigation.SmallBox {
    position: sticky;
    top: 0;
    z-index: 1000;
}
.BlockPageNavigationRow .CurrentPageLink {
  display: inline-block;
  min-width: 15px;
  padding-left: 2px;
  padding-right: 2px;
  background-color: #d5c0a1;
  cursor: unset;
  color: unset;
  text-decoration: auto;
}
.PercentageBar {
    position: absolute;
    height: 18px;
    background-color: #5f4d41;
    top: 1px
}

.PercentageStringContainer {
    width: 100%;
    text-align: center
}

.PercentageString {
    position: absolute;
    top: 3px;
    width: 50%;
    margin-left: 20px;
    left: 0;
    text-align: right;
    font-family: Arial,Helvetica,sans-serif;
    font-size: 12px;
    font-weight: 700;
    color: #fff;
    text-shadow: -1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000
}

.PercentageBarSpacer {
    width: 5px
}
/*
.PageLink {
  display: inline-block;
  min-width: 15px;
  text-align: center;
  cursor: pointer;
  font-family: Verdana, Arial, Times New Roman, sans-serif;
  font-weight: bold;
  text-decoration: none;
  color: #0063DC;
}*/

.PageLink {
    display: inline-block;
    min-width: 15px;
    text-align: center;
}
/*
.PageLink:hover {
  text-decoration: underline;
}*/

.AchievementSecretIcon {
    position: absolute;
    margin-top: -2px;
    margin-left: 5px
}

.CollapsedBlock .TableContent tr:nth-child(n+12) {
    display: none
}

.CollapsedBlock .TableContent tr:last-child {
    display: table-row;
    text-align: center
}

.CollapsedBlock .IndicateMoreEntries {
    font-style: italic
}

.CharacterDetailsBlock .ShowMoreOrLess {
    padding: 7px;
    padding-bottom: 7px;
    font-size: 8pt;
    text-align: right
}

.CharacterDetailsBlock .ShowMoreOrLess a {
    cursor: pointer
}

.CharacterTradeTibiaCoinBalance {
    position: absolute;
    top: 8px;
    color: #fff;
    right: 5px;
    font-size: 7pt
}

.FAQStartPage .ClearBoth {
    clear: both
}

.FAQRootTopics {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-content: stretch;
    align-items: center;
    margin-top: 25px;
    margin-bottom: 50px
}

.FAQRootTopicContainer {
    position: relative;
    margin-bottom: 50px;
    padding: 5px;
    order: 0;
    flex: 1 1 30%;
    align-self: center;
    text-align: center
}

.FAQRootTopic {
    width: 125px;
    margin-left: auto;
    margin-right: auto
}

.FAQRootTopic img {
    height: 65px;
    width: 65px
}

.FAQRootTopicOverImage {
    display: none;
    position: absolute
}

.FAQRootTopicContainer:hover .FAQRootTopic .FAQRootTopicTitle {
    font-weight: 700
}

.FAQRootTopicTitle {
    position: absolute;
    top: 75px;
    order: 0;
    flex: 0 0 120px;
    align-self: center;
    text-align: center;
    color: #5a2800;
    font-weight: 400;
    font-size: 11pt;
    margin-left: -10px;
    padding: 5px;
    text-align: center;
    width: 140px;
    height: 20px
}

.FAQSearchForm {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-content: stretch;
    align-items: flex-start;
    height: 16px;
    margin-bottom: 25px
}

.FAQSearchForm #SearchButton {
    order: 0;
    flex: 0 1 auto;
    align-self: auto;
    margin-right: 5px
}

.FAQSearchForm #SearchInput {
    margin-right: 5px;
    float: right;
    order: 0;
    flex: 1 0 auto;
    align-self: auto;
    margin-bottom: 5px
}

.FAQSearchForm #SearchInput img {
    position: absolute;
    padding: 3px;
    pointer-events: none;
    height: 20px;
    width: 20px
}

.FAQSearchForm #SearchInput input {
    width: 100%;
    height: 25px;
    padding-left: 25px
}

.FAQSearchResults {
    text-align: center;
    margin-top: -40px;
    margin-bottom: 60px
}

.FAQSearchResults h1 {
    margin-top: 0;
    margin-bottom: 40px;
    font-size: 22px
}

.FAQSearchResults .HintBoxHeadlineSeparator {
    position: absolute;
    top: 48px;
    height: 4px;
    width: 100%;
    margin-left: -10px;
    margin-right: 0
}

.FAQSearchResults ul {
    padding: 0;
    list-style-type: none
}

.FAQPermanentBlock {
    margin-top: -40px;
    width: 100%;
    display: flex;
    flex-direction: row-reverse
}

.FAQBlock {
    flex: 1 1
}

.FAQBlockRight {
    padding-left: 8px
}

.FAQBlockLeft {
    padding-right: 8px
}

.FAQBlock .HintBoxHeadlineSeparator {
    position: absolute;
    top: 48px;
    height: 4px;
    width: 99%;
    margin-left: -8px;
    margin-right: 0
}

.FAQBlock h2 {
    text-align: center;
    margin: 0
}

.FAQBlock ul {
    padding: 0;
    margin-left: -6px;
    margin-right: -6px;
    margin-bottom: -10px;
    list-style-type: none
}

.FAQBlock ol {
    padding: 0;
    margin-left: -6px;
    margin-right: -6px;
    margin-bottom: -10px;
    list-style-type: decimal
}

.FAQBlock li {
    height: 55px;
    line-height: 55px;
    padding: 2px;
    padding-left: 5px;
    padding-right: 5px;
    list-style-type: none;
    text-align: center
}

.FAQBlock li:nth-child(even) {
    background: #d5c0a1
}

.FAQBlock li:nth-child(odd) {
    background: #f1e0c6
}

.FAQBlock .ListEntryContainer {
    vertical-align: middle;
    line-height: normal;
    display: inline-block
}

.FAQList {
    font-size: 125%;
    line-height: 175%
}

.FAQStartPage .FAQBlock .FAQList {
    font-size: 110%
}

.FAQBreadCrumbNavigation {
    margin-bottom: 15px
}

.FAQContent {
    margin-bottom: 50px
}

.FAQCreateTicketLink {
    position: absolute;
    bottom: 25px
}

.tooltip,.tooltip:hover + .tip2,.tip2:hover {
  display: relative;
  font-size: 100%;
  font-weight: Bold;
  color: #FFFFFF;
  text-decoration: none;
}

.home-box-title {
  height: 30px;
  border-bottom: 1px solid #990000;
  border-radius: 10px 10px 0px 0px;
  color: #FFFFFF;
  padding: 8px 0px 8px 4px;
  display: flex;
  align-items: center;
  background-image: url(../images/content/redinfo_background.gif);
}

.home-box-server-save {
    height: 30px;
    background: rgb(176,0,2);
    background: linear-gradient(120deg,rgba(176,0,2,1) 0%,rgba(181,5,3,1) 10%,rgba(185,11,5,1) 20%,rgba(190,16,6,1) 30%,rgba(194,22,7,1) 40%,rgba(199,27,9,1) 50%,rgba(204,32,10,1) 60%,rgba(208,38,11,1) 70%,rgba(213,43,12,1) 80%,rgba(217,49,14,1) 90%,rgba(222,54,15,1) 100%);
    border-bottom: 1px solid #990000;
    border-radius: 10px 10px 0px 0px;
    color: #FFFFFF;
    padding: 8px 0px 8px 4px;
    display: flex;
    align-items: center
}

.home-box-pedestal {
    background-image: url(../images/general/Boosted_Creature_Pedestal.gif);
    background-repeat: no-repeat;
    display: inline-block;
    width: 120px;
    height: 76px
}

.home-box-bg-img {
  text-align: center;
  padding: 15px 0px 0px 0px;
  /* border-radius: 0px 0px 10px 10px; */
  background-image: linear-gradient(rgb(19 46 95), rgb(95 92 87));
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  height: 110px;
}

.home-box-info {
  /* height: 30px; */
  /* margin-top: -30px; */
  border-radius: 0px 0px 10px 10px;
  background: rgb(15 15 15 / 36%);
  /* backdrop-filter: blur(199px); */
  letter-spacing: 1px;
}

/* estava aparecendo isso nao sei por que, nos mobiles */
/* 09/02/2024

.modal {
  background: rgb(7 4 0 / 87%);
  padding-right: 0 !important;
}
.modal-footer {
  justify-content: center;
  color: aliceblue;
}

.modal-content {
  border: var(--bs-modal-border-width) solid rgb(92 56 18 / 97%);
  justify-content: center;
  width: 800px;
  min-width: 600px;
  max-width: 1000px;
  background: #290000eb;
  color: #d2cdc6;
}
.modal-footer {
  padding: 0px !important;
  padding-top: 10px !important;
  margin-left: 15px;
  margin-right: 15px;
  display: flex; 
  align-items: center;
  flex-direction: column;
}
.modal-header {
  margin-left: 15px;
  margin-right: 15px;
}
/* 09/02/2024
.modal-dialog-centered {
  justify-content: center;
}
*/
.modal {
  padding: 0 !important; // override inline padding-right added from js
}
.modal .modal-dialog {
  width: 100%;
  max-width: none;
  height: 100%;
  margin: 0;
}
.modal .modal-content {
  height: 100%;
  border: 0;
  border-radius: 0;
}
.modal .modal-body {
  overflow-y: auto;
}
.modal-backdrop {
  opacity: 0 !important;
}
.modal-backdrop.fade {
  display: none;
}
.mw-headline {
  color: white;
  font-weight: bold;
}

.smokeLayer {
    text-align: center;
    background: #1e1e1eb8;
    transition-duration: inherit;
    transition-property: opacity;
    transition-timing-function: cubic-bezier(.47,0,.74,.71);
    z-index: 100;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.smokeLayer img {
  position: relative;
  width: 80%; 
  margin-top: 70px;
}

.bannerClose {
    right: 3px;
    z-index: 100;
    position: absolute;
    float: right;
    font-size: 35px;
    color: #ffffffde;
}
.bannerClose:hover {
    color: #ffffff73; 
}

.promoTitle {
  background: -webkit-linear-gradient(#ffc800, #ff8400);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.buyNowBanner_Button {
  position: relative;
  top: -35px;
  text-align: center;
  color: white;
  z-index: 5;
}

.closeBanner_Button {
  float: right;
  position: absolute;
  top: -80px;
  z-index: 2;
  right: 4px;
}

.divTextCountDown {
  text-transform: uppercase;
  font-family: monospace;
  text-align: center;
  color: #ffffff;
  text-shadow: 2px 0px black;
  font-size: 16px;
  background: #000000b0;
  width: 450px;
  padding: 0;
  margin: auto;
  display: block;
  position: absolute;
  top: 31px;
  left: 0;
  right: 0;
}
.divBoxCountDown {
  top: -130px;
  position: relative;
  margin-left: auto;
  margin-right: auto;
  width: 50%;

  margin: 0
  padding: 0
  overflow: hidden
  vertical-align: middle
  text-align: center
}
.modalCountdown {
  background: #290000eb;
  top: 195px;
  position: relative;
  /* width: 100%;*/
}

.top_level
{
  top:35px;
  left:6px;
  z-index:20;
  display:block;
  padding-top:6px;
  font-family:Tahoma,Geneva,sans-serif;
  font-size:8pt;
  color:#5f4d41!important;
  font-weight:700;
  text-align:left;
  text-decoration:inherit
}
.levelvoctoplevel
{
  color:#5a2800;
  font:100 7pt Verdana,Arial,Times New Roman,sans-serif
}
.outfitImgtoplevel,.positiotoplvel
{
  background-position:right bottom;
  position:relative;
  margin-left:-64px;
  margin-top:-64px;
  height:64px;
  width:64px
}

.outfitImgtoplevel
{
  left:26px;
  top:13px
}

.charPedestal {
  background-image: url(../images/general/pedestal.gif);
  width: 47px;
  height: 48px;
  background-repeat: no-repeat;
  position: absolute;
  right: 50%;
  left: 50%;
  z-index: 2;
  bottom: 50%;
}

.charPedestal > img {
  position: absolute;
  top: -28px;
  right: 12px;
}
.charPedestalForum {
  background-image: url(../images/general/pedestal.gif);
  width: 48px;
  height: 48px;
  background-repeat: no-repeat;
  position: relative;
  left: 32%;
  z-index: 2;
}

.charPedestalForum > img {
  position: relative;
  right: 8px;
}

.charPedestalVideos {
  background-image: url(../images/general/pedestal.gif);
  width: 47px;
  height: 48px;
  background-repeat: no-repeat;
  position: absolute;
  right: 0px;
  top: -16px;
}

.charPedestalVideos > img {
  position: absolute;
  top: -28px;
  right: 12px;
}

.charPedestalCasts {
  background-image: url(../images/general/pedestal.gif);
  width: 47px;
  height: 48px;
  background-repeat: no-repeat;
  position: absolute;
  left: 48px; 
  top: 0px;
}

.charPedestalCasts > img {
  position: absolute;
  top: -28px;
  right: 12px;
}

.characterBackpack {
  position: relative;
  float: right;
  right: 45px;
  top: 7px;
  z-index: 2;
}

.characterBackpack > img {
  position: absolute;
}

.neonText {
  color: #fff;
  font-weight: bold;
  overflow: hidden;
  position: relative;
  padding: 10px;
  text-transform: uppercase;
  animation: 1s ease infinite reverse glow;
}
.neonText:before {
  content: attr(data-text);
  position: absolute;
  mix-blend-mode: difference;
  filter: blur(3px);
}
.neonText:after {
  content: "";
  background: linear-gradient(45deg, #7b4397 30%, #dc2430 70%);
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  mix-blend-mode: multiply;
}

.statistcsBlueYellowText:after {
    content: "";
    background: linear-gradient(45deg, #2f60c2 30%, #d3dc24 70%);
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    mix-blend-mode: multiply;
}
.statistcsBrownText:after {
    content: "";
    background: linear-gradient(45deg, #835314 30%, #ffffff 70%);
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    mix-blend-mode: multiply;
}
.titleWebShop {
    text-align: center; 
    text-transform: uppercase; 
    font-weight: bold;
    z-index: 1; 
    position: relative;
}
.titleWebShop img {
    width: 32px; max-width: 100%; height: auto;
}

.plataformTypeWebShop {
    text-shadow: -1px -1px 20px #6dff00, 0 -1px 0 #00ff0c, 1px -1px 0 #64f400, 1px 0 0 #000000, 1px 1px 0 #4fff00, 0 1px 0 #1bff00, -1px 1px 0 #6f0, -1px 0 0 #5aff00;
    text-transform: uppercase;
    position: relative;
    z-index: 1;
    font-family: fantasy !important;
    font-size: 18px !important;
}
.plataformTypeWebShopOld {
    text-shadow: -1px -1px 20px #ffa500, 0 -1px 0 #ff8100, 1px -1px 0 #8b4412, 1px 0 0 #000000, 1px 1px 0 #ff6a00, 0 1px 0 #4e330b, -1px 1px 0 #f90, -1px 0 0 #5b3d08;
    text-transform: uppercase;
    position: relative;
    z-index: 1;
    font-family: fantasy !important;
    font-size: 18px !important;
}
@keyframes glow {
  0% {
    text-shadow: 0 0;
  }
  75% {
    text-shadow: 0 0 16px;
    filter: brightness(300%);
  }
}

.greenNeonWithShadow {
    text-align: center;
    color: palegreen;
    text-shadow: 0 0 7px #014c02, 0 0 10px #000, 0 0 21px #000, 0 0 42px #0fa, 0 0 82px #0fa, 0 0 92px #0fa, 0 0 102px #00ff1a, 0 0 151px #0fa;
    position: relative;
    z-index: 1;
}
.yellowNeonWithShadow {
    text-align: center;
    color: #fff50c;
    text-shadow: 0 0 7px #4a4c01, 0 0 10px #4c1f09, 0 0 21px #000, 0 0 42px #fffc00, 0 0 82px #f3ff00, 0 0 92px #f7ff00, 0 0 102px #ffcb00, 0 0 151px #f6ff00;
    position: relative;
    z-index: 1;
}
.blueNeonWithShadow {
    text-align: center;
    color: #1ab9c7;
    text-shadow: 0 0 7px #0026ff, 0 0 10px #0054ff, 0 0 21px #000, 0 0 42px #00ffe7, 0 0 82px #00d5ff, 0 0 92px #00cbff, 0 0 102px #ffffff, 0 0 151px #00f2ff;
    position: relative;
    z-index: 1;
}

.preLaunchBackgroundImg {
    left: -28px;
    top: -101px;
    background-image: url(../../../images/donate/bubble.png);
    background-size: 220px 120px;
    background-repeat: no-repeat;
    position: relative;
    width: 220px;
    height: 120px;
    z-index: 1;
}
.preLaunchBackgroundText {
    position: absolute;
    top: 30px;
    left: 41px;
    color: green;
}

canvas {
  background: #041100bd;
  padding: 0;
  margin: auto;
  display: block;
  position: absolute;
  top: 55px;
  left: 0;
  right: 0;
}

.CVIconAmount {
    position: absolute;
    bottom: 0;
    right: 2px;
    font-family: Arial,Helvetica,sans-serif;
    font-size: 10px;
    font-weight: 700;
    z-index: 100;
    color: #fff;
    text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
}

.shakeImgDiv {
  /* Start the shake animation and make the animation last for 0.5 seconds */
  animation: shakeImg 3.5s;

  /* When the animation is finished, start again */
  /*animation-iteration-count: infinite;*/
}
@keyframes shakeImg {
  0% { transform: translate(1px, 1px) rotate(0deg); }
  10% { transform: translate(-1px, -2px) rotate(-1deg); }
  20% { transform: translate(-3px, 0px) rotate(1deg); }
  30% { transform: translate(3px, 2px) rotate(0deg); }
  40% { transform: translate(1px, -1px) rotate(1deg); }
  50% { transform: translate(-1px, 2px) rotate(-1deg); }
  60% { transform: translate(-3px, 1px) rotate(0deg); }
  70% { transform: translate(3px, 1px) rotate(-1deg); }
  80% { transform: translate(-1px, -1px) rotate(1deg); }
  90% { transform: translate(1px, 2px) rotate(0deg); }
  100% { transform: translate(1px, -2px) rotate(-1deg); }
}


.newFlagHot {
  position: relative;
  right: -18px;
  top: -4px;
}
.detailsButton {

}


.tooltipCustom {
  position: relative;
  display: inline-block;
  border-bottom: 1px dotted black;
}

.tooltipCustom .tooltiptextCustom {
  visibility: hidden;
  min-width: 400px;
  background-color: #ffffff;
  text-align: center;
  left: -160px;
  border-radius: 6px;
  padding: 5px 0;
  position: absolute;
  border-color: #151414;
  border-style: dashed;
  z-index: 99;
  cursor: help;
}

.tooltipCustom:hover .tooltiptextCustom {
  visibility: visible;
}
/* customs  */


.BulletPointList {
    list-style-type: none;
    padding-left: 20px;
}

.BulletPointList img {
    vertical-align: bottom;
    margin-right: 5px
}

.BulletPointList li {
    margin-bottom: 5px;
    padding-left: 17px;
    text-indent: -17px
}

.Bulletpoint {
    margin-top: 20px;
    margin-bottom: 8px
}

.BulletpointNoBottomMargin {
    margin-top: 20px
}

.Bulletpoint img,.BulletpointNoBottomMargin img {
    vertical-align: bottom;
    margin-right: 5px
}

.DownloadGreenButton {
  background-color: #04AA6D; /* Green */
  border: none;
  color: white !important;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  cursor: pointer;
}

.DownloadGreenButton:hover {
  background-color: #3e8e41;
  text-decoration: none !important;
  outline: 0;
}

.DownloadRedButton {
  background-color: #982800; /* red */
  border: none;
  color: white !important;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  cursor: pointer;
}

.DownloadRedButton:hover {
  background-color: #b0390f;
  text-decoration: none !important;
  outline: 0;
}



.LightBoxContentToHide {
    font-family: Verdana,Arial,Times New Roman,sans-serif
}

.LightBoxContentToHide a:link {
    color: #da761e;
    text-decoration: none
}

.LightBoxContentToHide a:visited {
    color: #da761e;
    text-decoration: none
}

.LightBoxContentToHide a:focus {
    color: #fff;
    text-decoration: none
}

.LightBoxContentToHide a:active {
    color: edb045;
    text-decoration: underline
}

.LightBoxContentToHide a:hover {
    color: #edb045;
    text-decoration: underline
}

.CustomerIdentification {
    position: relative;
    text-align: center;
    font-weight: 700;
    font-size: 12pt;
    margin-bottom: 35px
}

#DisplayEMail {
    cursor: pointer
}

.HideBeforeSubmit {
    display: none
}

#MaskedEMail {
  
}

#ReadableEMail {
  visibility: hidden;
}

#ButtonEMail {
    position: relative;
    right: 0;
    top: 2px;
    cursor: pointer
}

.CustomerIdentification #ButtonEMail {
    top: 5px;
    margin-left: auto;
    margin-right: auto;
    right: initial
}

#ProgressBar #Headline {
    text-align: center;
    font-size: 14pt;
    font-weight: 700;
    margin-bottom: 5px
}
.ProductCategoryTabRow {
  zoom:.606;
}

.ServiceID_Icon_Container {
    position: relative;
    width: 22%; /* 4 por linha */
    height: 145px;
    float: left;
    margin: 1%; /* 1% de margem entre quadrados */
}

.ServiceID_Icon_Container_Background {
    position: absolute;
    width: 180px;
    height: 220px;
    top: 3px;
    background-size: 180px 220px;
}

.ServiceID_Icon_Container_BackgroundSmall {
    position: absolute;
    width: 180px;
    height: 140px;
    top: 3px;
    background-size: 180px 140px;
}
.ServiceID_Icon_OverSmall {
    position: absolute;
    top: 0;
    left: 0;
    width: 180px;
    height: 140px;
    z-index: 97;
    background-size: 180px 140px;
}
.ServiceID_Icon_Container label {
    font-size: 8pt;
}

.ServiceID_Icon {
    position: relative;
    float: left;
    width: 180px;
    height: 147px;
    text-align: center;
    background-repeat: no-repeat;
    color: #fff;
    cursor: pointer
}

.ServiceID_Icon .ServiceID_Icon_Over {
    position: absolute;
    top: 0;
    left: 0;
    width: 180px;
    height: 147px;
    z-index: 97;
    background-size: 180px 147px;
}

.ServiceID_Icon .ServiceID_HelperDiv {
    position: relative;
    top: 0;
    left: 0;
    width: 180px;
    height: 147px;
    z-index: 399
}

.ServiceID_Icon .RibbonNewProduct {
    position: absolute;
    top: -4px;
    left: -4px;
    height: 58px;
    width: 58px;
    z-index: 199
}

.ServiceID_Icon .RibbonLastChance {
    position: absolute;
    top: -4px;
    left: 96px;
    height: 58px;
    width: 58px;
    z-index: 199
}

.PMCID_Icon {
    position: relative;
    background-size: 180px 147px;
    width: 180px;
    height: 147px;
    text-align: center;
    background-repeat: no-repeat;
    color: #fff;
    cursor: pointer;
}

.ServiceID_Icon_Container,.PMCID_Icon_Container {
    margin-left: auto;
    margin-right: auto
}

.PermanentDeactivated {
    position: absolute;
    left: 0;
    z-index: 400
}

.PermanentDeactivated .PMCID_Deactivated {
    position: relative;
    left: 0;
    background-size: 180px 140px;
    width: 180px;
    height: 100%;
}

.PermanentDeactivated .ServiceID_Deactivated {
    position: relative;
    left: 0;
    background-size: 180px 140px;
    width: 180px;
    height: 100%;
    z-index: 99999;
}

.customPacks {
    position: absolute; top: 75px; right: 15px;
}

.textShadow {
  color: white !important;
  text-shadow: -1px -1px 0 #051700, 0 -1px 0 #000, 1px -1px 0 #000, 1px 0 0 #000, 1px 1px 0 #000, 0 1px 0 #000, -1px 1px 0 #000, -1px 0 0 #000;
}

/* donate page  */


.showClass {
  background-image: url(../images/general/show.gif);
  background-repeat: no-repeat;
  width: 33px;
  height: 13px;
}

.hideClass {
  background-image: url(../images/general/hide.gif);
  background-repeat: no-repeat;
  width: 33px;
  height: 13px;
}

.center {
  text-align: center;
}

.creatureSquare {
  margin: 1px;
  width: 85.7px;
  height: 85px;
  float: left;
  position: relative;
  z-index: 150;
  cursor: help;
  background-color: #f1e0c5;
  border: 1px solid #5a2800;
  padding: 10px;
}

#AgreementsCheckbox {
  cursor: pointer;
}

.castleWarFlag {
  position: absolute;
  z-index: 90;
  left: -10px;
  top: -40px;
}
.videosFlag {
  position: absolute;
  z-index: 90;
  left: -9px;
  top: -35px;
  width: 30px;
}


.thingBonuses {
  font-family: monospace !important;
}

.upperCaseFirstsWords {
  text-transform: capitalize;
}

.HintBox {
  width: 100%;
  margin-top: -3px;
}

/* videos start */
/* Videos Box Slider */
#Themeboxes #VideosBox #VideosContentFrame {
position: relative;
height: 111px;
width: 170px;
top: -76px;
left: 0px;
margin-left: 5px;
margin-right: 5px;
border: 0;
cursor: pointer;
}

#Themeboxes #VideosBox #VideosContentContainer {
position: relative;
top: 35px;
left: 5px;
overflow: hidden; 
}

#Themeboxes #VideosBox #VideosContentContainer ul {
position: relative;
margin: -22px 0;
padding: 0;
list-style: none;
}

#Themeboxes #VideosBox #VideosContentContainer ul li {
position: relative;
display: block;
float: left;
margin: 0;
padding: 0;
width: 170px;
height: 108px;
}

#Themeboxes #VideosBox #VideosContentContainer .VideosNext,
#Themeboxes #VideosBox #VideosContentContainer .VideosPrev {
position: absolute;
top: 40%;
z-index: 5;
padding: 3%;
cursor: pointer;
}

#Themeboxes #VideosBox #VideosContentContainer .VideosNext {
right: 5px;
border-radius: 2px 0 0 2px;
background-image: url('images/themeboxes/videos/arrows.png')!important;
background-position: -26px -4px !important;
width: 15px;
height: 12px;
}

#Themeboxes #VideosBox #VideosContentContainer .VideosPrev {
  left: 5px;
  background-image: url('images/themeboxes/videos/arrows.png')!important;
  background-position: -2px -4px !important;
  width: 14px;
  height: 12px;
}

.VideosPlayButton {
  text-indent: 100vw; /*remove a fucking borda quando nao tem src*/
  background-image: url(images/themeboxes/videos/videos-play.png);
  background-repeat: no-repeat;
  background-size: 40px 40px;
  height: 40px;
  width: 41px;
  cursor: pointer;
  z-index: 50;
  position: absolute;
  left: 69px;
  top: 27%;
}
.VideosPlayButton:hover {
  background-image: url('images/themeboxes/videos/videos-play-hover.png');
}
.videosManagement {
  display: flex;
  justify-content: space-around;
  text-align: center;
}
#ScreenshotThumbnailContainerTable {
width: 100%;
}
.ScreenshotThumbnailContainer {
  position: relative;
  margin: 3px;
  padding: 3px;
  width: 232px;
  border: 1px solid #7B6E4C;
  color: #C9BDAB;
  display: inline-block;
}

.ScreenshotThumbnailContainer .VideosPlayButton {
  width: 40px;
  height: 40px;
  position: absolute;
  z-index: 6;
  top: 25%;
  left: 43%;
  opacity: 0.8;
}
.ScreenshotThumbnailContainer:hover .VideosPlayButton {
opacity: 1;
}
.ScreenshotThumbnailContainer .VideosPlayButton img {
width: 100%;
height: 100%;
border: none;
}

* html .ScreenshotThumbnailContainer {
display: inline;
}
.ScreenshotThumbnailContainer img {
border: 1px solid #7B6E4C;
width: 100%;
height: 100%;
}
.ScreenshotThumbnailContainer .ScreenshotText {
position: relative;
width: 230px;
height: 25px; /*75px*/
display: table; 
}
.ScreenshotThumbnailContainer .ScreenshotText p {
text-align: center;
}
.ScreenshotGalleryLink {
  position: relative;
}

.ScreenshotGalleryLink img.play {
  width: 150px;
  height: 150px;
  position: absolute;
  z-index: 20;
  top: -135px;
  left: 20%;
  border: none;
  opacity: 0.6;
}

.ScreenshotGalleryLink:hover img.play {
  opacity: 1;
}
img.sender_img {
  width: 54px;
  height: auto;
  border: none;
  position: absolute;
}

img.sender_list {
width: 64px;
height: auto;
border: none;
position: absolute;
left: 0;
top: 0;
}
#LightBox {
    min-width: 1280px;
    position: absolute;
    top: 0px;
    left: 0px;
    display: none;
    width: 100%;
    height: 300%;
    text-align: center;
    z-index: 200;
    /* to avoid a problem in chrome text selection is disabled */
    -webkit-user-select: none;
}
#LightBoxBackground {
position: absolute;
width: 100%;
height: 300%;
background-color: black;
z-index: 101;
}
#LightBoxContent {
position: fixed;
margin-top: 50px;
margin-left: auto;
margin-right: auto;
width: 100%;
z-index: 201;
}
* html #LightBoxBackground {
left: 0px;
}
* html #LightBoxContent {
position: absolute;
left: 0px;
/*top: expression( ( 10 + ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop ) ) + 'px' );*/
}
/* ------- */
/* TRAILER */
/* ------- */

#HiddenContentContainer {
position: absolute;
top: 0px;
width: 100%;
}
#HiddenContentContainer a {
color: #da761e;
font-family: Verdana, Arial, Times New Roman, sans-serif;
}
#HiddenContentContainer a:hover {
color: #edb045
}
#TibiaTrailerCloseContainer {
position: absolute;
right: -15px;
top: -15px;
cursor: pointer;
}
#TibiaTrailer img {
    width: 750px;
    height: 421px;
    margin-top: 13px;
}

#TibiaTrailerCloseContainer #TibiaTrailerCloseBackground {
width: 45px;
height: 45px;
}
#TibiaTrailerCloseContainer #TibiaTrailerCloseSymbol {
    position: absolute;
    top: 23px;
    left: 17px;
}

#TibiaTrailer {
    position: relative;
    height: 447px;
    width: 775px;
    margin-left: auto;
    margin-right: auto;
    z-index: 250;
    background-repeat: no-repeat;
    background-position: center;
}
#TibiaTrailer iframe {
    margin-top: 13px;
}

#HeaderCountDown img {
    margin-top: 13px;
    width: 217px;
}
#HeaderCountDown {
    position: absolute;
    z-index: 250;
    background-repeat: no-repeat;
    background-position: center;
    background-color: #000000ab;
    border-radius: 10px;
    margin: 0px;
    height: 100px;
    width: 350px;
    background-size: 350px 70px;
    border: 3px solid #ffffff;
}
#HeaderCountDown iframe {
    margin-top: 13px;
}
.countdownVideo {
    position: relative;
    overflow: hidden;
    height: 76px;
    border: 3px solid #ffffff;
    border-radius: 10px;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.5); /* Sombra */
    cursor: pointer; /* Cursor de ponteiro ao passar o mouse */
}
.countdownVideo:hover {
    transform: translateY(-2px); /* Leve movimento para cima ao passar o mouse */
}

.countdownStreamerNicks a {
    font-size: 14px;
    color: unset;
    text-decoration: auto;
    font-family: cursive;
}

.videoDiv {
    position: relative;
    width: 470px;
}

.video-text {
    font-family: cursive;
    text-align: center;
    font-size: 14px;
    color: white;
    text-shadow: -1px -1px 0 #000, 0 -1px 0 #000, 1px -1px 0 #000, 1px 0 0 #000, 1px 1px 0 #000, 0 1px 0 #000, -1px 1px 0 #000, -1px 0 0 #000;
}
.createAccountCountdown {

}
.createAccountButton {
    width: 150px;
    height: 34px;
    background-color: #2859db;
    border: 2px solid #ffffff;
    border-radius: 5px;
    transition: background-color 0.3s ease, transform 0.2s ease;
}
.createAccountButton:hover {
    background-color: #062d95; /* Cor de fundo azul mais escuro ao passar o mouse */
    transform: translateY(-2px); /* Leve movimento para cima ao passar o mouse */
}
.createAccountButton a {
    text-shadow: 0px 0px 0 #ffffff, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000, -1px 0 0 #0095ff, 0px 0px 0 #00a1ff;
    -webkit-text-fill-color: #ffffff73;
    text-decoration: auto;
    text-transform: uppercase;
}

/* videos end */

.Content .NewsCategoryIconSmall {
  position: absolute;
  top: 1px;
  left: 1px;
  height: 16px;
  width: 16px;
  background-repeat: no-repeat;
}

.Content .NewsImageLinkThumbnail {
  cursor: pointer;
}


.no-cross,.yes-tick,.partial-tick,.question-tick {
  font-weight: bold;
  text-shadow: 1px 0 0 #000,-1px 0 0 #000,0 1px 0 #000,0 -1px 0 #000,1px 1px #000,-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000;
}

.no-cross {
  color: #ff0000 !important;
}

.yes-tick {
  color: #00c900 !important;
}

.partial-tick {
  color: #e69500;
}

.question-tick {
  color: #808080;
}
.header {
    /*
    background-color: rgba(0, 0, 0, .7);
    -webkit-backdrop-filter: blur(1.5px);
    */    
    width: 100%;
    height: 90px;
    padding: 16px 28px;
    display: flex;
    justify-content: space-between;
    top: 0;
    position: fixed;
    z-index: 100;
    align-items: center;
    transition: background-color ease-in-out .2s;
    margin: 0 auto 20px
}

.header.active {
    min-width: 1280px;
    background-color: rgba(0,0,0,.7);
    -webkit-backdrop-filter: blur(1.5px);
    backdrop-filter: blur(1.5px);
    z-index: 200;
}


.header .left .logo {
    display: block;
    width: 160px;
    margin-top: 20px;
    background-repeat: no-repeat;
    background-size: contain;
}

.header .breadcrumbs a {
    color: #ffcf84;
    margin: auto;
}

.header .right {
    align-items: center
}
.header .right {
    display: inline-block;
    /* margin-right: 20px; */
    /*margin-top: 20px;*/
    /* float: right; */
}
.topHeaderMain {
    position: sticky;
    position: -webkit-sticky;
    top: 0; /* required to sticky */
    z-index: 800;

    font-family: fantasy;
    backdrop-filter: brightness(0.5);
    padding: 8px;
    border-radius: 6px;
    display: flex;
    gap: 3%;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin: 0px;
    margin-left: auto;
    margin-right: auto;
    padding: 0px;
}
.langMain {
  opacity: 0.8;
  position: relative;
  display: inline-block;
  cursor: pointer;
  text-align: right;
  z-index: 4;
}
.langMain:hover {    
  opacity: 1;
  background: rgba(215, 156, 88, .2);
}
.topHeaderMain a:hover {
  background: rgba(215, 156, 88, .2);
}


.box-demo {
    /*
    backdrop-filter: brightness(0.5);
    font-size: 14px;
    */
    font-family: fantasy;
    text-align: center;
    color: azure;
    z-index: 3;
    position: relative;
}

.conteudoCountdown {
    width: 70%; 
    display: flex;
    justify-content: center; 
}
.conteudoCountdown img {
    display: block;
    margin: 0 auto;
    left: -170px;
    top: -65px;
    position: absolute;
    z-index: 265;
}

.box-demo.layout {
    display: flex;
    justify-content: center;
    position: relative;
    top: 98px;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
}

.powerfulGuilds {
    display: flex;
    align-items: center;
    justify-content: space-around;
}
.powerfulStreamers {
    display: flex;
    align-items: center;
    justify-content: space-around;
}
.box-demoIntro {
    /*backdrop-filter: brightness(0.5);*/
    backdrop-filter: sepia(1);
    text-align: center;
    color: azure;
    font-family: fantasy;
    opacity: 1;
    z-index: 3;
    position: relative;
    min-height: 53px;
}


.btn {
    cursor: pointer;
    font-size: 16px;
    color: #ffedd2;
    display: block;
    transition: all ease-in-out .2s
}

.btn.active {
    color: #ffcf84
}

.btn:hover {
    color: yellow !important;
}

.btn.inverted {
    color: #ffcf84
}

.btn.inverted:hover {
    color: #ffedd2
}

#demoPrelaunchPT {
    min-height: 25px;
    text-align: center;
}
#demoPrelaunchENG {
    min-height: 25px;
    text-align: center;
}
#demoPT {
    /*text-shadow: 0px 0px 7px #1dc100;*/
    color: #00ff22;
    min-height: 27px;
    text-align: center;
    margin: auto;
    position: relative;
}
#demoENG {
    /*text-shadow: 0px 0px 7px #1dc100;*/
    color: #00ff22;
    min-height: 27px;
    text-align: center;
    margin: auto;
    position: relative;
}

.videoTop {
    position: fixed;
    overflow: hidden;
    width: 100%;
}

.videoOver {
    opacity: 0.3;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    /*opacity: 0.6;
    background-image: url(/intro/resources/images/back_ground_name.jpg);*/
    /*background: radial-gradient(#ff6d002b, #130801, rgb(10 4 0));*/
    background: radial-gradient(#000000, #003485, rgb(0 0 0));
    background-position: center;
    background-size: cover;
}

@media(max-width: 900px) {    
    .box-demo {
        min-width: 1200px;
        margin: auto;
        top: 20px;
        position: relative;
        text-align: center;
        color: lemonchiffon;
        font-family: TobiGreek, sans-serif;
        opacity: 1;
        z-index: 3;
        position: relative;
    }
    .box-demoIntro {
        margin: auto;
        top: 20px;
        position: relative;
        text-align: center;
        color: lemonchiffon;
        font-family: fantasy;
        opacity: 1;
        z-index: 3;
        position: relative;
    }
    
    #demoPT {
        margin: auto;
    }
    #demoENG {
        margin: auto;
    }
    .topHeaderMain {
        min-width: 1200px;
    }

    .videoTop {
        display: none;
    }
}




/*tradutor start*/
.flexItem {
    flex: 1 1 0;
    width: 0;
    color: #fff;
    text-decoration: none;
}
.flexItem:hover {
    background: rgba(215, 156, 88, .2);
    color: yellow;
}

.top_languages {
    flex: 1 1 0;
    width: 0;
    /*margin-left: 10px;
    position: absolute;*/
    display: inline-block;
    cursor: pointer;
    gap: 6px;
    color: #fff;
    font-weight: 400;
    text-decoration: none;
}
.top_languages ul {
    list-style: none;
}
.top_languages:hover .top_languages__sublist {
    visibility: visible;
    opacity: 1;
}
.top_languages:hover {
    background: rgba(215, 156, 88, .2);
    color: yellow;
}

.top_languages__sublist {
    z-index: 9999;
    position: absolute;
    top: 100%;
    /* right: -30px; */
    min-width: 139px;
    padding-left: 0px;
    padding-top: 5px;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    visibility: hidden;
    opacity: 0;
    transition: all .3s;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: stretch;
    -ms-flex-pack: stretch;
    justify-content: stretch;
}

.top_languages__sublist::before {
    content: "";
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 5px solid var(--navbar-color);
    position: absolute;
    bottom: calc(100% - 5px);
    left: 7px;
}

.top_languages__sublist.active {
    display: block
}

.top_languages__sublist li {
    background-color: var(--navbar-color);
    border-bottom: 1px solid rgb(88 88 88/25%);
    font-family: var(--font-family-paragraph);
    font-size: 16px;
    font-weight: 500;
    line-height: 21px;
    color: var(--yellow);
    transition: all .3s
}

.top_languages__sublist li:hover {
    background-color: rgba(27,29,31,.78)
}

.top_languages__sublist li a {
    padding: 4px 30px 4px 17px;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    width: 100%;
    gap: 15px;
    color: var(--light-gray)
}

.top_languages__sublist li a:hover {
    color: var(--lightest-gray)
}

.top_languages__sublist li a img {
    width: 16px;
    height: 16px
}

.top_languages__sublist li:first-child {
    border-top-left-radius: 6px;
    border-top-right-radius: 6px
}

.top_languages__sublist li:last-child {
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
    border-bottom: 0
}

.top_languages__sublist li span {
    padding: 11px 22px 13px 15px;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    width: 100%;
    gap: 19px;
    color: var(--light-gray);
    cursor: default
}
.dropdownTradutor {
  position: relative;
  display: inline-block;
}
/* Show the dropdown menu on hover */
.dropdownTradutor:hover .dropdown-content {
  display: block;
}
.dropDownBtn {
    width: 25px;
    border-radius: 5px;
    top: -1px;
    position: relative;
}
/* Change the background color of the dropdown button when the dropdown content is shown */
.dropdownTradutor:hover .dropDownBtn {
  background-color: #3e8e41;
}
/*tradutor end*/
/* https://isotropic.co/tool/hex-color-to-css-filter/ */
.filter-green{
    filter: invert(48%) sepia(79%) saturate(2476%) hue-rotate(86deg) brightness(118%) contrast(119%);
}
.filter-white{
    filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(108deg) brightness(104%) contrast(104%);
}

.backgroundGeneral {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;

    background-color: #051122;
    background-image: url("images/background.jpg"); /* coloque sua imagem */
    background-position: center top;
    background-repeat: no-repeat;
    background-size: cover;  /* cobre toda a tela */
    background-attachment: fixed; /* trava no viewport */
    z-index: -1; /* fica atrás do conteúdo */
}

.zoom-in-out-box {
  animation: zoom-in-zoom-out 1s ease infinite;
}

@keyframes zoom-in-zoom-out {
  0% {
    transform: scale(1, 1);
  }
  50% {
    transform: scale(1.2, 1.2);
  }
  100% {
    transform: scale(1, 1);
  }
}

.collapse {
    background-color: rgb(212, 192, 161);
}

#CapsLockWarning {
    position: absolute; top: 606.4px; 
    left: 401.2px; 
    width: 175px; 
    background-color: white; 
    color: black; 
    border: 1px solid grey; 
    text-align: left; 
    font-size: 10pt; 
    font-family: Verdana, Arial, 'Times New Roman', sans-serif; 
    padding: 8px; 
    z-index: 1000; 
    display: none;
}

#CapsLockWarning img {
    width: 15px; height: 13px; float: left; margin-right: 5px;
}

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




*,*::before,*::after {
    box-sizing: border-box;
}

html,body,p,ol,ul,li,dl,dt,dd,blockquote,figure,fieldset,legend,textarea,pre,iframe,hr,h1,h2,h3,h4,h5,h6,button,input,select {
    margin: 0;
    /*padding: 0;*/
}

h1,h2,h3,h4,h5,h6 {
    font-size: 100%;
    font-weight: normal
}

ul {
    /*list-style: none;*/
}

html {
    box-sizing: border-box
}

img,video {
    /*height: auto;*/
    /*max-width: 100%;*/
}

iframe {
    border: 0
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

td,th {
    padding: 0
}

input,select,textarea,button {
    font-family: inherit
}

a {
    text-decoration: none
}

.f-tobi {
    font-family: TobiGreek,sans-serif
}

body.footer-hidden {
    overflow-y: hidden
}

body.footer-hidden #footer {
    display: none
}

#footer {
    background-color: #323232;
    box-shadow: inset 0 7px 30px rgba(0,0,0,.2);
    padding: 0px 40px 60px;
    display: flex;
    flex-direction: column;
    font-size: 12px;
    color: rgb(255 255 255 / 90%);
    position: relative;
}

#footer img {
    opacity: .3;
    transition: opacity 150ms ease
}

#footer .farlusion-logo {
    opacity: 0.5;
}

#footer .farlusion-logo:hover {
    opacity: 1
}

#footer a {
    color: rgba(255,255,255,.3);
    transition: color 150ms ease
}

#footer a:hover {
    color: #fff
}

#footer a:hover img {
    opacity: 1
}

#footer .top {
    display: flex;
    align-items: center
}

#footer .top .community .title {
    margin-bottom: 6px
}

#footer .top .community ul {
    display: flex
}

#footer .top .community ul li {
    margin-left: 15px
}

#footer .top .community ul li:first-child {
    margin-left: 0
}

#footer .top .community ul img {
    width: 24px
}

@media only screen and (max-width: 1200px) {
    #footer .top {
        flex-direction:column;
        text-align: center
    }

    .passwordStrength {
        width: 206px;
        position: relative;
        top: 0px;
        right: 0px;
    }
}

#footer #language-selector-bottom {
    user-select: none;
    text-transform: uppercase
}

#footer #language-selector-bottom ul {
    display: flex
}

#footer #language-selector-bottom ul li {
    margin-left: 2px
}

#footer #language-selector-bottom ul li:first-child {
    margin-left: 0
}

#footer #language-selector-bottom ul a,#footer #language-selector-bottom ul span {
    width: 21px;
    height: 21px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 2px
}

#footer #language-selector-bottom ul a:hover {
    background-color: rgba(255,255,255,.3);
    color: #fff
}

#footer #language-selector-bottom ul span {
    background-color: rgba(255,255,255,.3);
    color: #323232
}

@media only screen and (max-width: 1200px) {
    #footer #language-selector-bottom {
        margin-top:20px
    }
}

#footer .bottom {
    border-top: 1px solid #4b4b4b;
    padding-top: 30px;
    margin-top: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
}

#footer .bottom .links {
    margin: 0 auto;
    position: relative
}

#footer .bottom .links>ul {
    display: flex
}

#footer .bottom .links>ul>li {
    margin-left: 50px
}

#footer .bottom .links>ul>li:first-child {
    margin-left: 0
}

@media only screen and (max-width: 1200px) {
    #footer .bottom .links>ul {
        flex-direction:column
    }

    #footer .bottom .links>ul>li {
        margin-left: 0;
        margin-top: 10px
    }
}

@media only screen and (max-width: 1200px) {
    #footer .bottom .links {
        margin-top:20px
    }
}

@media(max-width: 767px) {
    #footer .bottom {
        flex-direction:column;
        border-top: none;
        padding-top: 60px
    }

    #footer .bottom a {
        order: 1;
        margin-bottom: 10px
    }

    #footer .bottom a:first-child {
        order: 2
    }

    #footer .bottom .links {
        order: 3
    }
}

@media only screen and (max-width: 1200px) {
    #footer {
        padding-left:40px;
        padding-right: 40px
    }
}

#language-selector-top {
    user-select: none;
    position: absolute;
    top: 20px;
    right: 20px;
    z-index: 3
}
.lang {
    opacity: 0.5;
    position: relative;
    display: inline-block;
    cursor: pointer;
    text-align: right;
    z-index: 4;
}
.lang .current {
    display: block;
    width: 112px;
    text-decoration: none;
    line-height: 30px;
    color: #ffffff;
    opacity: 0.7;
}
#language-selector-top .container {
    position: relative
}

#language-selector-top .selected {
    background-color: #fff;
    display: inline-block;
    border-radius: 8px;
    font-weight: 400;
    font-size: 20px;
    line-height: 1;
    padding: 7px 8px 4px;
    color: #4a4a4a;
    text-transform: uppercase;
    cursor: pointer;
    transition: box-shadow 150ms ease
}

#language-selector-top .selected:hover {
    box-shadow: 0 2px 10px rgba(0,0,0,.25)
}

#language-selector-top .selected:active {
    box-shadow: none
}

#language-selector-top ul {
    height: 0;
    width: 0;
    opacity: 0;
    box-shadow: 0 10px 30px rgba(0,0,0,.2);
    border-radius: 8px;
    background-color: #fff;
    position: absolute;
    right: 0;
    top: 0;
    font-weight: 400;
    font-size: 0;
    transition: opacity 150ms ease;
    color: #4a4a4a;
    display: flex;
    flex-direction: column
}

#language-selector-top ul li {
    display: flex;
    flex-direction: column
}

#language-selector-top ul.active {
    width: auto;
    height: auto;
    padding: 20px;
    opacity: 1;
    font-size: 14px
}

#language-selector-top ul a {
    color: #4a4a4a;
    padding: 4px 8px;
    border-radius: 4px;
    transition: background-color 150ms ease
}

#language-selector-top ul a:hover {
    background-color: rgba(74,74,74,.2)
}

#wr {
    /*min-height: 100vh;*/
    min-height: 65vh;
}

.lang .popup {
    position: absolute;
    z-index: 10;
    top: 40px;
    right: -15px;
    width: 100%;
    height: auto;
    min-width: 300px;
    max-width: 300px;
    min-height: 75px;
    background-color: #ffffff;
    border-radius: 4px;
    display: none;
    flex-direction: row;
    flex-wrap: nowrap;
}

.translatorIntro {
    /* backdrop-filter: brightness(0.5); */
    padding: 12px;
    border-radius: 6px;
    display: flex;
    gap: 10px;
    /* width: 100%; */
    flex-direction: row-reverse;
}

.lang:hover {    
    opacity: 1;
    background: rgba(215, 156, 88, .2);
}

body.no-scroll {
    height: 100vh;
    position: fixed
}

.breadcrumbs .shortcuts {
    display: flex
}

.breadcrumbs .shortcuts a {
    font-family: 'Playfair Display', serif;
    font-weight: 700;
    color: #fbe9be;
    text-transform: uppercase;
    transition: background-color ease-in-out .3s;
    padding: 12px;
    border-radius: 4px
}

.breadcrumbs .shortcuts a.active {
    color: #fff
}

.breadcrumbs .shortcuts a:hover {
    background: rgba(215,156,88,.2)
}

.breadcrumbs .shortcuts a.pressing {
    background: rgba(215,156,88,.4)
}

.breadcrumbs .shortcuts a.important {
    display: flex;
    align-items: center;
    margin-right: 26px;
    position: relative
}

.breadcrumbs .shortcuts a.important:after {
    display: block;
    font-family: hw-icons,sans-serif;
    content: "";
    position: absolute;
    right: -26px;
    font-size: 24px;
    top: 7px;
    transform: rotate(-90deg)
}

.burger {
    display: none;
    margin-left: 20px
}

.burger:after {
    content: "";
    font-family: hw-icons,sans-serif;
    font-size: 34px
}

.left {
    /*order: 1;*/
    width: 33%;
}
.right {
    /*order: 1;*/
    width: 33%;
}
.breadcrumbs {
    /*order: 1;*/
    width: 33%;
}

@media(max-width: 1010px) {
    .main-header {
        justify-content:space-between
    }

    .breadcrumbs {
        /*display: none;*/
    }

    .left {
        /*order: 1;*/
        width: 100%;
    }

    .left .logo {
        width: 120px;
        height: 48px
    }

    .right {
        order: 2
    }

    .right .burger {
        display: block
    }
}

@media(max-width: 452px) {
    .header {
        height:60px
    }

    .left .logo {
        /*
        width: 80px;
        height: 32px;*/

        top: -15px;
        margin-top: 0px !important;
        position: relative;
    }

    .right .burger {
        margin-left: 10px
    }
}

.burger-overlay {
    display: none;
    position: fixed;
    height: 100vh;
    z-index: 100;
    top: 0;
    left: 0;
    width: 100%;
    background: linear-gradient(180deg, rgba(18, 19, 23, 0.9) 0%, rgba(18, 19, 23, 0.54) 100%);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px)
}

.burger-overlay .cta-button {
    margin: 0 auto
}

.burger-overlay .overlay-top {
    display: flex;
    justify-content: space-between;
    padding: 10px 30px;
    align-items: center;
    margin-bottom: 30px
}

@media(max-width: 450px) {
    .burger-overlay .overlay-top {
        padding:10px
    }
}

.burger-overlay .logo {
    display: block;
    width: 160px;
    height: 64px;
    background-repeat: no-repeat;
    background-size: contain
}

.burger-overlay .closer {
    justify-content: flex-end;
    display: flex;
    margin-bottom: 10px;
    margin-right: 10px;
    width: 25%
}

.burger-overlay .closer:after {
    content: "";
    font-family: hw-icons,sans-serif;
    font-size: 22px
}

.burger-overlay.active {
    display: block;
    animation-name: appearing-overlay;
    animation-duration: 300ms
}

.burger-overlay .contents {
    display: flex;
    flex-direction: column;
    width: 100%;
    text-align: center
}

.burger-overlay .contents .shortcuts {
    display: flex;
    flex-direction: column
}

.burger-overlay .contents .shortcuts a {
    color: #fbe9be;
    text-transform: uppercase;
    margin-bottom: 20px;
    font-size: 16px;
    font-style: normal;
    font-family: TobiGreek,sans-serif;
    font-weight: 400;
    line-height: 20px
}

@keyframes appearing-overlay {
    0% {
        left: -100%
    }

    100% {
        left: 0
    }
}

.cta-button {
    padding: 12px 24px;
    /* green
    border: 2px solid rgba(188,255,81,.5);
    background: linear-gradient(180deg, #a9f036 0%, #5aad11 100%);
    */
    border: 2px solid rgb(255 221 0 / 50%);
    background: linear-gradient(109.6deg, rgb(255, 207, 84) 11.2%, rgb(255, 158, 27) 91.1%);
    font-family: fantasy;
    font-size: 18px;
    border-radius: 4px;
    color: #121317;
    position: relative
}

.cta-button:before {
    opacity: 0;
    border: 2px solid rgba(77,125,1,.5);
    transition: opacity ease-in-out .2s;
    background: linear-gradient(180deg, #8ccd22 0%, #59ac10 100%);
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 4px;
    z-index: 3
}

.cta-button:after {
    opacity: 0;
    transition: opacity ease-in-out .2s;
    /*green
    background: linear-gradient(182deg, #beff54 1.6%, #6bc61b 98.39%);
    */
    border: 2px solid rgb(255 134 0);
    background: linear-gradient(355deg, rgb(255 213 0) 11.2%, rgb(255 147 0) 91.1%);

    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 4px;
    z-index: 2
}

.cta-button span {
    z-index: 4;
    position: relative
}

.cta-button.pressing:before {
    opacity: 1
}

.cta-button:hover:after {
    opacity: 1
}

#footer {
    background-color: #171819;
    box-shadow: none
}

#footer {
    margin-top: auto;
    background-color: rgba(0,0,0,0)
}

html {
    font-family: "Roboto Condensed",sans-serif;
    font-size: 18px;
    line-height: 1.3;
    color: #fbe9be;
    scroll-behavior: smooth
}

@media only screen and (max-width: 766px) {
    html {
        font-size:14px
    }
}

body.no-shadow .left-shadow,body.no-shadow .right-shadow {
    display: none
}

body .header {
    z-index: 4;    
}

body #wr {
    z-index: 2
}

.c-yellow {
    color: #f8c83e
}

.c-green {
    color: #44c826
}

.pre-content {
    max-width: 1040px;
    margin-left: auto;
    margin-right: auto;
    padding: 10px 0 0;
    width: 100%
}

.pre-content .pre-title {
    color: #fbe9be;
    font-size: 18px
}

.pre-content .title {
    font-size: 48px;
    color: #fff;
    text-transform: uppercase;
    font-family: TobiGreek,sans-serif
}

#footer {
    z-index: 6;    
    margin-top: 20px;
}

.types-dropdown .dropdown-content .btn:before {
    display: none
}

.sub-header {
    display: flex;
    max-width: 1040px;
    margin-left: auto;
    margin-right: auto;
    padding: 10px 0 0;
    width: 100%;
    height: 70px
}

.sub-header .navbar {
    text-align: center;
    display: flex;
    height: 100%
}

.sub-header .navbar .search {
    display: flex;
    align-items: center;
    position: relative;
    border-radius: 4px;
    transition: background-color ease-in-out 200ms;
    padding: 10px 30px 10px 15px;
    height: 49px
}

.sub-header .navbar .search.empty .search-bar {
    width: 25px
}

.sub-header .navbar .search.empty .closer {
    display: none
}

.sub-header .navbar .search:hover,.sub-header .navbar .search.focused {
    background-color: rgba(215,156,88,.2)
}

.sub-header .navbar .search .search-hint {
    color: #fbe9be;
    font-family: TobiGreek, sans-serif;
    text-transform: uppercase;
    font-size: 20px;
    cursor: pointer;
    opacity: 0.9;
}

.sub-header .navbar .search .search-hint.hidden {
    display: none
}

.sub-header .navbar .search .closer {
    display: block;
    position: absolute;
    cursor: pointer;
    right: 38px;
    top: 24%
}

.sub-header .navbar .search .closer:hover:after {
    color: #fbe9be
}

.sub-header .navbar .search .closer:after {
    content: "";
    font-family: hw-icons,sans-serif;
    color: rgba(251,233,190,.5019607843);
    transition: color ease-out .3s;
    display: block;
    height: 25px;
    width: 25px;
    top: 0;
    position: absolute;
    z-index: 5
}

.sub-header .navbar .search .search-btn {
    font-family: hw-icons,sans-serif;
    font-size: 18px;
    line-height: 50px;
    color: #fbe9be
}

.sub-header .navbar .search .search-btn:before {
    content: ""
}

.sub-header .navbar .search .search-bar {
    display: none;
    height: 80%;
    border-radius: 2px;
    border: none;
    padding: 12px;
    background: none;
    font-size: 20px;
    font-family: TobiGreek,sans-serif;
    text-transform: uppercase;
    color: #ffedd2;
    width: min-content;
    position: relative
}

.sub-header .navbar .search .search-bar:focus {
    outline: none
}

.sub-header .navbar .search .search-bar.active {
    display: block
}

.sub-header .types-dropdown,.sub-header .classes-dropdown {
    margin-left: auto;
    cursor: pointer;
    height: 100%
}

.sub-header .types-dropdown.active .dropdown-content,.sub-header .classes-dropdown.active .dropdown-content {
    display: flex
}

.sub-header .types-dropdown.active .dropdown-text,.sub-header .classes-dropdown.active .dropdown-text {
    background-color: rgba(215,156,88,.4)
}

.sub-header .types-dropdown.active .dropdown-text:after,.sub-header .classes-dropdown.active .dropdown-text:after {
    transform: rotate(180deg)
}

.sub-header .types-dropdown .dropdown-text,.sub-header .classes-dropdown .dropdown-text {
    height: 44px;
    line-height: 50px;
    font-family: TobiGreek,sans-serif;
    text-transform: uppercase;
    color: #fbe9be;
    position: relative;
    border-radius: 4px;
    transition: background-color ease-in-out 200ms;
    display: flex;
    align-items: center;
    padding: 0 40px 0 40px
}

.sub-header .types-dropdown .dropdown-text span,.sub-header .classes-dropdown .dropdown-text span {
    font-size: 20px
}

.sub-header .types-dropdown .dropdown-text:after,.sub-header .classes-dropdown .dropdown-text:after {
    content: "";
    font-family: hw-icons,sans-serif;
    font-size: 24px;
    right: 10px;
    transition: color ease .1s,transform ease .5s;
    position: absolute
}

.sub-header .types-dropdown .dropdown-text:hover,.sub-header .classes-dropdown .dropdown-text:hover {
    background-color: rgba(215,156,88,.2)
}

.sub-header .types-dropdown .dropdown-text:before,.sub-header .classes-dropdown .dropdown-text:before {
    font-size: 22px;
    font-family: hw-icons,sans-serif;
    left: 11px;
    transition: all ease-in-out .2s;
    position: absolute
}

.sub-header .types-dropdown .dropdown-text.all_class :before,.sub-header .classes-dropdown .dropdown-text.all_class :before {
    display: none
}

.sub-header .types-dropdown .dropdown-text.control:before,.sub-header .classes-dropdown .dropdown-text.control:before {
    content: ""
}

.sub-header .types-dropdown .dropdown-text.pvp:before,.sub-header .classes-dropdown .dropdown-text.pvp:before {
    content: ""
}

.sub-header .types-dropdown .dropdown-text.mage:before,.sub-header .classes-dropdown .dropdown-text.mage:before {
    content: ""
}

.sub-header .types-dropdown .dropdown-text.marksman:before,.sub-header .classes-dropdown .dropdown-text.marksman:before {
    content: ""
}

.sub-header .types-dropdown .dropdown-text.control:before,.sub-header .classes-dropdown .dropdown-text.control:before {
    content: ""
}

.sub-header .types-dropdown .dropdown-text.healer:before,.sub-header .classes-dropdown .dropdown-text.healer:before {
    content: ""
}

.sub-header .types-dropdown .dropdown-text.support:before,.sub-header .classes-dropdown .dropdown-text.support:before {
    content: ""
}

.sub-header .types-dropdown .dropdown-text.opvp:before,.sub-header .classes-dropdown .dropdown-text.opvp:before {
    content: ""
}

.sub-header .types-dropdown .dropdown-content,.sub-header .classes-dropdown .dropdown-content {
    display: none;
    border-radius: 4px;
    box-shadow: 0 55px 84px 0 rgba(18,19,23,.6);
    padding: 24px;
    background: #fff;
    z-index: 10;
    flex-direction: column;
    position: absolute;
    align-items: center
}

.sub-header .types-dropdown .dropdown-content .btn,.sub-header .classes-dropdown .dropdown-content .btn {
    margin-bottom: 4px;
    width: 170px;
    color: #121317;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    padding: 6px 8px;
    line-height: 20px;
    display: flex;
    align-items: center
}

.sub-header .types-dropdown .dropdown-content .btn:hover,.sub-header .classes-dropdown .dropdown-content .btn:hover {
    background: rgba(215,156,88,.2)
}

.sub-header .types-dropdown .dropdown-content .btn:focus-within,.sub-header .classes-dropdown .dropdown-content .btn:focus-within {
    background: rgba(215,156,88,.4)
}

.sub-header .types-dropdown .dropdown-content .btn:before,.sub-header .classes-dropdown .dropdown-content .btn:before {
    content: "";
    font-size: 24px;
    font-family: hw-icons,sans-serif;
    left: 15px;
    transition: all ease-in-out .2s;
    font-weight: 400;
    width: 26px;
    margin-right: 8px
}

.sub-header .types-dropdown .dropdown-content .btn.control:before,.sub-header .classes-dropdown .dropdown-content .btn.control:before {
    content: ""
}

.sub-header .types-dropdown .dropdown-content .btn.pvp:before,.sub-header .classes-dropdown .dropdown-content .btn.pvp:before {
    content: "";
    margin-left: -2px;
    margin-right: 10px
}

.sub-header .types-dropdown .dropdown-content .btn.mage:before,.sub-header .classes-dropdown .dropdown-content .btn.mage:before {
    content: ""
}

.sub-header .types-dropdown .dropdown-content .btn.marksman:before,.sub-header .classes-dropdown .dropdown-content .btn.marksman:before {
    content: ""
}

.sub-header .types-dropdown .dropdown-content .btn.control:before,.sub-header .classes-dropdown .dropdown-content .btn.control:before {
    content: ""
}

.sub-header .types-dropdown .dropdown-content .btn.healer:before,.sub-header .classes-dropdown .dropdown-content .btn.healer:before {
    content: ""
}

.sub-header .types-dropdown .dropdown-content .btn.support:before,.sub-header .classes-dropdown .dropdown-content .btn.support:before {
    content: ""
}

.sub-header .types-dropdown .dropdown-content .btn.opvp:before,.sub-header .classes-dropdown .dropdown-content .btn.opvp:before {
    content: ""
}

.right-shadow,.left-shadow {
    top: 0;
    background: linear-gradient(270deg, #121317 21.85%, rgba(18, 19, 23, 0.6) 60%, rgba(18, 19, 23, 0) 100%);
    position: absolute;
    height: 100%;
    width: calc((100vw - 1040px)/3);
    z-index: 3;
    display: flex;
    max-height: 1350px
}

.right-shadow .holder,.left-shadow .holder {
    width: 100%;
    display: flex;
    margin: auto 0
}

.right-shadow.hidden-arrow .dir-arrow,.left-shadow.hidden-arrow .dir-arrow {
    display: none
}

.right-shadow .dir-arrow,.left-shadow .dir-arrow {
    width: 76px;
    height: 72px;
    background-image: url(https://hwlandings-a.akamaihd.net/hwp/p/assets/e77b476b37a8a22696c8.webp);
    background-size: contain;
    transition: filter ease-in-out .2s;
    cursor: pointer;
    margin: auto auto auto 10px;
    background-repeat: no-repeat
}

.right-shadow .dir-arrow:hover,.left-shadow .dir-arrow:hover {
    filter: brightness(1.4)
}

.left-shadow {
    transform: rotate(180deg)
}

.right-shadow {
    right: 0
}

.char-name {
    text-shadow: -1px -1px 6px #000, 1px -1px 0 #000000, -1px 1px 0 #000, 1px 1px 0 #000;
    font-size: 24px;
    line-height: 24px;
    font-weight: 400;
    text-align: center
}

.burger {
    display: none !important
}

.char-node {
    position: relative;
    cursor: pointer;
    /*width: 134px;*/
    width: 300px;
    height: 463px;
    margin-bottom: 10px;
    margin-left: 15px;
    color: #ffcf84;
    z-index: 3;
    transition: all cubic-bezier(0.08, 0.35, 0, 1) .5s
}

.char-node .impostor-icon {
    position: absolute;
    transition: all cubic-bezier(0.08, 0.35, 0, 1) .5s;
    width: 100%;
    padding: 4px;
    display: flex;
    right: 0;
    align-items: center;
    justify-content: center;
    top: -9.8%;
    height: 90px;
    color: #fbe9be;
    text-align: center;
    z-index: 6
}

.char-node .impostor-icon:after {
    font-family: hw-icons,sans-serif;
    color: #fbe9be;
    font-size: 28px
}

.char-node .impostor-icon.opvp::after {
    content: ""
}

.char-node .impostor-icon.healer::after {
    content: ""
}

.char-node .impostor-icon.control::after {
    content: ""
}

.char-node .impostor-icon.marksman::after {
    content: ""
}

.char-node .impostor-icon.pvp::after {
    content: ""
}

.char-node .impostor-icon.mage::after {
    content: ""
}

.char-node .impostor-icon.support::after {
    content: ""
}

.char-node .glow {
    display: none;
    opacity: 0;
    background-image: url(https://hwlandings-a.akamaihd.net/hwp/p/assets/f87c7ed2dc1d206e93b6.webp);
    position: absolute;
    top: -14.5%;
    left: -11%;
    width: 123%;
    z-index: -1;
    height: 119%;
    transition: all cubic-bezier(0.08, 0.35, 0, 1) .5s;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center
}

.char-node .explore {
    color: #fbe9be;
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    opacity: 0;
    position: absolute;
    bottom: 14%;
    width: 100%;
    left: 0;
    transition: all cubic-bezier(0.08, 0.35, 0, 1) .5s;
    z-index: 6
}

.char-node.shadow {
    opacity: .5
}

.char-node .char-hover {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 10
}

.char-node.hover {
    background-color: rgba(0,0,0,0);
    margin-top: -30px;
    margin-bottom: 30px;
    filter: drop-shadow(0px 0px 25px rgba(215, 156, 88, 0.7));
    z-index: 4
}

.char-node.hover .explore {
    opacity: 1;
    bottom: 18%
}

.char-node.hover .char-hover {
    height: 110%;
    top: 0
}

.char-node.hover .impostor-icon {
    transform: scale(2.5);
    opacity: 0
}

.char-node.hover .glow {
    opacity: 1
}

.char-node.hover .char-name {
    color: #fff
}

.char-node.hidden {
    display: none
}

.char-node::after {
    font-family: hw-icons,sans-serif;
    position: absolute;
    transition: all ease-in-out .5s;
    width: 90px;
    padding: 4px;
    display: flex;
    right: 16.3%;
    align-items: center;
    justify-content: center;
    color: #ffedd2;
    top: -9.8%;
    height: 90px;
    background-image: url('/intro/resources/images/balloon.webp');
    background-repeat: no-repeat;
    background-size: contain;
    font-size: 28px;
    text-align: center;
    z-index: 4
}

.char-node.opvp::after {
    content: ""
}

.char-node.healer::after {
    content: ""
}

.char-node.control::after {
    content: ""
}

.char-node.marksman::after {
    content: ""
}

.char-node.pvp::after {
    content: ""
}

.char-node.mage::after {
    content: ""
}

.char-node.support::after {
    content: ""
}

@media(max-width: 900px) {  
    .char-node:before {
        content: "";
        position: absolute;
        display: none;
        width: 100%;
        z-index: 3;
        background-repeat: no-repeat;
        height: 100%;
        background-image: none;
        background-size: 0px 0px !important;
    }    
}

.char-node:before {
    content: "";
    position: absolute;
    display: block;
    width: 100%;
    z-index: 3;
    background-repeat: no-repeat;
    height: 100%;
    background-image: url('/intro/resources/images/moldura_banner_effect.png');
    background-size: contain;
}

.char-node .char-picture {
    width: auto;
    height: 100%;
    transition: all cubic-bezier(0.08, 0.35, 0, 1) .5s;
    -webkit-mask-image: url('/intro/resources/images/moldura_banner.png');
    mask-image: url('/intro/resources/images/moldura_banner.png')
    position: relative;
}

.char-node .char-name {
    position: absolute;
    bottom: 22%;
    font-size: 24px;
    transition: all cubic-bezier(0.08, 0.35, 0, 1) .5s;
    font-weight: 400;
    width: 100% !important;
    text-align: center;
    color: #feebcd;
    z-index: 4;
    text-transform: uppercase
}

.char-node .char-name span {
    position: relative;
    z-index: 2
}

#wr {
    display: flex;
    flex-direction: column;
    position: relative;
    overflow-x: clip
}

#wr .sub-header {
    z-index: 3
}

#wr .content {
    position: relative;
    top: -30px;
    padding-top: 30px;
    z-index: 0;
    max-width: 100vw;
    overflow-x: scroll;
    /*margin-bottom: 100px;*/
}

#wr .content.no-over {
    overflow-x: clip
}

#wr .content.no-over:after {
    display: none
}

#wr .content .holder {
    overflow: visible
}

#wr .content .characters {
    padding: 90px 30px;
    margin: 0 calc((100vw - 1080px)/2);
    /*width: max-content;*/
    display: flex;
    justify-content: center;
    gap: 60px;
}

#wr .content .characters.dragging a {
    pointer-events: none
}

#wr .content .characters a:first-child {
    margin-left: 0
}


.container {
    position: relative;
    padding: 90px 0
}

.container:first-child {
    margin-bottom: 0
}

@media only screen and (max-width: 1200px) {
    .container {
        padding:60px 0
    }
}

@media only screen and (max-width: 766px) {
    .container {
        padding:40px 0
    }
}

@media only screen and (max-width: 420px) {
    .container {
        padding:20px 0
    }
}

.content-wr {
    margin-left: auto;
    margin-right: auto;
    padding-left: 20px;
    padding-right: 20px;
    justify-content: center;
    align-items: center;
    display: flex
}

.content-wr.min {
    max-width: 1104px
}

.cta {
    max-width: 563px;
    padding-top: 50px;
    padding-bottom: 50px
}

@media only screen and (max-width: 1200px) {
    .cta {
        padding-top:20px;
        padding-bottom: 20px
    }
}

.bottom-cta {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 30px 0
}

.bottom-cta .btn {
    margin: 0 20px
}

.bottom-cta .btn span {
    padding-left: 40px;
    padding-right: 40px
}

h2 {
    font-size: 64px;
    margin: 0 auto 40px
}

.container {
    display: flex;
    flex-direction: column
}

.container.intro {
    background: #cecece
}

.container.intro .content-wr {
    flex-direction: column
}

.container.intro .header {
    display: flex;
    flex-direction: column;
    align-items: center
}

.container.intro .header h1 {
    display: flex;
    align-items: center;
    text-transform: uppercase;
    text-align: center;
    color: #fff;
    font-size: 80px
}

.container.intro .header h1 span {
    display: block;
    margin: 0 20px
}

@media only screen and (max-width: 1200px) {
    .container.intro .header h1 {
        font-size:32px
    }
}

.container.intro .header .subtitle {
    max-width: 510px;
    text-align: center;
    margin: 14px 0 30px
}

.container.opportunities .block-content {
    display: flex;
    justify-content: space-between
}

.container.opportunities .block {
    height: 290px;
    width: 290px;
    background-color: #cecece;
    display: flex
}

.container.opportunities .block .text {
    margin: auto auto 40px;
    font-size: 24px;
    width: 240px
}

.container.guardians .block-content {
    width: 90%;
    background-color: #cecece;
    height: 784px;
    position: relative;
    display: flex;
    justify-content: center;
    margin: 0 auto
}

.container.guardians .block-content .block {
    display: none;
    width: 100%;
    height: 100%;
    flex-direction: column;
    align-items: center
}

.container.guardians .block-content .block h3 {
    margin-top: 80px;
    margin-bottom: 50px;
    font-size: 48px
}

.container.guardians .block-content .block.active {
    display: flex
}

.container.guardians .block-content .selectors {
    bottom: 5%;
    position: absolute;
    width: 60%;
    display: flex;
    justify-content: space-between
}

.container.guardians .block-content .selectors .selector {
    background-color: #fff;
    width: 160px;
    height: 160px;
    cursor: pointer
}

.container.guardians .block-content .selectors .selector:hover {
    border: 8px solid gray
}

.container.guardians .block-content .selectors .selector.active {
    border: 8px solid #000
}

.container.titans {
    background: #cecece;
    display: flex;
    align-items: center;
    flex-direction: column
}

.types-dropdown {
    display: none
}

@media(max-width: 1160px) {
    .content:after {
        display:none !important
    }

    .left-shadow,.right-shadow {
        background: none;
        width: calc((100vw - 740px)/2)
    }

    .left-shadow.hidden-arrow,.right-shadow.hidden-arrow {
        display: none
    }

    .characters,.pre-content,.sub-header {
        padding-left: 20px;
        padding-right: 20px
    }

    #custom-scrollbar {
        left: 17%
    }
}

@media(max-width: 975px) {
    #custom-scrollbar {
        display: none; /*caso tenha mais de 2 servers, dar display aqui*/
        left:5%;
        width: 90%
    }

    #wr .content .characters {
        margin: 0;
        padding: 100px 50px
    }
}

@media(max-width: 1010px) {
    .classes-dropdown {
        padding-left:0
    }

    .sub-header {
        flex-wrap: wrap;
        height: auto
    }

    .sub-header .navbar {
        width: 100%
    }

    .sub-header .navbar .search {
        width: 100%
    }

    .sub-header .navbar .search .search-hint {
        color: #fbe9be;
        font-size: 20px !important
    }

    .sub-header .types-dropdown .dropdown-text {
        padding: 0 40px 0 10px
    }

    #wr .content .characters {
        padding: 70px 20px
    }

    .sub-header .types-dropdown,.sub-header .classes-dropdown {
        margin-left: 20px
    }

    .types-dropdown {
        display: block
    }

    .types-dropdown .dropdown-content {
        left: 2%
    }

    .types-dropdown .dropdown-content .btn {
        padding-left: 10px !important
    }

    .sub-header .types-dropdown,.sub-header .types-dropdown {
        margin-left: 0;
        margin-right: auto
    }

    .sub-header {
        padding: 10px
    }

    .sub-header .navbar .shortcuts {
        display: none
    }

    .sub-header .navbar .shortcuts.mob {
        display: block
    }

    .dropdown-content {
        left: 60%
    }

    .pre-content {
        padding: 0 20px
    }

    .header {
        padding: 10px 20px
    }

    .types-dropdown .dropdown-text span {
        font-size: 20px
    }
}

@media(max-height: 1000px) {
    .characters {
        padding-bottom:40px !important
    }
}

@media(min-width: 900px) {
    .characters {
        padding-top:70px !important;
        padding-bottom: 30px !important
    }

    .char-node {
        height: 300px;
        width: 300px;
        /*width: 86px;*/
    }

    .char-node:after {
        width: 53px;
        height: 53px;
        font-size: 20px;
        top: -8.8%;
        right: 41.3%
    }

    .char-node .char-name {
        font-size: 16px;
        width: 86px
    }

    .char-node .char-picture {
        -webkit-mask-image: url('/intro/resources/images/moldura_banner.png');
        mask-image: url('/intro/resources/images/moldura_banner.png')
    }

    .char-node .explore {
        font-size: 11px
    }

    .char-node .impostor-icon {
        width: 100%;
        height: 53px;
        top: -8.8%;
        right: 0;
    }

    .char-node .impostor-icon:after {
        font-size: 20px
    }
}


@media(max-width: 700px) {
    .characters {
        padding-top:70px !important;
        padding-bottom: 30px !important
    }

    .char-node {
        height: 300px;
        width: 300px;
        /*width: 86px;*/
    }

    .char-node:after {
        width: 53px;
        height: 53px;
        font-size: 20px;
        top: -8.8%;
        right: 29.3%
    }

    .char-node .char-name {
        font-size: 16px;
        width: 86px
    }

    .char-node .char-picture {
        -webkit-mask-image: url('/intro/resources/images/moldura_banner_mobile.png');
        mask-image: url('/intro/resources/images/moldura_banner_mobile.png');
    }

    .char-node .explore {
        font-size: 11px
    }

    .char-node .impostor-icon {
        width: 100%;
        height: 53px;
        top: -8.8%;
        right: 0;
        display: none;
    }

    .char-node .impostor-icon:after {
        font-size: 20px
    }
}

@media(max-width: 450px) {
    .header {
        height:70px;
        padding: 10px
    }

    .sub-header .types-dropdown,.sub-header .classes-dropdown {
        margin-left: 0
    }
}

@media(max-width: 415px) {
    .sub-header .types-dropdown,.sub-header .classes-dropdown {
        margin-right:-10px
    }
}

.pOnlines {
    color: lemonchiffon;
    font-family: 'TobiGreek';
}

@media(max-width: 900px) {
    .videoOver {
        opacity: 0.7;
        background: radial-gradient(#000000, #003485, rgb(0 0 0));
    }

    #wr .content .characters {
        gap: 0px;
        padding: 5px;
        justify-content: flex-start;
    }

    #footer .top {
        align-items: flex-start;
    }
    .videoTopMobile {
        background-image: url('/intro/resources/images/paulo-silvente-the-guild-900p.jpg');
        opacity: 0.3;
        position: fixed;
        overflow: hidden;
        width: 100%;
        height: 100%;
    }

    #wr .content {
        top: 0px;
    }

    .logo {
        display: none !important;
    }
    .logoMobile {
        background-image: url('../../../images/favicon/favicon-32x32.png');
        display: block;
        z-index: 1;
        position: relative;
        width: 125px;
        height: 96px;
        background-size: 125px 96px;
        background-repeat: no-repeat;
    }
    .pOnlines {
        top: -15px;
        position: relative;
    }

    .cta-button {
        padding: 8px 15px !important;
    }  

    .translatorIntro {
        backdrop-filter: brightness(0.5);
        padding: 0;
        border-radius: 6px;
        display: flex;
        gap: 5px;
        flex-wrap: wrap;
        width: 100%;
    }

    .breadcrumbs .shortcuts a {
        padding: 0px;
    }

    #footer {
        margin-top: 50px;
    }

    .ServiceID_Icon_Container_BackgroundSmall {
        width: 140px !important;
        background-size: 140px 140px !important;
    }
    .ServiceID_Icon_New {
        left: 8px !important;
        width: 123px !important;
    }
    .ServiceID_Icon .ServiceIDLabelContainer {
        width: 120px !important;
    }
    .ServiceID_Icon_Container {
        width: 140px !important;
    }
    .ServiceID_Icon .ServiceIDPriceContainer {
        width: 110px !important;
    }
    .PMCID_Icon .PMCID_Icon_Over {
        width: 140px !important;
        background-size: 140px 147px !important;
    }
    .ServiceID_Icon_OverSmall {
        width: 140px !important;
        background-size: 140px 140px !important;
    }
    .ServiceID_Icon {
        width: 140px !important;
    }
    .ServiceID_Icon .ServiceID_Icon_Selected {
        background-size: 140px 140px !important;
    }
    .PMCID_Icon {
        background-size: 140px 147px !important;
        width: 140px !important;
    }
    .PMCID_Icon .PMCID_Icon_Selected {        
        width: 140px !important;
        background-size: 140px 147px !important;
    }
    .PMCID_Icon .PMCID_Deactivated {
        width: 140px !important;
        background-size: 140px 147px !important;
    }
}


.balanceUpDown .Intro {
  width: 400px;
}

.nameBackground {
    position: absolute;
    z-index: 2;
    background-color: #eb990038;
    width: 100%;
    color: gold;
    font-family: 'TobiGreek';
}

.newServer {
    position: absolute;
    right: -3px;
    transform: rotateZ(87deg);
    z-index: 4;
    top: -5px;
}

.blue-light{
    background:url(../images/general/blue-light.png);
    width:300px;
    height:300px;
    top:5px;
    left:0;
    position:absolute;
    animation:12s p-next linear infinite;
    opacity:.7
}
.yellow-light{
    background:url(../images/general/yellow-light.png);
    width:300px;
    height:300px;
    top:5px;
    left:0;
    position:absolute;
    animation:12s p-prev linear infinite;
    opacity:.7
}
@keyframes p-next{
    0%{
        transform:rotate(0deg)
    }
    50%{
        transform:rotate(180deg)
    }
    100%{
        transform:rotate(360deg)
    }
}
@keyframes p-prev{
    0%{
        transform:rotate(0deg)
    }
    50%{
        transform:rotate(-180deg)
    }
    100%{
        transform:rotate(-360deg)
    }
}
.hand-animation{
    position: relative;
    left: -87px;
    top: -78px;
}
.light-hand{
    background:url(../images/general/light-hand.png);
    width:350px;
    height:350px;
    position:absolute;
    top:0;
    left:0;
    animation:20s light-hand linear infinite;
    opacity:.7
}
.rune-hand{
    background:url(../images/general/rune-hand.png);
    width:350px;
    height:350px;
    position:absolute;
    top:0;
    left:0;
    animation:15s rune-hand linear infinite;
    opacity:.8
}
@keyframes light-hand{
    0%{
        transform:rotate(0deg)
    }
    50%{
        transform:rotate(-180deg)
    }
    100%{
        transform:rotate(-360deg)
    }
}
@keyframes rune-hand{
    0%{
        transform:rotate(0deg)
    }
    50%{
        transform:rotate(180deg)
    }
    100%{
        transform:rotate(360deg)
    }
}
#eventscheduletable {
    border-collapse: collapse;
    table-layout: fixed;
    border-spacing: 1px;
    padding: 1px;
    border: 1px;
    background: #d4c0a1;
    border-color: #5f4d41;
    -moz-box-shadow: 2px 2px 3px 3px #7c5231;
    -webkit-box-shadow: 2px 2px 3px 3px #7c5231;
    -ms-box-shadow: 2px 2px 3px 3px #7c5231;
    box-shadow: 2px 2px 3px 3px #7c5231;
}
#eventscheduletable td {
    border: 1px solid #faf0d7;
    height: 24px;
    overflow: hidden;
    font-weight: bold;
    color: #fff;
}
.eventscheduleheadertop {
margin: auto;
width: 100%;
display: flex;
min-width: 400px;
}
.eventscheduleheaderblockleft {
margin-left: auto;
margin-right: auto;
text-align: center;
position: relative;
}
.eventscheduleheaderdateblock {
position: absolute;
width: 150px;
text-align: center;
}
.eventscheduleheaderleft {
  float: left;
}
.eventscheduleheaderright {
    float: right;
}
.eventscheduleheaderblockright {
text-align: right;
white-space: nowrap;
margin-right: 5px;
}
td#dia_comum {
    color: #5f4d41;
    background-color:#E7D1AF;
}
td#dia_atual {
    color: #5f4d41;
    background-color: #f3e5d0;
}
td#dia_branco {
    color: #5f4d41;
    background-color: #d4c0a1;
}
.calendarEventName {
    font-size: 12px;
    color:#FFF; 
    width: 100%; 
    font-weight: bold; 
    overflow: hidden; 
    text-overflow: ellipsis; 
    white-space: nowrap; 
    padding: 1%; 
    padding-left: 3px; 
    margin-bottom:2px;
}

.sazonalIcons {
    font-weight: bold;
    margin-bottom: 2px;
    display: inline-block;
    width: 60%;
    top: -1px;
    position: relative;
}
.lightsaber {
    width: 154px;
    height: 160px;
    font-family: sans-serif;
    font-weight: bold;
    color: white;
    aspect-ratio: 16 / 9;
    border-style: solid;
    /* border-radius: 10px; */
    border: 3px solid var(--lightblue);
    box-shadow: 0 0 15px var(--lightblue), inset 0 0 15px var(--lightblue);
}

.neonEffectRuby {

}
.redSaber {
    background: rgb(229,17,21); /* Old browsers */
    background: linear-gradient(to right, rgba(229,17,21,1) 0%,rgba(254,254,254,1) 30%,rgba(254,254,254,1) 47%,rgba(254,254,254,1) 71%,rgba(229,17,21,1) 100%); /* W3C */
    background: -moz-linear-gradient(left, rgba(229,17,21,1) 0%, rgba(254,254,254,1) 30%, rgba(254,254,254,1) 47%, rgba(254,254,254,1) 71%, rgba(229,17,21,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(229,17,21,1)), color-stop(30%,rgba(254,254,254,1)), color-stop(47%,rgba(254,254,254,1)), color-stop(71%,rgba(254,254,254,1)), color-stop(100%,rgba(229,17,21,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(left, rgba(229,17,21,1) 0%,rgba(254,254,254,1) 30%,rgba(254,254,254,1) 47%,rgba(254,254,254,1) 71%,rgba(229,17,21,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(left, rgba(229,17,21,1) 0%,rgba(254,254,254,1) 30%,rgba(254,254,254,1) 47%,rgba(254,254,254,1) 71%,rgba(229,17,21,1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(left, rgba(229,17,21,1) 0%,rgba(254,254,254,1) 30%,rgba(254,254,254,1) 47%,rgba(254,254,254,1) 71%,rgba(229,17,21,1) 100%); /* IE10+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e51115', endColorstr='#e51115',GradientType=1 ); /* IE6-9 */
    animation-name: redSaber;
    -moz-animation-name: redSaber;
    -webkit-animation-name: redSaber;
    -o-animation-name: redSaber;
    -ms-animation-name: redSaber;
    animation-duration: 2s;
    -moz-animation-duration: 2s;
    -webkit-animation-duration: 2s;
    -o-animation-duration: 2s;
    -ms-animation-duration: 2s;
    animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
    -o-animation-iteration-count: infinite;
    -ms-animation-iteration-count: infinite;
}
.greenSaber {
    background: rgb(135,220,90); /* Old browsers */
    background: linear-gradient(to right, rgb(135,220,90) 0%,rgb(254,254,254) 30%,rgb(254,254,254) 50%,rgb(254,254,254) 70%,rgb(135,220,90) 100%); /* W3C */
    background: -moz-linear-gradient(left, rgb(135,220,90) 0%, rgb(254,254,254) 30%, rgb(254,254,254) 50%, rgb(254,254,254) 70%, rgb(135,220,90) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgb(135,220,90)), color-stop(30%,rgb(254,254,254)), color-stop(50%,rgb(254,254,254)), color-stop(70%,rgb(254,254,254)), color-stop(100%,rgb(135,220,90))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(left, rgb(135,220,90) 0%,rgb(254,254,254) 30%,rgb(254,254,254) 50%,rgb(254,254,254) 70%,rgb(135,220,90) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(left, rgb(135,220,90) 0%,rgb(254,254,254) 30%,rgb(254,254,254) 50%,rgb(254,254,254) 70%,rgb(135,220,90) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(left, rgb(135,220,90) 0%,rgb(254,254,254) 30%,rgb(254,254,254) 50%,rgb(254,254,254) 70%,rgb(135,220,90) 100%); /* IE10+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#87dc5a', endColorstr='#87dc5a',GradientType=1 ); /* IE6-9 */
    animation-name: greenSaber;
    -moz-animation-name: greenSaber;
    -webkit-animation-name: greenSaber;
    -o-animation-name: greenSaber;
    -ms-animation-name: greenSaber;
    animation-duration: 2s;
    -moz-animation-duration: 2s;
    -webkit-animation-duration: 2s;
    -o-animation-duration: 2s;
    -ms-animation-duration: 2s;
    animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
    -o-animation-iteration-count: infinite;
    -ms-animation-iteration-count: infinite;
}
.greenSaber.left {
    left: 0px;
    width: 6px;
    height: 150px;
    top: 3px;
    position: absolute;
    z-index: 1; 
}
.greenSaber.right {
    right: 0px;
    width: 6px;
    height: 150px;
    top: 3px;
    position: absolute;
    z-index: 1; 
}
.greenSaber.bot {
    position: absolute;
    bottom: 0px;
    width: 150px;
    height: 6px;
    transform: scale(2) rotate(-90deg) scale(-1, 1);
}
.greenSaber.top {
    position: absolute;
    top: 0px;
    width: 150px;
    height: 6px;
    transform: scale(2) rotate(-90deg) scale(-1, 1);
}
@keyframes redSaber {
    from { box-shadow: 0 0 10px #e51115; }
    50% { box-shadow: 0 0 16px #e51115; }
    to { box-shadow: 0 0 10px #e51115; }
}
@-moz-keyframes redSaber {
    from { box-shadow: 0 0 10px #e51115; }
    50% { box-shadow: 0 0 16px #e51115; }
    to { box-shadow: 0 0 10px #e51115; }
}
@-webkit-keyframes redSaber {
    from { box-shadow: 0 0 10px #e51115; }
    50% { box-shadow: 0 0 16px #e51115; }
    to { box-shadow: 0 0 10px #e51115; }
}
@-o-keyframes redSaber {
    from { box-shadow: 0 0 10px #e51115; }
    50% { box-shadow: 0 0 16px #e51115; }
    to { box-shadow: 0 0 10px #e51115; }
}
@-ms-keyframes redSaber {
    from { box-shadow: 0 0 10px #e51115; }
    50% { box-shadow: 0 0 16px #e51115; }
    to { box-shadow: 0 0 10px #e51115; }
}
@keyframes greenSaber {
    from { box-shadow: 0 0 10px #7EC855; }
    50% { box-shadow: 0 0 16px #7EC855; }
    to { box-shadow: 0 0 10px #7EC855; }
}
@-moz-keyframes greenSaber {
    from { box-shadow: 0 0 10px #7EC855; }
    50% { box-shadow: 0 0 16px #7EC855; }
    to { box-shadow: 0 0 10px #7EC855; }
}
@-webkit-keyframes greenSaber {
    from { box-shadow: 0 0 10px #7EC855; }
    50% { box-shadow: 0 0 16px #7EC855; }
    to { box-shadow: 0 0 10px #7EC855; }
}
@-o-keyframes greenSaber {
    from { box-shadow: 0 0 10px #7EC855; }
    50% { box-shadow: 0 0 16px #7EC855; }
    to { box-shadow: 0 0 10px #7EC855; }
}
@-ms-keyframes greenSaber {
    from { box-shadow: 0 0 10px #7EC855; }
    50% { box-shadow: 0 0 16px #7EC855; }
    to { box-shadow: 0 0 10px #7EC855; }
}

.packButton {
    width: 20px;
    height: 20px;
    border: none;
    outline: none;
    position: relative;
    border-radius: 10px;
    z-index: 1;
}
.packButton:before {
    content: "";
     background: linear-gradient(90deg,
         #ff2400,
         #e81d1d,
         #e8b71d,
         #e3e81d,
         #1de840,
         #1ddde8,
         #2b1de8,
         #dd00f3,
         #dd00f3,

         #ff2400,
         #e81d1d,
         #e8b71d,
         #e3e81d,
         #1de840,
         #1ddde8,
         #2b1de8,
         #dd00f3,
         #dd00f3);
     position: absolute;
     top: -2px;
     left: -2px;
     background-size: 200%;
     z-index: -1;
     filter: blur(5px);
     width: calc(100% + 4px);
     height: calc(50% + 4px);
     animation: glowing 20s linear infinite;
     opacity: 0;
     transition: opacity 0.3s ease-in-out;
     border-top-right-radius: 10px;
     border-top-left-radius: 10px;
}

.packButton:hover:before {
 opacity: 1;
}

.packButton:hover.packButton:after {
 opacity: 1;
}

.packButton:after {
 content: "";
 background: linear-gradient(90deg,
     #dd00f3,
     #dd00f3,
     #2b1de8,
     #1ddde8,
     #1de840,
     #e3e81d,
     #e8b71d,
     #e81d1d,
     #ff2400,

     #dd00f3,
     #dd00f3,
     #2b1de8,
     #1ddde8,
     #1de840,
     #e3e81d,
     #e8b71d,
     #e81d1d,
     #ff2400);
 position: absolute;
 top: calc(50% - 2px);
 left: -2px;
 background-size: 200%;
 z-index: -1;
 filter: blur(5px);
 width: calc(100% + 4px);
 height: calc(50% + 4px);
 animation: glowing-reverse 20s linear infinite;
 opacity: 0;
 transition: opacity 0.3s ease-in-out;
 border-bottom-left-radius: 10px;
 border-bottom-right-radius: 10px;
}


.ServiceID_Icon_Container {
    width: 180px;
    border: none;
    outline: none;
    position: relative;
    border-radius: 10px;
    z-index: 1;
}


.btnDonate {
    width: 180px;
    border: none;
    outline: none;
    position: relative;
    border-radius: 10px;
    z-index: 1;
    flex-basis: 25.33%;
}
.btnDonate:before {
     content: "";
     background: linear-gradient(90deg,
         #ff2400,
         #e81d1d,
         #e8b71d,
         #e3e81d,
         #1de840,
         #1ddde8,
         #2b1de8,
         #dd00f3,
         #dd00f3,

         #ff2400,
         #e81d1d,
         #e8b71d,
         #e3e81d,
         #1de840,
         #1ddde8,
     #2b1de8,
     #dd00f3,
     #dd00f3);
     position: absolute;
     top: -2px;
     left: -2px;
     background-size: 200%;
     z-index: -1;
     filter: blur(5px);
     width: calc(100% + -14px);
     height: calc(50% + 0px);
     animation: glowing 20s linear infinite;
     opacity: 0;
     transition: opacity 0.3s ease-in-out;
     border-top-right-radius: 10px;
     border-top-left-radius: 10px;
}

.btnDonate:hover:before {
 opacity: 1;
}

.btnDonate:hover.btnDonate:after {
 opacity: 1;
}

.btnDonate:after {
     content: "";
     background: linear-gradient(90deg,
     #dd00f3,
     #dd00f3,
     #2b1de8,
     #1ddde8,
     #1de840,
     #e3e81d,
     #e8b71d,
     #e81d1d,
     #ff2400,

     #dd00f3,
     #dd00f3,
     #2b1de8,
     #1ddde8,
     #1de840,
     #e3e81d,
     #e8b71d,
     #e81d1d,
     #ff2400);
    position: absolute;
    top: calc(50% - 2px);
    left: -2px;
    background-size: 200%;
    z-index: -1;
    filter: blur(5px);
    width: calc(100% + -14px);
    height: calc(50% + 0px);
    animation: glowing-reverse 20s linear infinite;
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}

/*
Efeito bob marley
.fancybox__content:before {
 content: "";
 background: linear-gradient(90deg,
     #ff2400,
     #e81d1d,
     #e8b71d,
     #e3e81d,
     #1de840,
     #1ddde8,
     #2b1de8,
     #dd00f3,
     #dd00f3,

     #ff2400,
     #e81d1d,
     #e8b71d,
     #e3e81d,
     #1de840,
     #1ddde8,
     #2b1de8,
     #dd00f3,
     #dd00f3);
 position: absolute;
 top: -2px;
 left: -2px;
 background-size: 200%;
 z-index: -1;
 filter: blur(5px);
 width: calc(100% + 4px);
 height: calc(50% + 4px);
 animation: glowing 20s linear infinite;
 transition: opacity 0.3s ease-in-out;
 border-top-right-radius: 10px;
 border-top-left-radius: 10px;
}

.fancybox__content:after {
 content: "";
 background: linear-gradient(90deg,
     #dd00f3,
     #dd00f3,
     #2b1de8,
     #1ddde8,
     #1de840,
     #e3e81d,
     #e8b71d,
     #e81d1d,
     #ff2400,

     #dd00f3,
     #dd00f3,
     #2b1de8,
     #1ddde8,
     #1de840,
     #e3e81d,
     #e8b71d,
     #e81d1d,
     #ff2400);
 position: absolute;
 top: calc(50% - 2px);
 left: -2px;
 background-size: 200%;
 z-index: -1;
 filter: blur(5px);
 width: calc(100% + 4px);
 height: calc(50% + 4px);
 animation: glowing-reverse 20s linear infinite;
 transition: opacity 0.3s ease-in-out;
 border-bottom-left-radius: 10px;
 border-bottom-right-radius: 10px;
}
*/
/* background escuro */
.fancybox__backdrop {
    /*background: #000000f2 !important;*/
}

@keyframes glowing {
 0% {
   background-position: 0 0;
 }

 100% {
   background-position: 400% 0;
 }
}

@keyframes glowing-reverse {
 0% {
   background-position: 400% 0;
 }

 100% {
   background-position: 0 0;
 }
}

.bkDonateButton {
    z-index: 1;
    width: 32px;
    display: inline-block;
    position: relative;
    right: -29px;
    top: 0;
    animation: 20s light-hand linear infinite;
}

.bkInformationsButton {
    z-index: 1;
    width: 32px;
    display: inline-block;
    position: absolute;
    margin-left: 100px;
    margin-right: 390px;
    top: 46px;
    right: -29px;
    animation: 20s light-hand linear infinite;
}
.bkInformationsButtonAbove {
    z-index: 1;
    display: inline-block;
    position: absolute;
    margin-left: 100px;
    margin-right: 390px;
    top: 53px;
    right: -21px;
}

.spriteWelcome {
    width: 174px;
    height: 174px;
    background-image: url(../images/news/welcome_sheet.png);
    animation: animateSpriteWelcom 12s steps(257) infinite
}

@keyframes animateSpriteWelcom {
    0% {
        background-position: 0 0
    }

    100% {
        background-position: -246720px 0
    }
}

.tooltipv1 {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted black;
    color: darkviolet;
    cursor: help;
}

.tooltipv1 .tooltiptextv1 {
    visibility: hidden;
    min-width: 250px;
    max-width: 400px;
    background-color: purple;
    color: #fff;
    text-align: justify;
    padding: 10px;
    border-radius: 6px;
    /* Position the tooltip */
    position: absolute;
    z-index: 100;
}

.tooltipv1:hover .tooltiptextv1 {
  visibility: visible;
}

.warningTopHeader {
    border-radius: 10px;
    text-align: center;
    /* width: 500px; */
    background-color: rgba(0, 0, 0, .7);
    -webkit-backdrop-filter: blur(1.5px);
    backdrop-filter: blur(1.5px);
    color: bisque;
    position: absolute;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    width: 564px;
    top: 100px;
}

.warningTopHeaderText {
    font-family: monospace;
}
#CharacterCell4_1 {
    width: 105px;
}

.menu-container {
  display: flex; 
  flex-wrap: wrap; 
}

.menu-column {
  flex: 1; 
  padding: 10px; 
  height: 100%; 
  overflow-y: auto; 
}

/* Estilos para o container dos cards */
.guild-cards-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
    gap: 25px; 
}

/* Estilos para cada card */
.guild-card {
    background-color: #FFF2db;
    border: 1px solid #ddd;
    padding: 15px;
    text-align: center;
    flex-basis: calc(25% - 20px); /* 4 cards por linha com espaço de 20px entre eles */
    box-sizing: border-box; /* Inclui padding e border no cálculo da largura */
    padding: 10px; /* Reduzimos o padding interno */
}


.guild-card-header {
    font-weight: bold;
    margin-bottom: 10px;
}

.guild-card-content img {
    max-width: 100%;
    height: auto;
    margin-bottom: 10px;
    height: 100px; /* Reduzimos a altura da imagem */
}

.guild-card-content small {
    display: block;
    font-size: 0.8em;
    color: #777;
    font-size: 0.7em; /* Reduzimos ainda mais o tamanho da fonte */
}

.guild-card .linkButton {
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    text-decoration: underline;
    color: blue;
    font-size: 0.9em; /* Reduzimos o tamanho da fonte do link */
}

.guildImageSize {
    width: 64px  !important;
    height: 64px !important;
}

.exclusiveContents {
    width: 100%;
    position: relative;
    display: flex;
    justify-content: center;
    left: 14px;
    top: 8px;
}
.exclusiveContents span {
    width: 64px;
    height: 64px;
    background-size: 64px 64px;
    position: absolute;
}

.imgBorder {
    border: 2px solid #4c4944;
}

.changeLogFooter {
    display: flex;
    justify-content: space-between;
}

.team-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); /* Largura mínima ajustada */
    gap: 10px;
}

.member-card {
    border: 1px solid #ccc;
    padding: 5px;
    background-color: white; /* Fundo branco para o card */
}

.member-info {
    display: flex;  /* Usando flexbox para organizar os elementos */
    align-items: center; /* Alinhar verticalmente ao centro */
}

.left-side {
    min-width: 260px;
    display: flex;
    flex-direction: column; /* Imagem e nick em coluna */
    align-items: center; /* Centralizar horizontalmente */
    margin-right: 20px; /* Espaçamento entre a esquerda e a direita */
}
.member-card .left-side {
    border-right: 1px solid #ccc;
    padding-right: 10px;
}
.right-side {
    text-align: left; /* Alinhar o texto à esquerda */
}

.equipped-items, .player-info {
  padding: 10px; 
  border: 1px solid #faf0d7;
  height: 300px; /* Defina a altura desejada */
}
.parent-container {
  display: flex;
}
#shopOverlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  z-index: 1000;
}

#addAffiliate {
  position: relative;
}
.closeFormButton {
    position: absolute;
    top: -22px;
    z-index: 1000;
    right: 4px;
    display: none;
    padding: 5px 10px;
    font-size: 8px;
    font-weight: bold;
    color: white;
    background-color: #d9534f;
    border: none;
    border-radius: 5px;
    cursor: pointer;
}

.minha-tabela-pix {
  min-height: 300px;
  display: flex;
  align-items: center;
  justify-content: center;
  vertical-align: top; /* alinha as tabelas pelo topo */
}

.modalWhatsapp {
    display: none; 
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgb(0 0 0 / 82%);
}
.modal-contentWhatsapp {
    background-color: #ffffff;
    margin: 15% auto;
    padding: 20px;
    border: 1px solid #888;
    width: 40%;
    display: flex;
    justify-content: space-evenly;
}
.close-header-button {
    position: absolute; /* Posicionamento absoluto em relação ao modal */
    top: 4px;
    right: 18px;
    color: #aaa;
    font-size: 28px;
    font-weight: bold;
    cursor: pointer;
}
.close-header-button:hover,
.close-header-button:focus {
  color: #ffffff;
  text-decoration: none;
  cursor: pointer;
}

.backgroundOver {
    z-index: 1;
    opacity: 0.4;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: radial-gradient(#000000, #003485, rgb(0 0 0));
    background-position: center;
    background-size: cover;
}

#PremiumBox2 {
    position: relative;
    margin-top: -3px;
    height: 176px
}
#PremiumBoxDecor2 {
    margin: 0;
    position: absolute;
    top: -28px;
    left: 5px;
    width: 64px;
    height: 64px
}
#PremiumBoxBg2 {
    margin: 0;
    position: absolute;
    top: 34px;
    left: 10px;
    width: 160px;
    height: 126px
}
#PremiumBoxOverlay2 {
    margin: 0;
    position: absolute;
    top: 34px;
    left: 10px;
    width: 163px;
    height: 26px
}
#PremiumBoxOverlayText2 {
    color: #fff;
    font-family: Verdana, sans-serif;
    margin-top: 3px;
    text-align: center;
    font-size: 11px
}
#PremiumBoxButtonDecor2 {
    position: absolute;
    margin-top: -60px;
    width: 114px;
    height: 26px;
    left: 33px;
    bottom: 34px;
    z-index: 25
}
#PremiumBoxButton2 {
    position: absolute;
    bottom: -15px; /* distância da base do PremiumBox2 */
    left: 18px;
    text-align: center;
}

.WebshopButton {
    position: relative; /* não absolute */
    width: 142px;
    height: 34px;
    z-index: 10;
    margin-top: 0; /* remove margem que atrapalha */
}

/* A imagem hover inicialmente escondida */
.WebshopButtonOver {
    position: absolute;
    top: 0;
    left: 0;
    width: 142px;
    height: 34px;
    z-index: 2;
    opacity: 0; /* melhor usar opacity para transição */
    transition: opacity 0.2s ease;
}

/* A imagem normal do botão */
.WebshopButton input.WebshopButtonText {
    position: relative;
    z-index: 1;
}

/* Quando o mouse estiver sobre o botão */
.WebshopButton:hover .WebshopButtonOver {
    opacity: 1;
}
.WebshopButtonText {
    position: relative;
    top: 2px;
    z-index: 20
}

.Themebox2 {
    position: relative;
    top: -3;
    margin-bottom: 19px;
    width: 180px;
    height: 1px;
}
/*# sourceMappingURL=ferobra.css.map */

-------------------

/* For�a o dark mode mesmo que tenha data-swal2-theme="light" */
body .swal2-container[data-swal2-theme="light"] .swal2-popup {
  background: #1e1e1e !important;
  color: #fff !important;
}

body .swal2-container[data-swal2-theme="light"] .swal2-title {
  color: #fff !important;
}

body .swal2-container[data-swal2-theme="light"] .swal2-html-container {
  color: #ddd !important;
}

body .swal2-container[data-swal2-theme="light"] .swal2-confirm {
  background: linear-gradient(to right, #f7b733, #fc4a1a) !important;
  border: 3px solid #ff8600 !important;
  color: #fff !important;
}

body .swal2-container[data-swal2-theme="light"] .swal2-cancel {
  background: #d33 !important;
  color: #fff !important;
}

/* Estilos do novo botão Discord */
.discord-webshop-button{
  position: relative;
  background-image: url("../images/global/buttons/button.png");
  background-size: cover;
  background-repeat: no-repeat;
  border-radius: 6px;
  overflow: hidden;
  cursor: pointer;
  box-shadow: 0 2px 4px rgba(0,0,0,0.25);
  display: flex;
  align-items: center;
  justify-content: center;
}

.discord-webshop-button {
  width: 150px;   /* de 190px -> 150px */
  height: 35px;   /* de 44px -> 35px */
  margin-top: -50px;
  margin-left: 15px;
  background-size: cover;
}

/* overlay que aparece no hover */
.discord-webshop-over{
  position: absolute;
  inset: 0; /* top:0; right:0; bottom:0; left:0; */
  background-image: url("../images/global/buttons/button_hover.png");
  background-size: cover;
  background-repeat: no-repeat;
  opacity: 0;
  transition: opacity .18s ease;
  pointer-events: none;
  z-index: 2;
}

/* imagem/texto do botão (fica acima do overlay) */
.discord-webshop-img{
  position: relative;
  z-index: 3;
  display: block;
  width: 150px;   /* define largura */
  height: auto;   /* mantém proporção */
  pointer-events: none;
}

/* HOVER funciona sem JS */
.discord-webshop-button:hover .discord-webshop-over,
.discord-webshop-link:focus .discord-webshop-over,
.discord-webshop-link:focus-visible .discord-webshop-over {
  opacity: 1;
}

/* acessibilidade: foco por teclado */
.discord-webshop-link:focus {
  outline: 2px solid rgba(88,101,242,0.22);
  outline-offset: 2px;
}

/* aguionOT Discord refreshed branding */
.discord-webshop-link,
.discord-webshop-link:link,
.discord-webshop-link:visited,
.discord-webshop-link:focus {
  text-decoration: none;
}

.discord-webshop-button {
  width: 158px;
  height: 48px;
  box-sizing: border-box;
  gap: 8px;
  margin-top: -56px;
  margin-left: 11px;
  padding: 3px 13px 3px 7px;
  border: 1px solid rgba(121, 216, 255, .62);
  border-radius: 9px;
  background-image: none;
  background:
    radial-gradient(circle at 23% 50%, rgba(108, 216, 255, .34), transparent 40%),
    linear-gradient(135deg, rgba(37, 61, 125, .96), rgba(18, 27, 69, .98) 58%, rgba(66, 40, 132, .96));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .16),
    inset 0 -8px 13px rgba(1, 4, 18, .26),
    0 4px 10px rgba(1, 4, 18, .52),
    0 0 9px rgba(101, 217, 255, .2);
}

.discord-webshop-over {
  background-image: none;
  background:
    linear-gradient(135deg, rgba(83, 139, 219, .34), rgba(136, 99, 255, .34));
  box-shadow:
    inset 0 0 0 1px rgba(213, 239, 255, .16),
    inset 0 0 15px rgba(102, 216, 255, .2);
}

.discord-webshop-img {
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  object-fit: contain;
  filter:
    drop-shadow(0 2px 2px rgba(1, 3, 12, .9))
    drop-shadow(0 0 5px rgba(105, 217, 255, .42));
}

.discord-webshop-text {
  position: relative;
  z-index: 3;
  color: #f2f6ff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 16px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: .4px;
  text-shadow:
    0 1px 2px #02040d,
    0 0 6px rgba(117, 214, 255, .46),
    0 0 9px rgba(137, 102, 255, .25);
  pointer-events: none;
}
.admin_icon {
    width: 16px;
    height: 16px;
    background-image: url(/layouts/global/images/support/admin.png);
}
.god_icon {
    width: 16px;
    height: 16px;
    background-image: url(/layouts/global/images/support/god.png);
}
.cm_icon {
    width: 16px;
    height: 16px;
    background-image: url(/layouts/globall/images/support/cm.png);
}
.carousel-item img {
    width: 100%;
    height: auto;
    display: block;
}
/* === aguionOT THEME START === */
:root {
  --aguionOT-midnight: #050817;
  --aguionOT-panel: #11152e;
  --aguionOT-violet: #8b7cff;
  --aguionOT-cyan: #65d9ff;
  --aguionOT-silver: #dce9ff;
}

body {
  background: var(--aguionOT-midnight);
}

.backgroundGeneral {
  background-color: var(--aguionOT-midnight);
  background-image:
    linear-gradient(90deg, rgba(3, 6, 20, .2), rgba(3, 6, 20, .48) 46%, rgba(3, 6, 20, .16)),
    url("../images/backgrounds/aguia.png") !important;
  background-position: center top !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
}

#LeftArtwork img {
  width: 280px;
  filter: drop-shadow(0 0 12px rgba(101, 217, 255, .42)) drop-shadow(0 7px 12px rgba(0, 0, 0, .72));
}

#MenuColumn,
#ThemeboxesColumn {
  filter: drop-shadow(0 0 8px rgba(91, 78, 190, .32));
}

.Submenu {
  background-color: rgba(13, 18, 45, .96);
}

.SubmenuitemLabel {
  border-bottom-color: #353e76;
}

.Submenu a:link,
.Submenu a:visited,
.Submenu a:focus {
  color: #dce9ff;
}

#carouselExampleCaptions {
  overflow: hidden;
  border: 2px solid #7768e8;
  border-radius: 4px;
  background: #080b1e;
  box-shadow: 0 0 0 1px rgba(101, 217, 255, .42), 0 0 22px rgba(90, 72, 210, .44);
}

#carouselExampleCaptions .carousel-item img {
  aspect-ratio: 1000 / 364;
  object-fit: cover;
}

.Content .Box {
  border-left-color: #5c55a3;
  border-right-color: #5c55a3;
  box-shadow: 0 7px 22px rgba(1, 4, 17, .38);
}

.Content .BoxContent {
  background-color: #f2eef9;
  color: #34284d;
}

.InfoBar {
  box-shadow: inset 0 -1px 0 rgba(101, 217, 255, .35), 0 0 10px rgba(91, 78, 190, .28);
}
/* === aguionOT THEME END === */

/* === aguionOT WIKI PORTAL START === */
#wiki.Box {
  border-left-color: rgba(102, 101, 202, .82);
  border-right-color: rgba(102, 101, 202, .82);
  background: #080d20;
}

#wiki.Box > .Border_2 > .Border_3 > .BoxContent {
  min-height: 0;
  padding: 0;
  background: #080d20 !important;
  color: #eaf5ff;
  overflow: hidden;
}

.aguionOTWiki,
.aguionOTWiki * {
  box-sizing: border-box;
}

.aguionOTWiki {
  --wiki-ink: #f4f8ff;
  --wiki-muted: #aebbd5;
  --wiki-cyan: #78dcff;
  --wiki-violet: #9c6bff;
  --wiki-panel: #0e1530;
  position: relative;
  padding: 18px;
  color: var(--wiki-ink);
  background:
    radial-gradient(circle at 13% 5%, rgba(102, 75, 201, .18), transparent 28%),
    radial-gradient(circle at 88% 18%, rgba(43, 156, 224, .14), transparent 31%),
    linear-gradient(180deg, #0b1027 0%, #070b1b 100%);
  font-family: "Segoe UI", Arial, sans-serif;
}

.aguionOTWiki a {
  color: inherit;
}

.aguionOTWikiHero {
  min-height: 320px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: 42px 48px;
  border: 1px solid rgba(136, 188, 255, .25);
  border-radius: 24px;
  background:
    linear-gradient(118deg, rgba(18, 28, 65, .96), rgba(13, 17, 43, .86)),
    repeating-linear-gradient(135deg, transparent 0 22px, rgba(150, 118, 255, .03) 22px 23px);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .08),
    0 22px 48px rgba(0, 0, 0, .34);
}

.aguionOTWikiHero::before,
.aguionOTWikiHero::after {
  content: "";
  position: absolute;
  z-index: -1;
  border-radius: 50%;
  pointer-events: none;
}

.aguionOTWikiHero::before {
  width: 330px;
  height: 330px;
  right: -86px;
  top: -126px;
  border: 1px solid rgba(115, 219, 255, .19);
  box-shadow:
    0 0 0 42px rgba(108, 91, 211, .035),
    0 0 0 84px rgba(108, 91, 211, .025);
}

.aguionOTWikiHero::after {
  width: 1px;
  height: 150%;
  right: 34%;
  top: -25%;
  opacity: .3;
  background: linear-gradient(transparent, #77dfff, transparent);
  transform: rotate(22deg);
}

.aguionOTWikiHeroGlow {
  position: absolute;
  z-index: -1;
  inset: auto auto -140px -90px;
  width: 390px;
  height: 300px;
  border-radius: 50%;
  background: rgba(121, 75, 230, .22);
  filter: blur(60px);
}

.aguionOTWikiHeroContent {
  max-width: 570px;
  position: relative;
  z-index: 2;
}

.aguionOTWikiEyebrow {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 16px;
  color: var(--wiki-cyan);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .2em;
  text-transform: uppercase;
}

.aguionOTWikiEyebrow::before {
  content: "";
  width: 28px;
  height: 1px;
  background: linear-gradient(90deg, var(--wiki-violet), var(--wiki-cyan));
  box-shadow: 0 0 8px var(--wiki-cyan);
}

.aguionOTWikiHero h1 {
  margin: 0;
  color: #fff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(36px, 4vw, 58px);
  font-weight: 700;
  line-height: 1.02;
  letter-spacing: -.035em;
  text-shadow: 0 4px 22px rgba(0, 0, 0, .45);
}

.aguionOTWikiHero p {
  max-width: 530px;
  margin: 20px 0 0;
  color: #becae0;
  font-size: 16px;
  line-height: 1.7;
}

.aguionOTWikiHeroMeta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 25px;
}

.aguionOTWikiHeroMeta span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 34px;
  padding: 7px 13px;
  border: 1px solid rgba(129, 182, 255, .2);
  border-radius: 999px;
  color: #b9c8e2;
  background: rgba(7, 12, 31, .48);
  font-size: 11px;
}

.aguionOTWikiHeroMeta strong {
  color: #fff;
  font-size: 14px;
}

.aguionOTWikiSigil {
  width: 176px;
  height: 176px;
  flex: 0 0 176px;
  position: relative;
  border: 1px solid rgba(115, 219, 255, .26);
  border-radius: 50%;
  background:
    radial-gradient(circle, rgba(119, 221, 255, .18) 0 2%, transparent 3%),
    repeating-conic-gradient(from 22deg, rgba(137, 112, 255, .18) 0 2deg, transparent 2deg 45deg);
  box-shadow:
    inset 0 0 34px rgba(93, 77, 202, .18),
    0 0 50px rgba(67, 140, 231, .12);
}

.aguionOTWikiSigil::before,
.aguionOTWikiSigil::after,
.aguionOTWikiSigilOrbit,
.aguionOTWikiSigilCore {
  content: "";
  position: absolute;
  inset: 50% auto auto 50%;
  transform: translate(-50%, -50%) rotate(45deg);
}

.aguionOTWikiSigil::before {
  width: 106px;
  height: 106px;
  border: 1px solid rgba(159, 117, 255, .48);
  border-radius: 23px;
}

.aguionOTWikiSigil::after {
  width: 72px;
  height: 72px;
  border: 1px solid rgba(112, 220, 255, .42);
  border-radius: 50%;
}

.aguionOTWikiSigilOrbit {
  width: 142px;
  height: 58px;
  border: 1px solid rgba(147, 127, 255, .45);
  border-radius: 50%;
  box-shadow: 0 0 15px rgba(109, 87, 225, .24);
}

.aguionOTWikiSigilCore {
  width: 35px;
  height: 35px;
  border: 1px solid rgba(208, 236, 255, .8);
  background: linear-gradient(135deg, #74d9ff, #7438d4 58%, #160c42);
  box-shadow: 0 0 26px rgba(112, 215, 255, .6);
}

.aguionOTWikiQuickNav {
  display: flex;
  justify-content: center;
  gap: 9px;
  margin: 16px 0 38px;
}

.aguionOTWikiQuickNav a {
  padding: 9px 16px;
  border: 1px solid rgba(129, 178, 244, .18);
  border-radius: 999px;
  color: #aebed9;
  background: rgba(15, 23, 52, .76);
  font-size: 11px;
  font-weight: 700;
  text-decoration: none;
  transition: border-color .2s ease, color .2s ease, background .2s ease;
}

.aguionOTWikiQuickNav a:hover {
  border-color: rgba(120, 220, 255, .56);
  color: #fff;
  background: rgba(39, 51, 103, .82);
}

.aguionOTWikiSection {
  min-height: 0;
  margin: 0 0 44px;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.aguionOTWikiSectionHeading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 17px;
  padding: 0 4px;
}

.aguionOTWikiSectionHeading > div {
  display: flex;
  align-items: center;
  gap: 12px;
}

.aguionOTWikiSectionIndex {
  color: var(--wiki-cyan);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .12em;
}

.aguionOTWikiSectionHeading h2 {
  margin: 0;
  color: #edf6ff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -.02em;
}

.aguionOTWikiSectionHeading p {
  max-width: 380px;
  margin: 0;
  color: #8695b2;
  font-size: 11px;
  line-height: 1.45;
  text-align: right;
}

.aguionOTWikiGrid {
  display: grid;
  gap: 14px;
}

.aguionOTWikiGridSystems {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.aguionOTWikiGridProgression,
.aguionOTWikiGridServices {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.aguionOTWikiCard {
  min-width: 0;
  min-height: 238px;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border: 1px solid rgba(127, 160, 222, .2);
  border-radius: 18px;
  background: var(--wiki-panel);
  color: #fff !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .05),
    0 14px 30px rgba(0, 0, 0, .28);
  text-decoration: none !important;
  transform: translateZ(0);
}

.aguionOTWikiCardFeatured {
  grid-row: span 2;
  min-height: 490px;
}

.aguionOTWikiGridSystems .aguionOTWikiCard:nth-child(4) {
  grid-column: 1 / -1;
  min-height: 255px;
}

.aguionOTWikiCardWide {
  min-height: 290px;
}

.aguionOTWikiCardService {
  min-height: 250px;
}

.aguionOTWikiCard img {
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: -2;
  inset: 0;
  object-fit: cover;
  transition: transform .55s cubic-bezier(.2, .7, .2, 1), filter .4s ease;
}

.aguionOTWikiCardShade {
  position: absolute;
  z-index: -1;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(5, 8, 23, .04) 20%, rgba(6, 9, 26, .5) 60%, rgba(5, 8, 23, .97) 100%),
    linear-gradient(90deg, rgba(8, 12, 30, .4), transparent 60%);
  transition: background .3s ease;
}

.aguionOTWikiCardContent {
  min-height: inherit;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: end;
  position: relative;
  padding: 24px;
}

.aguionOTWikiCardFeatured .aguionOTWikiCardContent {
  padding: 34px;
}

.aguionOTWikiCardType {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 9px;
  color: #87e3ff;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.aguionOTWikiCardType::before {
  content: "";
  width: 7px;
  height: 7px;
  border: 1px solid #8de6ff;
  transform: rotate(45deg);
  box-shadow: 0 0 8px rgba(114, 219, 255, .72);
}

.aguionOTWikiCardContent > strong {
  max-width: 100%;
  color: #fff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 25px;
  line-height: 1.08;
  text-shadow: 0 2px 12px rgba(0, 0, 0, .7);
}

.aguionOTWikiCardFeatured .aguionOTWikiCardContent > strong {
  font-size: 36px;
}

.aguionOTWikiCardDescription {
  max-width: 460px;
  margin-top: 9px;
  color: #bdc9dc;
  font-size: 11px;
  line-height: 1.5;
}

.aguionOTWikiCardAction {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-top: 15px;
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.aguionOTWikiCardAction i {
  width: 24px;
  height: 1px;
  position: relative;
  background: linear-gradient(90deg, var(--wiki-violet), var(--wiki-cyan));
  transition: width .25s ease;
}

.aguionOTWikiCardAction i::after {
  content: "";
  width: 6px;
  height: 6px;
  position: absolute;
  right: 0;
  top: -3px;
  border-top: 1px solid var(--wiki-cyan);
  border-right: 1px solid var(--wiki-cyan);
  transform: rotate(45deg);
}

.aguionOTWikiCard:hover {
  border-color: rgba(126, 220, 255, .62);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .09),
    0 18px 38px rgba(0, 0, 0, .38),
    0 0 22px rgba(77, 92, 203, .15);
}

.aguionOTWikiCard:hover img {
  transform: scale(1.045);
  filter: saturate(1.08) brightness(1.06);
}

.aguionOTWikiCard:hover .aguionOTWikiCardAction i {
  width: 34px;
}

.aguionOTWikiPath {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  margin: 4px 0 6px;
  padding: 22px 24px;
  border: 1px solid rgba(125, 183, 255, .2);
  border-radius: 18px;
  background:
    linear-gradient(105deg, rgba(28, 35, 82, .92), rgba(12, 18, 44, .94)),
    radial-gradient(circle at 20% 50%, rgba(136, 86, 242, .24), transparent 42%);
}

.aguionOTWikiPathLabel {
  display: block;
  margin-bottom: 4px;
  color: var(--wiki-cyan);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .15em;
  text-transform: uppercase;
}

.aguionOTWikiPath > div > strong {
  color: #fff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 18px;
}

.aguionOTWikiPath ol {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.aguionOTWikiPath li {
  margin: 0;
}

.aguionOTWikiPath a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border: 1px solid rgba(131, 177, 239, .18);
  border-radius: 9px;
  color: #b9c6db;
  background: rgba(6, 11, 28, .45);
  font-size: 9px;
  font-weight: 700;
  text-decoration: none;
}

.aguionOTWikiPath a:hover {
  border-color: rgba(120, 220, 255, .5);
  color: #fff;
}

.aguionOTWikiPath a span {
  display: grid;
  width: 20px;
  height: 20px;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  background: linear-gradient(135deg, #7656d5, #2b9dd7);
  font-size: 9px;
}

@media (max-width: 900px) {
  .aguionOTWikiHero {
    padding: 36px;
  }

  .aguionOTWikiSigil {
    width: 140px;
    height: 140px;
    flex-basis: 140px;
  }

  .aguionOTWikiPath {
    align-items: flex-start;
    flex-direction: column;
  }

  .aguionOTWikiPath ol {
    justify-content: flex-start;
  }
}

@media (max-width: 700px) {
  .aguionOTWiki {
    padding: 11px;
  }

  .aguionOTWikiHero {
    min-height: 300px;
    padding: 30px 25px;
  }

  .aguionOTWikiHero h1 {
    font-size: 38px;
  }

  .aguionOTWikiSigil {
    display: none;
  }

  .aguionOTWikiQuickNav {
    justify-content: flex-start;
    overflow-x: auto;
    padding-bottom: 3px;
  }

  .aguionOTWikiQuickNav a {
    flex: 0 0 auto;
  }

  .aguionOTWikiSectionHeading {
    align-items: flex-start;
    flex-direction: column;
    gap: 7px;
  }

  .aguionOTWikiSectionHeading p {
    text-align: left;
  }

  .aguionOTWikiGridSystems,
  .aguionOTWikiGridProgression,
  .aguionOTWikiGridServices {
    grid-template-columns: 1fr;
  }

  .aguionOTWikiCard,
  .aguionOTWikiCardFeatured,
  .aguionOTWikiCardWide,
  .aguionOTWikiCardService {
    min-height: 285px;
    grid-row: auto;
  }

  .aguionOTWikiGridSystems .aguionOTWikiCard:nth-child(4) {
    grid-column: auto;
  }

  .aguionOTWikiCardFeatured .aguionOTWikiCardContent,
  .aguionOTWikiCardContent {
    padding: 24px;
  }

  .aguionOTWikiCardFeatured .aguionOTWikiCardContent > strong {
    font-size: 30px;
  }
}
/* === aguionOT WIKI PORTAL END === */

/* === aguionOT WIKI GUIDE PAGES START === */
:is(#gem_system, #craft, #tasks).Box {
  border-left-color: rgba(102, 101, 202, .82);
  border-right-color: rgba(102, 101, 202, .82);
  background: #080d20;
}

:is(#gem_system, #craft, #tasks).Box > .Border_2 > .Border_3 > .BoxContent {
  min-height: 0;
  padding: 0;
  background:
    radial-gradient(circle at 12% 4%, rgba(108, 77, 218, .18), transparent 28%),
    radial-gradient(circle at 88% 2%, rgba(61, 174, 232, .12), transparent 30%),
    linear-gradient(180deg, #080d21 0%, #050817 100%) !important;
  color: #dcecff;
  overflow: hidden;
}

:is(#gem_system, #craft, #tasks).Box > .Border_2 > .Border_3 > .BoxContent::before {
  display: flex;
  min-height: 292px;
  align-items: flex-end;
  margin: 0;
  padding: 42px 48px;
  border-bottom: 1px solid rgba(123, 207, 255, .22);
  color: #fff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 46px;
  font-weight: 800;
  line-height: 1.02;
  letter-spacing: -.035em;
  white-space: pre-line;
  text-shadow: 0 4px 26px rgba(0, 0, 0, .75);
  box-shadow: inset 0 -92px 115px rgba(5, 8, 20, .88);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

#gem_system.Box > .Border_2 > .Border_3 > .BoxContent::before {
  content: "Gem System\A Aprimore seus equipamentos com pedras elementais";
  background-image:
    linear-gradient(90deg, rgba(5, 8, 22, .88) 0%, rgba(6, 10, 29, .62) 42%, rgba(8, 12, 32, .12) 100%),
    url('/layouts/global/images/wiki/gem-system.webp');
}

#craft.Box > .Border_2 > .Border_3 > .BoxContent::before {
  content: "Craft System\A Forje equipamentos e acompanhe os materiais";
  background-position: center, center 42%;
  background-size: cover, cover;
  background-image:
    linear-gradient(90deg, rgba(5, 8, 22, .76) 0%, rgba(6, 10, 29, .36) 44%, rgba(8, 12, 32, 0) 100%),
    url('/layouts/global/images/wiki/craft-system.webp');
}

#tasks.Box > .Border_2 > .Border_3 > .BoxContent::before {
  content: "Task System\A Evolua por objetivos, monstros e recompensas";
  background-image:
    linear-gradient(90deg, rgba(5, 8, 22, .88) 0%, rgba(6, 10, 29, .62) 42%, rgba(8, 12, 32, .12) 100%),
    url('/layouts/global/images/wiki/task-system.webp');
}

:is(#gem_system, #craft, #tasks).Box .HeaderPagesText {
  display: none !important;
}

:is(#gem_system, #craft, #tasks).Box div[style*="animation: gradientFlow"]:has(.HeaderPagesText) {
  display: none !important;
}

:is(#gem_system, #craft, #tasks).Box > .Border_2 > .Border_3 > .BoxContent > :not(style):not(script):not(.HeaderPagesText) {
  margin: 24px !important;
}

:is(#gem_system, #craft, #tasks).Box > .Border_2 > .Border_3 > .BoxContent > :last-child:not(style):not(script) {
  margin-bottom: 30px !important;
}

:is(#gem_system, #craft, #tasks).Box > .Border_2 > .Border_3 > .BoxContent:has(.aguionOTGuidePage)::before {
  display: none !important;
}

:is(#gem_system, #craft, #tasks).Box > .Border_2 > .Border_3 > .BoxContent > .aguionOTGuidePage {
  margin: 0 !important;
}

.aguionOTGuidePage,
.aguionOTGuidePage * {
  box-sizing: border-box;
}

.aguionOTGuidePage {
  --guide-ink: #f4f8ff;
  --guide-text: #d6e6fb;
  --guide-muted: #9fb0ce;
  --guide-cyan: #82e6ff;
  --guide-violet: #a778ff;
  padding: 18px;
  color: var(--guide-text);
  background:
    radial-gradient(circle at 8% 0%, rgba(130, 87, 255, .14), transparent 32%),
    radial-gradient(circle at 90% 8%, rgba(81, 191, 255, .1), transparent 30%),
    linear-gradient(180deg, #080d21 0%, #060916 100%);
  font-family: "Segoe UI", Arial, sans-serif;
}

.aguionOTGuidePage section {
  min-height: 0;
  border: 0;
  box-shadow: none;
}

.aguionOTGuideCover {
  min-height: 360px;
  display: flex;
  align-items: flex-end;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: 34px;
  border: 1px solid rgba(128, 214, 255, .24);
  border-radius: 24px;
  background-color: #0b1028;
  background-size: cover;
  background-position: center;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .08),
    0 18px 42px rgba(0, 0, 0, .34);
}

.aguionOTGuideCover::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(5, 8, 22, .94) 0%, rgba(6, 10, 29, .74) 45%, rgba(8, 12, 32, .22) 100%),
    linear-gradient(180deg, rgba(5, 8, 22, .1) 0%, rgba(5, 8, 22, .72) 100%);
}

.aguionOTGuideCover::after {
  content: "";
  position: absolute;
  right: 24px;
  top: 24px;
  width: 132px;
  height: 132px;
  border: 1px solid rgba(143, 226, 255, .24);
  border-radius: 50%;
  box-shadow:
    0 0 0 28px rgba(130, 91, 255, .035),
    inset 0 0 32px rgba(127, 95, 255, .12);
}

.aguionOTGuideCoverGem {
  background-image: url('/layouts/global/images/wiki/gem-system.webp');
}

.aguionOTGuideCoverCraft {
  background-image: url('/layouts/global/images/wiki/craft-guide-hero.webp');
  background-position: center 42%;
}

.aguionOTGuideCoverTasks {
  background-image: url('/layouts/global/images/wiki/task-system.webp');
}

.aguionOTGuideCoverContent {
  max-width: 610px;
  position: relative;
  z-index: 1;
}

.aguionOTGuideBack {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 18px;
  padding: 8px 12px;
  border: 1px solid rgba(132, 220, 255, .24);
  border-radius: 999px;
  color: #dff8ff !important;
  background: rgba(8, 13, 32, .7);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .08em;
  text-decoration: none !important;
  text-transform: uppercase;
}

.aguionOTGuideKicker {
  margin: 0 0 10px;
  color: var(--guide-cyan) !important;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .2em;
  text-transform: uppercase;
}

.aguionOTGuideCover h1 {
  margin: 0;
  color: #fff !important;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(42px, 6vw, 68px);
  font-weight: 800;
  line-height: .96;
  letter-spacing: -.045em;
  text-shadow: 0 5px 26px rgba(0, 0, 0, .75);
}

.aguionOTGuideCover p:not(.aguionOTGuideKicker) {
  max-width: 570px;
  margin: 18px 0 0;
  color: #d1def4 !important;
  font-size: 14px;
  line-height: 1.7;
}

.aguionOTGuidePills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 22px;
}

.aguionOTGuidePills span {
  padding: 7px 11px;
  border: 1px solid rgba(129, 186, 255, .2);
  border-radius: 999px;
  color: #dcecff !important;
  background: rgba(7, 12, 31, .6);
  font-size: 10px;
  font-weight: 800;
}

.aguionOTGuideNav {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin: 16px 0 26px;
}

.aguionOTGuideNav a {
  padding: 9px 13px;
  border: 1px solid rgba(129, 186, 255, .18);
  border-radius: 999px;
  color: #b8c7df !important;
  background: rgba(13, 20, 49, .78);
  font-size: 10px;
  font-weight: 800;
  text-decoration: none !important;
  text-transform: uppercase;
}

.aguionOTGuideNav a:hover {
  border-color: rgba(129, 230, 255, .56);
  color: #fff !important;
}

.aguionOTGuideIntroGrid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 26px;
  padding: 0;
  background: transparent;
}

.aguionOTGuideInfoCard {
  min-height: 156px;
  padding: 20px;
  border: 1px solid rgba(126, 181, 255, .18);
  border-radius: 18px;
  background:
    radial-gradient(circle at 85% 0%, rgba(125, 95, 255, .16), transparent 36%),
    linear-gradient(135deg, rgba(17, 25, 58, .9), rgba(8, 13, 34, .95));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .05),
    0 12px 28px rgba(0, 0, 0, .22);
}

.aguionOTGuideInfoCard span {
  display: inline-grid;
  width: 30px;
  height: 30px;
  place-items: center;
  margin-bottom: 12px;
  border-radius: 10px;
  color: #fff !important;
  background: linear-gradient(135deg, #2c9cd8, #7651d4);
  font-size: 12px;
  font-weight: 900;
}

.aguionOTGuideInfoCard strong {
  display: block;
  margin-bottom: 8px;
  color: #fff !important;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 18px;
}

.aguionOTGuideInfoCard p {
  margin: 0;
  color: #b9c7df !important;
  font-size: 11px;
  line-height: 1.55;
}

.aguionOTGuideData {
  padding: 24px;
  border: 1px solid rgba(129, 186, 255, .2);
  border-radius: 22px;
  background:
    linear-gradient(180deg, rgba(11, 17, 42, .96), rgba(5, 8, 21, .96));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .05),
    0 18px 38px rgba(0, 0, 0, .3);
}

.aguionOTGuideSectionTitle {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 18px;
}

.aguionOTGuideSectionTitle span {
  color: var(--guide-cyan) !important;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.aguionOTGuideSectionTitle h2 {
  margin: 4px 0 0;
  color: #fff !important;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 27px;
  line-height: 1.1;
}

.aguionOTGuideSectionTitle p {
  max-width: 350px;
  margin: 0;
  color: #9fb0ce !important;
  font-size: 11px;
  line-height: 1.5;
  text-align: right;
}

.aguionOTGuideDataBody > .TableContainer:first-child {
  margin-top: 0 !important;
}

@media (max-width: 760px) {
  .aguionOTGuidePage {
    padding: 12px;
  }

  .aguionOTGuideCover {
    min-height: 310px;
    padding: 26px;
  }

  .aguionOTGuideIntroGrid {
    grid-template-columns: 1fr;
  }

  .aguionOTGuideSectionTitle {
    align-items: flex-start;
    flex-direction: column;
  }

  .aguionOTGuideSectionTitle p {
    text-align: left;
  }
}

/* === AGUIONOT OPENING COUNTDOWN START === */
#Bodycontainer {
  position: relative;
}

.aguionOTLaunchCountdown {
  position: absolute;
  z-index: 20;
  top: 78px;
  left: 50%;
  width: 620px;
  height: 164px;
  box-sizing: border-box;
  display: grid;
  grid-template-columns: 210px 1fr;
  align-items: center;
  gap: 20px;
  padding: 22px 28px;
  overflow: hidden;
  border: 1px solid rgba(130, 218, 255, .5);
  border-radius: 18px;
  background:
    radial-gradient(circle at 8% 18%, rgba(138, 102, 255, .28), transparent 34%),
    radial-gradient(circle at 92% 82%, rgba(49, 184, 255, .16), transparent 35%),
    linear-gradient(135deg, rgba(7, 13, 37, .91), rgba(13, 17, 53, .86) 52%, rgba(20, 18, 67, .91));
  color: #f4f7ff;
  box-shadow:
    inset 0 0 0 1px rgba(225, 245, 255, .06),
    inset 0 0 32px rgba(80, 65, 190, .14),
    0 13px 30px rgba(1, 4, 18, .6),
    0 0 18px rgba(98, 83, 212, .25);
  font-family: Arial, sans-serif;
  text-align: center;
  transform: translateX(-50%);
  isolation: isolate;
}

.aguionOTLaunchCountdown::before,
.aguionOTLaunchCountdown::after {
  content: '';
  position: absolute;
  z-index: 2;
  top: 50%;
  width: 12px;
  height: 12px;
  border: 1px solid rgba(177, 231, 255, .78);
  border-radius: 3px;
  background: radial-gradient(circle, #eafaff 0%, #7fe5ff 25%, #6849d5 72%);
  box-shadow: 0 0 9px rgba(126, 221, 255, .78), 0 0 15px rgba(126, 78, 230, .55);
  transform: translateY(-50%) rotate(45deg);
}

.aguionOTLaunchCountdown::before {
  left: -7px;
}

.aguionOTLaunchCountdown::after {
  right: -7px;
}

.aguionOTLaunchCountdownGlow {
  position: absolute;
  z-index: -1;
  top: 0;
  right: 18px;
  left: 18px;
  height: 1px;
  background: linear-gradient(90deg, transparent, #77e1ff 24%, #a58cff 50%, #77e1ff 76%, transparent);
  box-shadow: 0 0 10px rgba(122, 220, 255, .58);
}

.aguionOTLaunchCountdownHeading {
  position: relative;
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding-right: 20px;
}

.aguionOTLaunchCountdownHeading::after {
  content: '';
  position: absolute;
  top: 5px;
  right: 0;
  bottom: 5px;
  width: 1px;
  background: linear-gradient(180deg, transparent, rgba(126, 221, 255, .52), rgba(154, 114, 255, .42), transparent);
}

.aguionOTLaunchCountdownKicker {
  color: #8fe8ff;
  font-size: 9px;
  font-weight: 900;
  line-height: 13px;
  letter-spacing: 2px;
  text-transform: uppercase;
  text-shadow: 0 0 8px rgba(105, 215, 255, .55);
}

.aguionOTLaunchCountdownTitle {
  margin: 4px 0 5px;
  color: #fff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 29px;
  line-height: 32px;
  letter-spacing: .6px;
  text-shadow:
    0 2px 2px #02040d,
    0 0 8px rgba(139, 111, 255, .7),
    0 0 16px rgba(86, 195, 255, .28);
}

.aguionOTLaunchCountdownDate {
  color: #d4def5;
  font-size: 10px;
  font-weight: 700;
  line-height: 14px;
  letter-spacing: .7px;
  text-transform: uppercase;
  white-space: nowrap;
}

.aguionOTLaunchCountdownTimer {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}

.aguionOTLaunchCountdownUnit {
  width: 66px;
  height: 78px;
  box-sizing: border-box;
  display: flex;
  flex: 0 0 66px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(133, 205, 255, .22);
  border-radius: 13px;
  background:
    radial-gradient(circle at 50% 0%, rgba(139, 102, 255, .2), transparent 58%),
    linear-gradient(180deg, rgba(21, 34, 77, .84), rgba(5, 10, 29, .86));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .06),
    0 7px 14px rgba(1, 4, 18, .36);
}

.aguionOTLaunchCountdownUnit strong {
  min-width: 2ch;
  color: #fff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 30px;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  line-height: 32px;
  text-shadow: 0 2px 2px #02040d, 0 0 9px rgba(126, 221, 255, .4);
}

.aguionOTLaunchCountdownUnit small {
  margin-top: 5px;
  color: #96b5da;
  font-size: 8px;
  font-weight: 900;
  line-height: 10px;
  letter-spacing: 1.1px;
  text-transform: uppercase;
}

.aguionOTLaunchCountdownSeparator {
  margin-top: -17px;
  color: #86dcff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 22px;
  font-weight: 700;
  text-shadow: 0 0 8px rgba(105, 215, 255, .65);
}

.aguionOTLaunchCountdownFinished {
  align-items: center;
  justify-content: center;
  color: #fff3a4;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 24px;
  font-weight: 800;
  line-height: 31px;
  letter-spacing: .4px;
  text-shadow: 0 2px 2px #02040d, 0 0 12px rgba(255, 221, 100, .5);
  text-transform: uppercase;
}

.aguionOTLaunchCountdown.is-finished {
  grid-template-columns: 210px 1fr;
}

.aguionOTLaunchCountdown.is-finished .aguionOTLaunchCountdownTimer {
  display: none;
}

.aguionOTLaunchCountdown.is-finished .aguionOTLaunchCountdownFinished {
  display: flex;
}

@media (prefers-reduced-motion: no-preference) {
  .aguionOTLaunchCountdownGlow {
    animation: aguionOTCountdownGlow 3s ease-in-out infinite;
  }
}

@keyframes aguionOTCountdownGlow {
  0%, 100% { opacity: .48; }
  50% { opacity: 1; }
}
/* === AGUIONOT OPENING COUNTDOWN END === */

:is(#gem_system, #craft, #tasks).Box .BoxContent,
:is(#gem_system, #craft, #tasks).Box .TableContainer,
:is(#gem_system, #craft, #tasks).Box .InnerTableContainer,
:is(#gem_system, #craft, #tasks).Box .craft-container {
  background: transparent !important;
  color: #dcecff !important;
  box-shadow: none !important;
}

:is(#gem_system, #craft, #tasks).Box .SmallBox,
:is(#gem_system, #craft, #tasks).Box .MessageContainer,
:is(#gem_system, #craft, #tasks).Box .info-card,
:is(#gem_system, #craft, #tasks).Box .modern-header,
:is(#gem_system, #craft, #tasks).Box [style*="border-radius: 15px"],
:is(#gem_system, #craft, #tasks).Box [style*="border-radius:15px"],
:is(#gem_system, #craft, #tasks).Box [style*="border-radius: 20px"],
:is(#gem_system, #craft, #tasks).Box [style*="border-radius:20px"] {
  border-color: rgba(128, 186, 255, .22) !important;
}

:is(#gem_system, #craft, #tasks).Box .SmallBox > *,
:is(#gem_system, #craft, #tasks).Box .MessageContainer,
:is(#gem_system, #craft, #tasks).Box .info-card,
:is(#gem_system, #craft, #tasks).Box .modern-stat,
:is(#gem_system, #craft, #tasks).Box [style*="background: white"],
:is(#gem_system, #craft, #tasks).Box [style*="background:white"],
:is(#gem_system, #craft, #tasks).Box [style*="background: #ffffff"],
:is(#gem_system, #craft, #tasks).Box [style*="background:#ffffff"],
:is(#gem_system, #craft, #tasks).Box [style*="background: linear-gradient(135deg, #ffffff"],
:is(#gem_system, #craft, #tasks).Box [style*="background: linear-gradient(135deg, #f8faff"],
:is(#gem_system, #craft, #tasks).Box [style*="background: linear-gradient(135deg, #fff9e6"],
:is(#gem_system, #craft, #tasks).Box [style*="background: linear-gradient(135deg, #f0f7ff"] {
  background:
    linear-gradient(135deg, rgba(17, 25, 58, .92), rgba(8, 13, 34, .94)) !important;
  border: 1px solid rgba(118, 177, 255, .18) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .05),
    0 12px 28px rgba(0, 0, 0, .24) !important;
  color: #dcecff !important;
}

:is(#gem_system, #craft, #tasks).Box .modern-header,
:is(#gem_system, #craft, #tasks).Box .CaptionContainer,
:is(#gem_system, #craft, #tasks).Box .CaptionInnerContainer,
:is(#gem_system, #craft, #tasks).Box [style*="background: linear-gradient(135deg, #1a4c8c"],
:is(#gem_system, #craft, #tasks).Box [style*="background: linear-gradient(135deg, #4a90e2"],
:is(#gem_system, #craft, #tasks).Box [style*="background: linear-gradient(135deg, var(--blue-dark"] {
  background:
    radial-gradient(circle at 85% 12%, rgba(130, 99, 255, .32), transparent 38%),
    linear-gradient(135deg, rgba(23, 40, 84, .98), rgba(93, 65, 186, .72)) !important;
  border-color: rgba(128, 220, 255, .26) !important;
  color: #fff !important;
}

:is(#gem_system, #craft, #tasks).Box .CaptionContainer {
  overflow: hidden !important;
  border: 1px solid rgba(128, 220, 255, .24) !important;
  border-radius: 18px !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .06),
    0 12px 24px rgba(0, 0, 0, .24) !important;
}

:is(#gem_system, #craft, #tasks).Box .CaptionContainer .Text {
  background: rgba(8, 14, 35, .84) !important;
  border: 1px solid rgba(142, 228, 255, .18) !important;
  border-radius: 999px !important;
  color: #f4f9ff !important;
}

:is(#gem_system, #craft, #tasks).Box .CaptionContainer [class*="CaptionEdge"],
:is(#gem_system, #craft, #tasks).Box .CaptionContainer [class*="CaptionBorder"],
:is(#gem_system, #craft, #tasks).Box .CaptionContainer [class*="CaptionVertical"] {
  display: none !important;
}

:is(#gem_system, #craft, #tasks).Box b,
:is(#gem_system, #craft, #tasks).Box strong,
:is(#gem_system, #craft, #tasks).Box h1,
:is(#gem_system, #craft, #tasks).Box h2,
:is(#gem_system, #craft, #tasks).Box h3,
:is(#gem_system, #craft, #tasks).Box .styled-text3,
:is(#gem_system, #craft, #tasks).Box .modern-header h1 {
  color: #f5f9ff !important;
  text-shadow: 0 2px 12px rgba(0, 0, 0, .42);
}

:is(#gem_system, #craft, #tasks).Box p,
:is(#gem_system, #craft, #tasks).Box div,
:is(#gem_system, #craft, #tasks).Box span,
:is(#gem_system, #craft, #tasks).Box small,
:is(#gem_system, #craft, #tasks).Box td,
:is(#gem_system, #craft, #tasks).Box li {
  color: #d6e6fb;
}

:is(#gem_system, #craft, #tasks).Box [style*="color:#1a4c8c"],
:is(#gem_system, #craft, #tasks).Box [style*="color: #1a4c8c"],
:is(#gem_system, #craft, #tasks).Box [style*="color:#4a90e2"],
:is(#gem_system, #craft, #tasks).Box [style*="color: #4a90e2"],
:is(#gem_system, #craft, #tasks).Box [style*="color: var(--blue"],
:is(#gem_system, #craft, #tasks).Box .text-blue,
:is(#gem_system, #craft, #tasks).Box .text-blue-dark {
  color: #8fe8ff !important;
}

:is(#gem_system, #craft, #tasks).Box [style*="color:#2c3e50"],
:is(#gem_system, #craft, #tasks).Box [style*="color: #2c3e50"],
:is(#gem_system, #craft, #tasks).Box [style*="color:#1a1a1a"],
:is(#gem_system, #craft, #tasks).Box [style*="color: #1a1a1a"],
:is(#gem_system, #craft, #tasks).Box [style*="color:#666"],
:is(#gem_system, #craft, #tasks).Box [style*="color: #666"] {
  color: #d7e6fb !important;
}

:is(#gem_system, #craft, #tasks).Box [style*="color:#e6b800"],
:is(#gem_system, #craft, #tasks).Box [style*="color: #e6b800"],
:is(#gem_system, #craft, #tasks).Box [style*="color:#d4af37"],
:is(#gem_system, #craft, #tasks).Box [style*="color: #d4af37"],
:is(#gem_system, #craft, #tasks).Box .text-gold {
  color: #bda7ff !important;
}

:is(#gem_system, #craft, #tasks).Box table {
  width: 100%;
  border-collapse: separate !important;
  border-spacing: 0;
  color: #dcecff !important;
}

:is(#gem_system, #craft, #tasks).Box .TableContentContainer,
:is(#gem_system, #craft, #tasks).Box .modern-table,
:is(#gem_system, #craft, #tasks).Box .TableContent,
:is(#gem_system, #craft, #tasks).Box .Table3 {
  overflow: hidden;
  border: 1px solid rgba(129, 178, 244, .18) !important;
  border-radius: 16px !important;
  background: rgba(5, 9, 25, .54) !important;
  box-shadow: 0 14px 30px rgba(0, 0, 0, .24) !important;
}

:is(#gem_system, #craft, #tasks).Box th,
:is(#gem_system, #craft, #tasks).Box .modern-table th,
:is(#gem_system, #craft, #tasks).Box .TableContent th {
  background: linear-gradient(135deg, rgba(33, 91, 151, .95), rgba(99, 64, 194, .92)) !important;
  color: #fff !important;
  border-color: rgba(140, 219, 255, .22) !important;
  font-size: 12px;
  letter-spacing: .03em;
}

:is(#gem_system, #craft, #tasks).Box tr,
:is(#gem_system, #craft, #tasks).Box tr[style*="background"],
:is(#gem_system, #craft, #tasks).Box .Odd,
:is(#gem_system, #craft, #tasks).Box .Even,
:is(#gem_system, #craft, #tasks).Box .row-blue2 {
  background: rgba(13, 19, 45, .76) !important;
}

:is(#gem_system, #craft, #tasks).Box tr:nth-child(even),
:is(#gem_system, #craft, #tasks).Box tbody:nth-child(even) tr {
  background: rgba(18, 26, 60, .82) !important;
}

:is(#gem_system, #craft, #tasks).Box td {
  border-color: rgba(126, 171, 231, .14) !important;
  color: #dcecff !important;
}

:is(#gem_system, #craft, #tasks).Box tr:hover td {
  background: rgba(56, 88, 164, .24) !important;
}

:is(#gem_system, #craft, #tasks).Box .requirement-badge,
:is(#gem_system, #craft, #tasks).Box [class*="badge"],
:is(#gem_system, #craft, #tasks).Box [style*="border-radius:30px"],
:is(#gem_system, #craft, #tasks).Box [style*="border-radius: 30px"],
:is(#gem_system, #craft, #tasks).Box [style*="border-radius:50px"],
:is(#gem_system, #craft, #tasks).Box [style*="border-radius: 50px"] {
  border-color: rgba(132, 221, 255, .24) !important;
  background: rgba(9, 15, 37, .72) !important;
  color: #f1f7ff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05) !important;
}

:is(#gem_system, #craft, #tasks).Box img {
  max-width: 100%;
}

:is(#gem_system, #craft, #tasks).Box .TableContent img,
:is(#gem_system, #craft, #tasks).Box .requirement-badge img,
:is(#gem_system, #craft, #tasks).Box .item-image {
  filter: drop-shadow(0 4px 10px rgba(68, 173, 255, .25));
}

:is(#gem_system, #craft, #tasks).Box a {
  color: #8fe8ff !important;
}

@media (max-width: 700px) {
  :is(#gem_system, #craft, #tasks).Box > .Border_2 > .Border_3 > .BoxContent::before {
    min-height: 235px;
    padding: 30px 26px;
    font-size: 34px;
  }

  :is(#gem_system, #craft, #tasks).Box > .Border_2 > .Border_3 > .BoxContent > :not(style):not(script):not(.HeaderPagesText) {
    margin: 14px !important;
  }
}

/* === aguionOT WIKI KIT START === */
:is(#gem_system, #craft, #tasks).Box > .Border_2 > .Border_3 > .BoxContent:has(.aguionOTWikiKit)::before {
  display: none !important;
}

:is(#gem_system, #craft, #tasks).Box > .Border_2 > .Border_3 > .BoxContent > .aguionOTWikiKit {
  margin: 0 !important;
}

.aguionOTWikiKit,
.aguionOTWikiKit * {
  box-sizing: border-box;
}

.aguionOTWikiKit {
  --wiki-bg: #050817;
  --wiki-panel: rgba(10, 16, 40, .94);
  --wiki-panel-soft: rgba(16, 25, 61, .86);
  --wiki-line: rgba(129, 191, 255, .22);
  --wiki-line-strong: rgba(158, 235, 255, .42);
  --wiki-text: #dceaff;
  --wiki-muted: #97a9c9;
  --wiki-title: #fff;
  --wiki-cyan: #84e7ff;
  --wiki-violet: #a77cff;
  --wiki-gold: #f0d284;
  position: relative;
  padding: 18px;
  color: var(--wiki-text);
  background:
    radial-gradient(circle at 7% 0%, rgba(116, 82, 224, .18), transparent 34%),
    radial-gradient(circle at 94% 4%, rgba(65, 191, 255, .12), transparent 30%),
    linear-gradient(180deg, #080d21 0%, #050817 100%);
  font-family: "Segoe UI", Arial, sans-serif;
}

.aguionOTWikiKit section {
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.aguionOTWikiKit a {
  color: var(--wiki-cyan) !important;
  text-decoration: none !important;
}

.WikiHero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 330px;
  gap: 24px;
  min-height: 410px;
  padding: 34px;
  overflow: hidden;
  border: 1px solid rgba(144, 219, 255, .28);
  border-radius: 28px;
  background-color: #071025;
  background-position: center;
  background-size: cover;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .08),
    0 20px 46px rgba(0, 0, 0, .42);
  isolation: isolate;
}

.WikiHero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(90deg, rgba(5, 8, 22, .96) 0%, rgba(5, 8, 22, .8) 42%, rgba(5, 8, 22, .25) 100%),
    radial-gradient(circle at 72% 30%, rgba(142, 111, 255, .22), transparent 34%),
    linear-gradient(180deg, rgba(5, 8, 22, .08), rgba(5, 8, 22, .9));
}

.WikiHero::after {
  content: "";
  position: absolute;
  right: 24px;
  bottom: 22px;
  left: 24px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(132, 231, 255, .54), rgba(168, 124, 255, .52), transparent);
  pointer-events: none;
}

.WikiHeroGem {
  background-image: url('/layouts/global/images/wiki/gem-system.webp');
}

.WikiHeroCopy {
  align-self: end;
  max-width: 700px;
  position: relative;
  z-index: 1;
}

.WikiBackLink,
.WikiActionButton {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 9px 14px;
  border: 1px solid rgba(143, 231, 255, .28);
  border-radius: 999px;
  background: linear-gradient(135deg, rgba(24, 47, 96, .76), rgba(89, 58, 179, .72));
  color: #f5fbff !important;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .09), 0 10px 24px rgba(0, 0, 0, .28);
}

.WikiKicker,
.WikiSectionHeader > span {
  display: inline-flex;
  color: var(--wiki-cyan) !important;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .2em;
  text-transform: uppercase;
}

.WikiHero .WikiKicker {
  margin-top: 22px;
}

.WikiHero h1,
.WikiSectionHeader h2,
.WikiSummary h2 {
  margin: 8px 0 0;
  color: var(--wiki-title) !important;
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -.045em;
  text-shadow: 0 5px 28px rgba(0, 0, 0, .72);
}

.WikiHero h1 {
  font-size: clamp(48px, 7vw, 78px);
}

.WikiHero p,
.WikiSectionHeader p,
.WikiFrame p,
.WikiSummary p {
  color: var(--wiki-text) !important;
  font-size: 13px;
  line-height: 1.72;
}

.WikiHero p {
  max-width: 640px;
  margin: 18px 0 0;
}

.WikiHeroStats {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 24px;
}

.WikiHeroStats article {
  min-width: 112px;
  padding: 12px 14px;
  border: 1px solid rgba(137, 215, 255, .18);
  border-radius: 16px;
  background: rgba(5, 9, 25, .64);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06);
}

.WikiHeroStats strong {
  display: block;
  color: #fff !important;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 28px;
  line-height: .9;
}

.WikiHeroStats span {
  color: var(--wiki-muted) !important;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.WikiHeroAside,
.WikiFrame {
  position: relative;
  border: 1px solid var(--wiki-line);
  border-radius: 20px;
  background:
    radial-gradient(circle at 86% 0%, rgba(132, 100, 255, .18), transparent 38%),
    linear-gradient(145deg, rgba(17, 25, 58, .94), rgba(7, 12, 31, .96));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .06),
    0 15px 34px rgba(0, 0, 0, .28);
}

.WikiHeroAside {
  align-self: end;
  padding: 22px;
  z-index: 1;
}

.WikiMiniTitle {
  display: inline-flex;
  margin-bottom: 16px;
  padding: 7px 10px;
  border: 1px solid rgba(139, 226, 255, .24);
  border-radius: 999px;
  color: #effbff !important;
  background: rgba(6, 11, 29, .7);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.WikiStepList {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.WikiStepList li {
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 10px;
  align-items: center;
  color: #dbeaff !important;
  font-size: 12px;
  line-height: 1.5;
}

.WikiStepList span {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border-radius: 12px;
  background: linear-gradient(135deg, #2a9dd8, #7c57db);
  color: #fff !important;
  font-size: 11px;
  font-weight: 900;
}

.WikiTopMenu {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin: 16px 0 36px;
}

.WikiTopMenu a {
  position: relative;
  min-height: 118px;
  padding: 18px 14px 16px;
  overflow: hidden;
  border: 1px solid rgba(130, 198, 255, .2);
  border-radius: 18px;
  background:
    radial-gradient(circle at 84% 10%, rgba(146, 105, 255, .22), transparent 37%),
    linear-gradient(150deg, rgba(14, 22, 55, .94), rgba(7, 12, 31, .98));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .06),
    0 14px 30px rgba(0, 0, 0, .24);
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.WikiTopMenu a:hover {
  transform: translateY(-2px);
  border-color: rgba(140, 231, 255, .52);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .08),
    0 17px 34px rgba(0, 0, 0, .3),
    0 0 18px rgba(120, 103, 232, .18);
}

.WikiMenuIcon {
  display: grid;
  width: 50px;
  height: 50px;
  place-items: center;
  margin-bottom: 13px;
  border: 1px solid rgba(145, 231, 255, .22);
  border-radius: 16px;
  background: rgba(5, 9, 24, .64);
}

.WikiMenuIcon img {
  max-width: 36px !important;
  max-height: 36px !important;
  filter: drop-shadow(0 4px 10px rgba(110, 206, 255, .42));
}

.WikiMenuIconStack {
  display: flex;
  align-items: center;
  justify-content: center;
}

.WikiMenuIconStack img + img {
  margin-left: -9px;
}

.WikiTopMenu strong {
  display: block;
  color: #fff !important;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 18px;
  line-height: 1.08;
}

.WikiTopMenu small {
  display: block;
  margin-top: 6px;
  color: var(--wiki-muted) !important;
  font-size: 10px;
  font-weight: 800;
  line-height: 1.4;
  text-transform: uppercase;
}

.WikiSection {
  position: relative;
  margin: 0 0 36px !important;
  padding: 58px 24px 24px !important;
  border: 1px solid rgba(128, 196, 255, .2) !important;
  border-radius: 24px;
  background:
    radial-gradient(circle at 8% 0%, rgba(120, 89, 239, .11), transparent 34%),
    linear-gradient(180deg, rgba(10, 16, 40, .96), rgba(5, 8, 21, .98)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .05),
    0 18px 40px rgba(0, 0, 0, .3) !important;
}

.WikiSection::before {
  content: "";
  position: absolute;
  z-index: 2;
  top: -20px;
  left: 50%;
  width: min(520px, calc(100% - 34px));
  height: 58px;
  transform: translateX(-50%);
  background-image: url("../images/ui/aguionOT-content-title.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 58px;
  filter: drop-shadow(0 5px 7px rgba(1, 3, 15, .72));
  pointer-events: none;
}

.WikiSectionHeader {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 22px;
  margin-bottom: 20px;
  position: relative;
  z-index: 3;
}

.WikiSectionHeader h2,
.WikiSummary h2 {
  font-size: clamp(28px, 4vw, 42px);
}

.WikiSectionHeader p {
  max-width: 430px;
  margin: 0;
  color: var(--wiki-muted) !important;
  font-size: 12px;
  text-align: right;
}

.WikiGridTwo,
.WikiSourceGrid,
.GemStoneGrid,
.GemBonusGrid {
  display: grid;
  gap: 14px;
}

.WikiGridTwo {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.WikiGridTwoWide {
  grid-template-columns: minmax(280px, .86fr) minmax(420px, 1.14fr);
}

.WikiSourceGrid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.WikiFrame {
  padding: 20px;
}

.WikiFrame::after {
  content: "";
  position: absolute;
  inset: 9px;
  border: 1px solid rgba(139, 228, 255, .08);
  border-radius: 15px;
  pointer-events: none;
}

.WikiFrame h3 {
  margin: 0 0 10px;
  color: #fff !important;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 22px;
  line-height: 1.08;
}

.WikiFrame p {
  margin: 0;
  color: #c3d3ec !important;
  font-size: 12px;
}

.WikiMediaNote {
  min-height: 210px;
  padding-left: 145px;
}

.WikiIconCluster {
  position: absolute;
  top: 24px;
  left: 22px;
  display: grid;
  width: 96px;
  height: 96px;
  place-items: center;
  border: 1px solid rgba(149, 231, 255, .2);
  border-radius: 28px;
  background:
    radial-gradient(circle, rgba(122, 93, 255, .24), transparent 68%),
    rgba(4, 8, 22, .72);
  box-shadow: inset 0 0 28px rgba(110, 210, 255, .08);
}

.WikiIconCluster img {
  position: absolute;
  max-width: 42px !important;
  max-height: 42px !important;
  filter: drop-shadow(0 5px 12px rgba(100, 209, 255, .35));
}

.WikiIconCluster img:nth-child(1) {
  top: 12px;
  left: 28px;
}

.WikiIconCluster img:nth-child(2) {
  right: 12px;
  bottom: 15px;
}

.WikiIconCluster img:nth-child(3) {
  left: 12px;
  bottom: 13px;
}

.WikiRuleBox {
  min-height: 210px;
  padding-left: 122px;
}

.WikiRuleNumber {
  position: absolute;
  top: 24px;
  left: 22px;
  display: grid;
  width: 76px;
  height: 76px;
  place-items: center;
  border: 1px solid rgba(149, 231, 255, .25);
  border-radius: 24px;
  color: #fff !important;
  background: linear-gradient(135deg, rgba(42, 157, 216, .92), rgba(124, 87, 219, .9));
  font-family: Georgia, "Times New Roman", serif;
  font-size: 30px;
  font-weight: 800;
  box-shadow: 0 14px 28px rgba(0, 0, 0, .28);
}

.WikiBadge {
  display: inline-flex;
  margin-bottom: 12px;
  padding: 6px 9px;
  border: 1px solid rgba(143, 231, 255, .22);
  border-radius: 999px;
  color: var(--wiki-cyan) !important;
  background: rgba(5, 10, 28, .68);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.WikiNotice {
  margin-top: 18px;
  padding: 13px 14px;
  border: 1px solid rgba(240, 210, 132, .25);
  border-radius: 14px;
  background: rgba(240, 210, 132, .08);
  color: #f1e2b0 !important;
  font-size: 12px;
  line-height: 1.55;
}

.WikiNotice strong {
  color: #fff3c7 !important;
}

.WikiFusionLine {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 20px;
}

.WikiFusionLine img {
  width: 44px !important;
  height: 44px !important;
  padding: 7px;
  border: 1px solid rgba(141, 224, 255, .2);
  border-radius: 15px;
  background: rgba(4, 8, 22, .68);
  filter: drop-shadow(0 5px 12px rgba(119, 209, 255, .35));
}

.WikiFusionLine span {
  color: var(--wiki-muted) !important;
  font-size: 22px;
  font-weight: 900;
}

.WikiFusionLine strong {
  padding: 9px 13px;
  border-radius: 999px;
  color: #fff !important;
  background: linear-gradient(135deg, #2a9dd8, #7c57db);
  font-size: 12px;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.WikiTableFrame {
  padding: 10px;
  overflow: hidden;
}

.WikiDataTable {
  width: 100%;
  border-collapse: separate !important;
  border-spacing: 0;
  overflow: hidden;
  border-radius: 15px;
  color: var(--wiki-text) !important;
}

.WikiDataTable th,
.WikiDataTable td {
  padding: 12px 13px;
  border-bottom: 1px solid rgba(130, 190, 255, .12) !important;
  color: var(--wiki-text) !important;
  font-size: 12px;
  line-height: 1.35;
  vertical-align: middle;
}

.WikiDataTable th {
  background: linear-gradient(135deg, rgba(34, 89, 151, .96), rgba(95, 64, 189, .94)) !important;
  color: #fff !important;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.WikiDataTable tr:nth-child(odd) td {
  background: rgba(12, 18, 44, .72) !important;
}

.WikiDataTable tr:nth-child(even) td {
  background: rgba(17, 25, 59, .72) !important;
}

.WikiChance,
.WikiMax {
  display: inline-flex;
  min-width: 54px;
  justify-content: center;
  padding: 5px 8px;
  border: 1px solid rgba(143, 231, 255, .22);
  border-radius: 999px;
  color: #fff !important;
  background: rgba(5, 10, 28, .68);
  font-weight: 900;
}

.GemStoneGrid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.GemStoneCard {
  display: grid;
  grid-template-columns: 74px 1fr;
  gap: 12px 16px;
  align-items: center;
}

.GemStoneIcon {
  display: grid;
  width: 70px;
  height: 70px;
  place-items: center;
  border: 1px solid rgba(145, 231, 255, .2);
  border-radius: 22px;
  background: rgba(4, 8, 22, .72);
}

.GemStoneIcon img {
  max-width: 44px !important;
  max-height: 44px !important;
  filter: drop-shadow(0 5px 12px rgba(110, 207, 255, .38));
}

.GemStoneCard h3 {
  margin-bottom: 5px;
}

.GemStoneCard p {
  display: flex;
  align-items: center;
  gap: 7px;
  color: var(--wiki-muted) !important;
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.GemStoneCard p img {
  width: 20px !important;
  height: 20px !important;
}

.GemStoneCard ul {
  grid-column: 1 / -1;
  display: grid;
  gap: 7px;
  margin: 3px 0 0;
  padding: 0;
  list-style: none;
}

.GemStoneCard li {
  padding: 8px 10px;
  border: 1px solid rgba(130, 190, 255, .11);
  border-radius: 12px;
  background: rgba(5, 10, 27, .46);
  color: #cfe0f5 !important;
  font-size: 11px;
}

.GemStoneCard li strong {
  color: #fff !important;
}

.GemSlotRow {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 7px;
  padding-top: 4px;
}

.GemSlotRow span {
  color: var(--wiki-muted) !important;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.GemSlotRow img {
  width: 24px !important;
  height: 24px !important;
  filter: drop-shadow(0 4px 10px rgba(110, 207, 255, .28));
}

.GemBonusGrid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.GemBonusFamily {
  padding: 18px;
}

.GemBonusFamily header {
  display: grid;
  grid-template-columns: 64px 1fr;
  gap: 13px;
  align-items: center;
  margin-bottom: 14px;
}

.GemFamilyStone {
  display: grid;
  width: 62px;
  height: 62px;
  place-items: center;
  border: 1px solid rgba(145, 231, 255, .2);
  border-radius: 20px;
  background: rgba(4, 8, 22, .72);
}

.GemFamilyStone img {
  max-width: 44px !important;
  max-height: 44px !important;
  filter: drop-shadow(0 5px 12px rgba(110, 207, 255, .38));
}

.GemBonusFamily h3 {
  margin-bottom: 0;
}

.GemSlotRowLabel {
  margin-bottom: 12px;
  padding: 9px 10px;
  border: 1px solid rgba(130, 190, 255, .12);
  border-radius: 13px;
  background: rgba(5, 10, 27, .46);
}

.WikiDataTableCompact th,
.WikiDataTableCompact td {
  padding: 10px;
  font-size: 11px;
}

.WikiInlineIcon {
  width: 23px !important;
  height: 23px !important;
  margin-right: 7px;
  vertical-align: middle;
  filter: drop-shadow(0 4px 9px rgba(110, 207, 255, .28));
}

.GemBonusFamilyViolet {
  border-color: rgba(167, 124, 255, .3);
}

.GemBonusFamilyBlue {
  border-color: rgba(82, 164, 255, .3);
}

.GemBonusFamilyCyan {
  border-color: rgba(132, 231, 255, .3);
}

.GemBonusFamilyGold {
  border-color: rgba(240, 210, 132, .34);
}

.WikiSectionFooter {
  margin-bottom: 0 !important;
}

.WikiSummary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
}

.WikiSummary p {
  max-width: 760px;
  margin: 12px 0 0;
  color: #c7d8f1 !important;
}

@media (max-width: 980px) {
  .WikiHero,
  .WikiGridTwo,
  .WikiGridTwoWide,
  .GemBonusGrid {
    grid-template-columns: 1fr;
  }

  .WikiHeroAside {
    align-self: auto;
  }

  .WikiTopMenu,
  .WikiSourceGrid,
  .GemStoneGrid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  .aguionOTWikiKit {
    padding: 12px;
  }

  .WikiHero {
    min-height: 0;
    padding: 26px;
  }

  .WikiTopMenu,
  .WikiSourceGrid,
  .GemStoneGrid {
    grid-template-columns: 1fr;
  }

  .WikiSection {
    padding: 54px 16px 18px !important;
  }

  .WikiSectionHeader,
  .WikiSummary {
    align-items: flex-start;
    flex-direction: column;
  }

  .WikiSectionHeader p {
    max-width: none;
    text-align: left;
  }

  .WikiMediaNote,
  .WikiRuleBox {
    padding-left: 20px;
    padding-top: 130px;
  }

  .WikiIconCluster,
  .WikiRuleNumber {
    top: 20px;
  }
}
/* === aguionOT WIKI KIT END === */

/* === aguionOT CRAFT RECIPES START === */
.aguionOTGuidePageCraft .aguionOTGuideDataBody > .TableContainer {
  position: relative;
  margin-top: 18px;
  padding-top: 94px;
  overflow: visible;
}

.aguionOTGuidePageCraft .aguionOTGuideDataBody > .TableContainer::before {
  content: "Receitas de Craft";
  position: absolute;
  top: 8px;
  left: 50%;
  z-index: 4;
  display: flex;
  width: min(560px, calc(100% - 28px));
  height: 64px;
  align-items: center;
  justify-content: center;
  transform: translateX(-50%);
  border: 1px solid rgba(145, 231, 255, .22);
  border-radius: 24px;
  background:
    radial-gradient(circle at 14% 50%, rgba(132, 231, 255, .2), transparent 24%),
    radial-gradient(circle at 88% 20%, rgba(164, 118, 255, .24), transparent 25%),
    linear-gradient(135deg, rgba(22, 43, 93, .96), rgba(86, 61, 185, .92));
  color: #fff !important;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(25px, 4vw, 38px);
  font-weight: 800;
  letter-spacing: -.02em;
  text-shadow: 0 4px 18px rgba(0, 0, 0, .65);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .1),
    0 14px 32px rgba(0, 0, 0, .34),
    0 0 22px rgba(113, 97, 231, .18);
}

.aguionOTGuidePageCraft .aguionOTGuideDataBody > .TableContainer::after {
  content: "Itens craftados, requisitos e materiais necessarios";
  position: absolute;
  top: 74px;
  left: 50%;
  z-index: 5;
  transform: translateX(-50%);
  color: #9fb6d8 !important;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
  white-space: nowrap;
}

.aguionOTGuidePageCraft .CaptionContainer,
.aguionOTGuidePageCraft .CaptionContainer + br {
  display: none !important;
}

.aguionOTGuidePageCraft .styled-text3 {
  position: relative;
  display: flex !important;
  width: auto !important;
  min-height: 58px;
  align-items: center;
  margin: 26px 0 15px !important;
  padding: 12px 22px 12px 72px !important;
  overflow: visible;
  border: 1px solid rgba(142, 226, 255, .22);
  border-radius: 20px;
  background:
    radial-gradient(circle at 12% 50%, rgba(132, 231, 255, .18), transparent 28%),
    linear-gradient(135deg, rgba(10, 17, 43, .96), rgba(32, 31, 86, .92));
  color: #fff !important;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 24px !important;
  font-weight: 800 !important;
  letter-spacing: -.02em;
  text-shadow: 0 3px 14px rgba(0, 0, 0, .58);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .06),
    0 12px 26px rgba(0, 0, 0, .26);
}

.aguionOTGuidePageCraft .styled-text3::before {
  content: "";
  position: absolute;
  left: 18px;
  top: 50%;
  width: 36px;
  height: 36px;
  transform: translateY(-50%);
  border: 1px solid rgba(149, 231, 255, .24);
  border-radius: 13px;
  background:
    radial-gradient(circle, rgba(137, 116, 255, .38), transparent 64%),
    rgba(5, 9, 25, .76);
  box-shadow: inset 0 0 18px rgba(128, 220, 255, .08);
}

.aguionOTGuidePageCraft .styled-text3::after {
  content: "";
  position: absolute;
  left: 28px;
  top: 50%;
  width: 16px;
  height: 16px;
  transform: translateY(-50%) rotate(45deg);
  border: 2px solid rgba(132, 231, 255, .84);
  border-radius: 4px;
  box-shadow: 0 0 12px rgba(132, 231, 255, .46);
}

.aguionOTGuidePageCraft .modern-table {
  display: block !important;
  width: 100% !important;
  margin: 0 0 28px !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.aguionOTGuidePageCraft .modern-table thead {
  display: none !important;
}

.aguionOTGuidePageCraft .modern-table tbody {
  display: block !important;
}

.aguionOTGuidePageCraft .modern-table tr {
  display: grid !important;
  grid-template-columns: minmax(170px, .78fr) minmax(150px, .65fr) minmax(310px, 1.45fr);
  gap: 12px;
  align-items: stretch;
  margin: 0 0 14px !important;
  padding: 13px !important;
  overflow: hidden;
  border: 1px solid rgba(129, 191, 255, .18);
  border-radius: 20px;
  background:
    radial-gradient(circle at 92% 12%, rgba(118, 91, 232, .16), transparent 30%),
    linear-gradient(145deg, rgba(13, 21, 54, .96), rgba(7, 12, 31, .98)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .05),
    0 14px 30px rgba(0, 0, 0, .24);
}

.aguionOTGuidePageCraft .modern-table tr:hover {
  border-color: rgba(142, 231, 255, .42);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .07),
    0 17px 34px rgba(0, 0, 0, .28),
    0 0 18px rgba(113, 97, 231, .16);
}

.aguionOTGuidePageCraft .modern-table td {
  position: relative;
  display: flex !important;
  min-height: 116px;
  align-items: center;
  padding: 31px 14px 14px !important;
  border: 1px solid rgba(126, 184, 255, .1) !important;
  border-radius: 16px;
  background: rgba(5, 10, 28, .42) !important;
  color: #dcecff !important;
}

.aguionOTGuidePageCraft .modern-table td::before {
  position: absolute;
  top: 10px;
  left: 13px;
  color: #83e8ff !important;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.aguionOTGuidePageCraft .modern-table td:nth-child(1)::before {
  content: "Item";
}

.aguionOTGuidePageCraft .modern-table td:nth-child(2)::before {
  content: "Requisito";
}

.aguionOTGuidePageCraft .modern-table td:nth-child(3)::before {
  content: "Materiais";
}

.aguionOTGuidePageCraft .modern-table td:first-child > div {
  display: grid !important;
  grid-template-columns: 66px 1fr;
  gap: 13px !important;
  width: 100%;
  align-items: center !important;
  text-align: left !important;
}

.aguionOTGuidePageCraft .modern-table td:first-child > div > div:first-child {
  display: grid !important;
  width: 62px !important;
  height: 62px !important;
  place-items: center;
  overflow: visible;
  border: 1px solid rgba(145, 231, 255, .2);
  border-radius: 18px;
  background:
    radial-gradient(circle, rgba(130, 96, 255, .24), transparent 66%),
    rgba(3, 7, 20, .72);
  box-shadow: inset 0 0 20px rgba(110, 207, 255, .08);
}

.aguionOTGuidePageCraft .modern-table td:first-child img {
  width: auto !important;
  max-width: 54px !important;
  height: auto !important;
  max-height: 54px !important;
  object-fit: contain;
  filter: drop-shadow(0 5px 12px rgba(110, 207, 255, .34));
}

.aguionOTGuidePageCraft .modern-table td:first-child b {
  display: block;
  color: #f7fbff !important;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 16px !important;
  line-height: 1.18;
  text-shadow: 0 3px 12px rgba(0, 0, 0, .5);
}

.aguionOTGuidePageCraft .modern-table td:nth-child(2) span {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  padding: 9px 11px;
  border: 1px solid rgba(129, 191, 255, .16);
  border-radius: 13px;
  background: rgba(12, 19, 46, .72);
  color: #c6d8f0 !important;
  font-size: 12px;
  line-height: 1.45;
}

.aguionOTGuidePageCraft .modern-table td:nth-child(3) > div {
  width: 100%;
  justify-content: flex-start !important;
  gap: 10px !important;
}

.aguionOTGuidePageCraft .requirement-badge {
  position: relative;
  display: grid !important;
  width: 74px !important;
  min-width: 74px !important;
  min-height: 78px !important;
  place-items: center;
  padding: 19px 8px 8px !important;
  border: 1px solid rgba(143, 231, 255, .18) !important;
  border-radius: 16px !important;
  background:
    radial-gradient(circle at 50% 18%, rgba(132, 231, 255, .13), transparent 42%),
    rgba(9, 15, 37, .78) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .05),
    0 8px 18px rgba(0, 0, 0, .2) !important;
}

.aguionOTGuidePageCraft .requirement-badge span {
  position: absolute;
  top: 5px;
  left: 7px;
  right: 7px;
  display: block;
  overflow: hidden;
  color: #fff !important;
  font-size: 11px;
  font-weight: 900;
  line-height: 1.1;
  text-align: center;
  text-overflow: ellipsis;
  text-shadow: 0 2px 6px rgba(0, 0, 0, .62);
  white-space: nowrap;
}

.aguionOTGuidePageCraft .requirement-badge img,
.aguionOTGuidePageCraft .requirement-badge .item-image {
  width: auto !important;
  max-width: 52px !important;
  height: auto !important;
  max-height: 52px !important;
  object-fit: contain;
  filter: drop-shadow(0 5px 11px rgba(110, 207, 255, .32));
}

.aguionOTGuidePageCraft .requirement-badge:hover {
  border-color: rgba(143, 231, 255, .46) !important;
  background:
    radial-gradient(circle at 50% 18%, rgba(132, 231, 255, .19), transparent 44%),
    rgba(13, 22, 55, .86) !important;
}

@media (max-width: 900px) {
  .aguionOTGuidePageCraft .modern-table tr {
    grid-template-columns: 1fr;
  }

  .aguionOTGuidePageCraft .modern-table td {
    min-height: 0;
  }
}

@media (max-width: 560px) {
  .aguionOTGuidePageCraft .aguionOTGuideDataBody > .TableContainer::after {
    white-space: normal;
    text-align: center;
  }

  .aguionOTGuidePageCraft .modern-table td:first-child > div {
    grid-template-columns: 56px 1fr;
  }
}
/* === aguionOT CRAFT RECIPES END === */

/* === aguionOT TASK BOARD START === */
.aguionOTGuidePageTasks .aguionOTGuideDataBody > .TableContainer {
  position: relative;
  margin-top: 18px;
  padding-top: 92px;
  overflow: visible;
}

.aguionOTGuidePageTasks .aguionOTGuideDataBody > .TableContainer::before {
  content: "Quadro de Cacadas";
  position: absolute;
  top: 8px;
  left: 50%;
  z-index: 4;
  display: flex;
  width: min(560px, calc(100% - 28px));
  height: 62px;
  align-items: center;
  justify-content: center;
  transform: translateX(-50%);
  border: 1px solid rgba(135, 224, 255, .24);
  border-radius: 22px 22px 12px 12px;
  background:
    linear-gradient(90deg, rgba(132, 231, 255, .18), transparent 18%, transparent 82%, rgba(167, 124, 255, .16)),
    linear-gradient(135deg, rgba(12, 36, 68, .98), rgba(39, 54, 126, .95));
  color: #fff !important;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(25px, 4vw, 38px);
  font-weight: 800;
  letter-spacing: -.02em;
  text-shadow: 0 4px 18px rgba(0, 0, 0, .65);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .09),
    0 14px 32px rgba(0, 0, 0, .34),
    0 0 20px rgba(82, 180, 255, .14);
}

.aguionOTGuidePageTasks .aguionOTGuideDataBody > .TableContainer::after {
  content: "Alvo, meta, criaturas e recompensas em cards de progresso";
  position: absolute;
  top: 73px;
  left: 50%;
  z-index: 5;
  transform: translateX(-50%);
  color: #9fb6d8 !important;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .13em;
  text-align: center;
  text-transform: uppercase;
  white-space: nowrap;
}

.aguionOTGuidePageTasks .CaptionContainer,
.aguionOTGuidePageTasks .CaptionContainer + br,
.aguionOTGuidePageTasks .TableShadowContainerRightTop,
.aguionOTGuidePageTasks .TableShadowContainer,
.aguionOTGuidePageTasks .TableShadowRightTop,
.aguionOTGuidePageTasks .TableBottomShadow,
.aguionOTGuidePageTasks .TableContentAndRightShadow {
  display: none !important;
  background: transparent !important;
}

.aguionOTGuidePageTasks .Table3,
.aguionOTGuidePageTasks .InnerTableContainer,
.aguionOTGuidePageTasks .TableContentContainer,
.aguionOTGuidePageTasks .TableContent {
  display: block !important;
  width: 100% !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.aguionOTGuidePageTasks .TableContent tbody {
  display: grid !important;
  gap: 13px;
}

.aguionOTGuidePageTasks .TableContent tr:first-child {
  display: none !important;
}

.aguionOTGuidePageTasks .TableContent tr {
  position: relative;
  display: grid !important;
  grid-template-columns: minmax(145px, .72fr) 96px minmax(190px, 1.08fr) minmax(240px, 1.25fr);
  gap: 12px;
  align-items: stretch;
  margin: 0 !important;
  padding: 13px !important;
  overflow: hidden;
  border: 1px solid rgba(121, 197, 255, .18);
  border-radius: 20px;
  background:
    radial-gradient(circle at 94% 14%, rgba(64, 194, 255, .12), transparent 31%),
    linear-gradient(145deg, rgba(9, 17, 42, .96), rgba(5, 10, 28, .98)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .05),
    0 14px 30px rgba(0, 0, 0, .24);
}

.aguionOTGuidePageTasks .TableContent tr::before {
  content: "";
  position: absolute;
  top: 12px;
  bottom: 12px;
  left: 12px;
  width: 4px;
  border-radius: 999px;
  background: linear-gradient(180deg, #80e8ff, #8158e7);
  opacity: .82;
}

.aguionOTGuidePageTasks .TableContent tr:hover {
  border-color: rgba(137, 231, 255, .42);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .07),
    0 18px 36px rgba(0, 0, 0, .28),
    0 0 20px rgba(82, 180, 255, .14);
}

.aguionOTGuidePageTasks .TableContent td {
  position: relative;
  display: flex !important;
  min-height: 120px;
  align-items: center;
  justify-content: center;
  padding: 32px 13px 14px !important;
  border: 1px solid rgba(126, 184, 255, .1) !important;
  border-radius: 16px;
  background: rgba(5, 10, 28, .45) !important;
  color: #dcecff !important;
  text-align: center;
}

.aguionOTGuidePageTasks .TableContent td::before {
  position: absolute;
  top: 10px;
  left: 13px;
  color: #83e8ff !important;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.aguionOTGuidePageTasks .TableContent td:nth-child(1)::before {
  content: "Alvo";
}

.aguionOTGuidePageTasks .TableContent td:nth-child(2)::before {
  content: "Meta";
}

.aguionOTGuidePageTasks .TableContent td:nth-child(3)::before {
  content: "Criaturas";
}

.aguionOTGuidePageTasks .TableContent td:nth-child(4)::before {
  content: "Recompensas";
}

.aguionOTGuidePageTasks .TableContent td:first-child center {
  display: grid;
  gap: 6px;
  justify-items: center;
}

.aguionOTGuidePageTasks .TableContent td:first-child img {
  max-width: 56px !important;
  max-height: 56px !important;
  object-fit: contain;
  padding: 4px;
  border: 1px solid rgba(145, 231, 255, .14);
  border-radius: 14px;
  background: rgba(3, 7, 20, .62);
  filter: drop-shadow(0 5px 12px rgba(110, 207, 255, .28));
}

.aguionOTGuidePageTasks .TableContent td:first-child small,
.aguionOTGuidePageTasks .TableContent td:first-child font,
.aguionOTGuidePageTasks .TableContent td:first-child span {
  color: #fff !important;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 15px !important;
  font-weight: 800;
  line-height: 1.16;
  text-shadow: 0 3px 12px rgba(0, 0, 0, .55);
}

.aguionOTGuidePageTasks .TableContent td:nth-child(2) b,
.aguionOTGuidePageTasks .TableContent td:nth-child(2) font,
.aguionOTGuidePageTasks .TableContent td:nth-child(2) span {
  display: inline-flex;
  min-width: 68px;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  padding: 8px 10px;
  border: 1px solid rgba(132, 231, 255, .22);
  border-radius: 15px;
  background: linear-gradient(135deg, rgba(29, 80, 134, .86), rgba(85, 63, 177, .8));
  color: #fff !important;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 18px !important;
  font-weight: 900;
}

.aguionOTGuidePageTasks .TableContent td:nth-child(3) {
  justify-content: flex-start;
  text-align: left;
}

.aguionOTGuidePageTasks .TableContent td:nth-child(3) center,
.aguionOTGuidePageTasks .TableContent td:nth-child(3) small {
  width: 100%;
  color: #c9dbf2 !important;
  font-size: 12px !important;
  line-height: 1.55;
}

.aguionOTGuidePageTasks .TableContent td:nth-child(3) font,
.aguionOTGuidePageTasks .TableContent td:nth-child(3) b {
  display: inline-flex;
  margin-top: 7px;
  padding: 5px 8px;
  border: 1px solid rgba(240, 210, 132, .26);
  border-radius: 999px;
  background: rgba(240, 210, 132, .08);
  color: #f1d98c !important;
  font-size: 10px !important;
  font-weight: 900;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.aguionOTGuidePageTasks .TableContent td:nth-child(4) {
  justify-content: flex-start;
  text-align: left;
}

.aguionOTGuidePageTasks .TableContent td:nth-child(4) small {
  color: #d7e6fb !important;
  font-size: 12px !important;
  line-height: 1.65;
}

.aguionOTGuidePageTasks .TableContent td:nth-child(4) font,
.aguionOTGuidePageTasks .TableContent td:nth-child(4) b {
  color: #86e8ff !important;
}

.aguionOTGuidePageTasks .TableContent td:nth-child(4) img {
  max-width: 28px !important;
  max-height: 28px !important;
  margin-left: 4px;
  vertical-align: middle;
  filter: drop-shadow(0 4px 10px rgba(110, 207, 255, .24));
}

@media (max-width: 920px) {
  .aguionOTGuidePageTasks .TableContent tr {
    grid-template-columns: 1fr 100px;
  }

  .aguionOTGuidePageTasks .TableContent td:nth-child(3),
  .aguionOTGuidePageTasks .TableContent td:nth-child(4) {
    grid-column: 1 / -1;
  }
}

@media (max-width: 580px) {
  .aguionOTGuidePageTasks .TableContent tr {
    grid-template-columns: 1fr;
  }

  .aguionOTGuidePageTasks .aguionOTGuideDataBody > .TableContainer::after {
    white-space: normal;
  }
}
/* === aguionOT TASK BOARD END === */

/* === aguionOT TASK TOKENS START === */
#tasks_tokens.Box {
  border-left-color: rgba(102, 101, 202, .82);
  border-right-color: rgba(102, 101, 202, .82);
  background: #080d20;
}

#tasks_tokens.Box > .Border_2 > .Border_3 > .BoxContent {
  padding: 0;
  overflow: hidden;
  background:
    radial-gradient(circle at 12% 4%, rgba(108, 77, 218, .18), transparent 28%),
    radial-gradient(circle at 88% 2%, rgba(61, 174, 232, .12), transparent 30%),
    linear-gradient(180deg, #080d21 0%, #050817 100%) !important;
  color: #dcecff;
}

#tasks_tokens.Box .HeaderPagesText,
#tasks_tokens.Box .CaptionContainer,
#tasks_tokens.Box .TableShadowContainerRightTop,
#tasks_tokens.Box .TableShadowContainer,
#tasks_tokens.Box .TableShadowRightTop,
#tasks_tokens.Box .TableBottomShadow {
  display: none !important;
  background: transparent !important;
}

#tasks_tokens.Box .TableContentAndRightShadow {
  display: block !important;
  background: transparent !important;
}

#tasks_tokens.Box > .Border_2 > .Border_3 > .BoxContent > .Border_3 {
  margin: 0 !important;
  padding: 18px 18px 0 !important;
  border: 0 !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(132, 231, 255, .1), transparent 30%),
    linear-gradient(180deg, rgba(8, 13, 33, .98), rgba(5, 8, 21, .98)) !important;
}

#tasks_tokens.Box > .Border_2 > .Border_3 > .BoxContent > .Border_3 > .BoxContent {
  position: relative;
  margin: 0 !important;
  padding: 360px 18px 22px !important;
  overflow: hidden;
  border: 1px solid rgba(129, 191, 255, .22);
  border-radius: 26px;
  background:
    linear-gradient(90deg, rgba(5, 8, 22, .96) 0%, rgba(5, 8, 22, .82) 46%, rgba(5, 8, 22, .38) 100%),
    url('/layouts/global/images/wiki/task-tokens.webp') center/cover no-repeat !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .08),
    0 20px 46px rgba(0, 0, 0, .38) !important;
}

#tasks_tokens.Box > .Border_2 > .Border_3 > .BoxContent > .Border_3 > .BoxContent::before {
  content: "Task Tokens";
  position: absolute;
  left: 34px;
  top: 54px;
  max-width: 460px;
  color: #fff !important;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(46px, 7vw, 72px);
  font-weight: 800;
  line-height: .94;
  letter-spacing: -.045em;
  text-shadow: 0 5px 28px rgba(0, 0, 0, .72);
}

#tasks_tokens.Box > .Border_2 > .Border_3 > .BoxContent > .Border_3 > .BoxContent::after {
  content: "Contratos especiais, comando !tasktoken e recompensas por token";
  position: absolute;
  left: 38px;
  top: 196px;
  max-width: 520px;
  color: #c9dcf4 !important;
  font-size: 13px;
  line-height: 1.7;
  text-shadow: 0 3px 14px rgba(0, 0, 0, .66);
}

#tasks_tokens.Box .Border_3 > .BoxContent > .TableContainer {
  position: relative;
  border: 0 !important;
  background: transparent !important;
}

#tasks_tokens.Box .Border_3 > .BoxContent > .TableContainer::before {
  content: "Como funciona";
  position: absolute;
  z-index: 3;
  top: -72px;
  left: 18px;
  display: inline-flex;
  padding: 8px 12px;
  border: 1px solid rgba(143, 231, 255, .28);
  border-radius: 999px;
  color: #84e7ff !important;
  background: rgba(5, 10, 28, .68);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}

#tasks_tokens.Box .Border_3 > .BoxContent [style*="background: white"],
#tasks_tokens.Box .Border_3 > .BoxContent [style*="background:white"],
#tasks_tokens.Box .Border_3 > .BoxContent [style*="background: linear-gradient(135deg, #ffffff"],
#tasks_tokens.Box .Border_3 > .BoxContent [style*="background: linear-gradient(135deg, #f8faff"],
#tasks_tokens.Box .Border_3 > .BoxContent [style*="background: linear-gradient(135deg, #fff9e6"],
#tasks_tokens.Box .Border_3 > .BoxContent [style*="background: linear-gradient(white"] {
  border-color: rgba(128, 186, 255, .18) !important;
  background:
    radial-gradient(circle at 86% 0%, rgba(132, 100, 255, .15), transparent 38%),
    linear-gradient(145deg, rgba(17, 25, 58, .94), rgba(7, 12, 31, .96)) !important;
  color: #dcecff !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .06),
    0 14px 30px rgba(0, 0, 0, .24) !important;
}

#tasks_tokens.Box .Border_3 > .BoxContent [style*="border-left: 5px"] {
  border-left-color: #84e7ff !important;
}

#tasks_tokens.Box .Border_3 > .BoxContent [style*="color: #1a4c8c"],
#tasks_tokens.Box .Border_3 > .BoxContent [style*="color:#1a4c8c"],
#tasks_tokens.Box .Border_3 > .BoxContent [style*="color: #666"],
#tasks_tokens.Box .Border_3 > .BoxContent [style*="color:#666"],
#tasks_tokens.Box .Border_3 > .BoxContent [style*="color: #e6b800"],
#tasks_tokens.Box .Border_3 > .BoxContent [style*="color:#e6b800"] {
  color: #dcecff !important;
}

#tasks_tokens.Box .Border_3 > .BoxContent [style*="font-weight: 700"] {
  color: #fff !important;
}

#tasks_tokens.Box .Border_3 > .BoxContent img {
  max-width: 100%;
  filter: drop-shadow(0 5px 12px rgba(110, 207, 255, .24));
}

#tasks_tokens.Box > .Border_2 > .Border_3 > .BoxContent > .TableContainer {
  position: relative;
  margin: 30px 18px 24px !important;
  padding-top: 92px;
  overflow: visible;
  background: transparent !important;
}

#tasks_tokens.Box > .Border_2 > .Border_3 > .BoxContent > .TableContainer::before {
  content: "Contratos de Tokens";
  position: absolute;
  top: 8px;
  left: 50%;
  z-index: 4;
  display: flex;
  width: min(560px, calc(100% - 28px));
  height: 62px;
  align-items: center;
  justify-content: center;
  transform: translateX(-50%);
  border: 1px solid rgba(240, 210, 132, .3);
  border-radius: 22px;
  background:
    radial-gradient(circle at 15% 50%, rgba(240, 210, 132, .18), transparent 26%),
    radial-gradient(circle at 88% 20%, rgba(132, 231, 255, .16), transparent 25%),
    linear-gradient(135deg, rgba(42, 33, 82, .96), rgba(111, 74, 39, .9));
  color: #fff !important;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(25px, 4vw, 38px);
  font-weight: 800;
  letter-spacing: -.02em;
  text-shadow: 0 4px 18px rgba(0, 0, 0, .65);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .09),
    0 14px 32px rgba(0, 0, 0, .34),
    0 0 20px rgba(240, 210, 132, .12);
}

#tasks_tokens.Box > .Border_2 > .Border_3 > .BoxContent > .TableContainer::after {
  content: "Complete objetivos maiores e troque progresso por Task Tokens";
  position: absolute;
  top: 73px;
  left: 50%;
  z-index: 5;
  transform: translateX(-50%);
  color: #bfae83 !important;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .13em;
  text-align: center;
  text-transform: uppercase;
  white-space: nowrap;
}

#tasks_tokens.Box .Table4,
#tasks_tokens.Box .Table4 .InnerTableContainer,
#tasks_tokens.Box .Table4 .TableContentContainer,
#tasks_tokens.Box .Table4 .TableContent {
  display: block !important;
  width: 100% !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#tasks_tokens.Box .Table4 .TableContent tbody {
  display: grid !important;
  gap: 13px;
}

#tasks_tokens.Box .Table4 .TableContent tr:first-child,
#tasks_tokens.Box .Table4 .TableContent tr:nth-child(2) {
  display: none !important;
}

#tasks_tokens.Box .Table4 .TableContent tr {
  position: relative;
  display: grid !important;
  grid-template-columns: 120px 96px minmax(220px, 1.18fr) minmax(230px, 1.18fr);
  gap: 12px;
  align-items: stretch;
  margin: 0 !important;
  padding: 13px !important;
  overflow: hidden;
  border: 1px solid rgba(184, 157, 95, .22);
  border-radius: 20px;
  background:
    radial-gradient(circle at 95% 14%, rgba(240, 210, 132, .12), transparent 31%),
    linear-gradient(145deg, rgba(16, 15, 38, .97), rgba(7, 10, 28, .98)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .05),
    0 14px 30px rgba(0, 0, 0, .24);
}

#tasks_tokens.Box .Table4 .TableContent tr::before {
  content: "";
  position: absolute;
  top: 12px;
  bottom: 12px;
  left: 12px;
  width: 4px;
  border-radius: 999px;
  background: linear-gradient(180deg, #f0d284, #7f5aff);
  opacity: .82;
}

#tasks_tokens.Box .Table4 .TableContent td {
  position: relative;
  display: flex !important;
  min-height: 112px;
  align-items: center;
  justify-content: center;
  padding: 32px 13px 14px !important;
  border: 1px solid rgba(184, 157, 95, .12) !important;
  border-radius: 16px;
  background: rgba(5, 10, 28, .45) !important;
  color: #dcecff !important;
  text-align: center;
}

#tasks_tokens.Box .Table4 .TableContent td::before {
  position: absolute;
  top: 10px;
  left: 13px;
  color: #f0d284 !important;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}

#tasks_tokens.Box .Table4 .TableContent td:nth-child(1)::before {
  content: "Contrato";
}

#tasks_tokens.Box .Table4 .TableContent td:nth-child(2)::before {
  content: "Meta";
}

#tasks_tokens.Box .Table4 .TableContent td:nth-child(3)::before {
  content: "Criaturas";
}

#tasks_tokens.Box .Table4 .TableContent td:nth-child(4)::before {
  content: "Token";
}

#tasks_tokens.Box .Table4 .TableContent td:first-child img {
  max-width: 64px !important;
  max-height: 64px !important;
  object-fit: contain;
  padding: 5px;
  border: 1px solid rgba(240, 210, 132, .16);
  border-radius: 16px;
  background: rgba(3, 7, 20, .62);
  filter: drop-shadow(0 5px 12px rgba(240, 210, 132, .18));
}

#tasks_tokens.Box .Table4 .TableContent td:nth-child(2) b,
#tasks_tokens.Box .Table4 .TableContent td:nth-child(2) font {
  display: inline-flex;
  min-width: 68px;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  padding: 8px 10px;
  border: 1px solid rgba(240, 210, 132, .26);
  border-radius: 15px;
  background: linear-gradient(135deg, rgba(111, 74, 39, .9), rgba(91, 65, 170, .78));
  color: #fff !important;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 18px !important;
  font-weight: 900;
}

#tasks_tokens.Box .Table4 .TableContent td:nth-child(3),
#tasks_tokens.Box .Table4 .TableContent td:nth-child(4) {
  justify-content: flex-start;
  text-align: left;
}

#tasks_tokens.Box .Table4 .TableContent td small,
#tasks_tokens.Box .Table4 .TableContent td center,
#tasks_tokens.Box .Table4 .TableContent td a {
  color: #d7e6fb !important;
  font-size: 12px !important;
  line-height: 1.6;
}

#tasks_tokens.Box .Table4 .TableContent td:nth-child(4) img {
  max-width: 28px !important;
  max-height: 28px !important;
  margin-left: 4px;
  vertical-align: middle;
  filter: drop-shadow(0 4px 10px rgba(240, 210, 132, .22));
}

@media (max-width: 920px) {
  #tasks_tokens.Box .Table4 .TableContent tr {
    grid-template-columns: 1fr 100px;
  }

  #tasks_tokens.Box .Table4 .TableContent td:nth-child(3),
  #tasks_tokens.Box .Table4 .TableContent td:nth-child(4) {
    grid-column: 1 / -1;
  }
}

@media (max-width: 600px) {
  #tasks_tokens.Box > .Border_2 > .Border_3 > .BoxContent > .Border_3 > .BoxContent {
    padding-top: 300px !important;
  }

  #tasks_tokens.Box .Table4 .TableContent tr {
    grid-template-columns: 1fr;
  }

  #tasks_tokens.Box > .Border_2 > .Border_3 > .BoxContent > .TableContainer::after {
    white-space: normal;
  }
}
/* === aguionOT TASK TOKENS END === */
/* === aguionOT WIKI GUIDE PAGES END === */

/* === aguionOT MENU BUTTONS START === */
.MenuButton,
.MenuButton .Button {
  width: 178px;
  height: 38px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 178px 38px;
}

.MenuButton {
  z-index: 3;
  background-color: transparent;
}

.MenuButton .Icon {
  top: 3px;
  left: 9px;
  z-index: 3;
}

.MenuButton .Label {
  top: 5px;
  left: 40px;
  width: 124px;
  height: 28px;
  box-sizing: border-box;
  padding: 3px 2px;
  color: #eef4ff;
  font-size: 20px;
  line-height: 22px;
  text-shadow:
    0 1px 0 #050817,
    0 0 4px rgba(101, 217, 255, .78),
    0 0 8px rgba(139, 124, 255, .72);
}

.MenuButton .Extend {
  position: absolute;
  top: 11px;
  right: -3px;
  z-index: 6;
  width: 17px;
  height: 17px;
  box-sizing: border-box;
  border: 1px solid rgba(153, 228, 255, .82);
  border-radius: 5px;
  background: linear-gradient(145deg, #25396d 0%, #101831 52%, #3d2d78 100%) !important;
  box-shadow:
    inset 0 0 4px rgba(101, 217, 255, .4),
    0 0 5px rgba(101, 217, 255, .34);
  transform: rotate(45deg);
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease, background .2s ease;
}

.MenuButton .Extend::before {
  content: '';
  position: absolute;
  top: 4px;
  left: 4px;
  width: 5px;
  height: 5px;
  border-right: 2px solid #c8f3ff;
  border-bottom: 2px solid #c8f3ff;
  filter: drop-shadow(0 0 2px rgba(101, 217, 255, .75));
}

.MenuButton .Extend.is-open {
  border-color: #b59cff;
  background: linear-gradient(145deg, #4e3a98 0%, #171634 56%, #24558c 100%) !important;
  box-shadow:
    inset 0 0 5px rgba(181, 156, 255, .5),
    0 0 7px rgba(139, 124, 255, .58);
  transform: rotate(225deg);
}

.MenuButton .Extend.is-open::before {
  border-color: #f1ebff;
}

.menuitem {
  position: relative;
  margin: 3px 0;
}

.LeftChain,
.RightChain {
  display: none !important;
  background-image: none !important;
}

.Submenu {
  position: relative;
  z-index: 1;
  width: 164px;
  box-sizing: border-box;
  margin: -4px auto 10px;
  padding: 11px 5px 6px;
  overflow: visible;
  border: 1px solid rgba(139, 124, 255, .9);
  border-radius: 5px 5px 9px 9px;
  background:
    radial-gradient(circle at 50% 0%, rgba(104, 92, 201, .25), transparent 54px),
    linear-gradient(180deg, rgba(29, 37, 79, .98) 0%, rgba(12, 18, 43, .98) 100%);
  box-shadow:
    inset 0 0 0 1px rgba(171, 222, 255, .15),
    inset 0 -12px 22px rgba(5, 8, 25, .36),
    0 6px 14px rgba(1, 4, 18, .6),
    0 0 9px rgba(105, 86, 211, .28);
}

.Submenu::before {
  content: '';
  position: absolute;
  z-index: 0;
  top: -8px;
  left: 50%;
  width: 58px;
  height: 12px;
  transform: translateX(-50%);
  border: 1px solid rgba(139, 124, 255, .82);
  border-bottom: 0;
  border-radius: 8px 8px 0 0;
  background: linear-gradient(180deg, #26386a 0%, #161d42 100%);
  box-shadow: 0 -2px 7px rgba(101, 217, 255, .2);
}

.Submenu::after {
  content: '';
  position: absolute;
  z-index: 1;
  top: 2px;
  left: 15px;
  right: 15px;
  height: 1px;
  background: linear-gradient(90deg, transparent, #65d9ff, #8b7cff, #65d9ff, transparent);
  opacity: .7;
}

.Submenuitem {
  position: relative;
  z-index: 2;
  margin: 0;
  padding: 0;
  background-color: transparent !important;
}

.SubmenuitemLabel {
  position: relative;
  min-height: 28px;
  box-sizing: border-box;
  margin: 0;
  padding: 6px 6px 6px 24px;
  overflow: hidden;
  border: 0;
  border-bottom: 1px solid rgba(122, 142, 207, .2);
  background: linear-gradient(90deg, rgba(67, 82, 143, .08), rgba(139, 124, 255, .035));
  color: #e6ecff !important;
  font-family: Arial, sans-serif;
  font-size: 13px;
  font-weight: 600;
  line-height: 16px;
  text-align: left;
  text-shadow: 0 1px 1px rgba(0, 0, 0, .72);
  transition: color .16s ease, background .16s ease, padding-left .16s ease;
}

.SubmenuitemLabel > * {
  color: inherit !important;
}

.Submenu a:last-child .SubmenuitemLabel {
  border-bottom: 0;
}

.SubmenuitemLabel::before {
  content: '\25C6';
  position: absolute;
  top: 50%;
  left: 8px;
  transform: translateY(-50%);
  color: #8b7cff;
  font-size: 7px;
  line-height: 1;
  text-shadow: 0 0 5px rgba(139, 124, 255, .6);
}

.Submenuitem:hover .SubmenuitemLabel {
  padding-left: 27px;
  background: linear-gradient(90deg, rgba(102, 85, 189, .88) 0%, rgba(36, 84, 143, .82) 100%);
  color: #ffffff !important;
  text-shadow: 0 1px 1px #090c1d, 0 0 5px rgba(101, 217, 255, .42);
}

.Submenuitem:hover .SubmenuitemLabel::before {
  color: #a9edff;
}

.ActiveSubmenuItemIcon {
  display: none !important;
}

.Submenu a,
.Submenu a:link,
.Submenu a:visited,
.Submenu a:focus,
.Submenu a:active,
.Submenu a:hover {
  color: inherit;
  text-decoration: none;
}
/* === aguionOT MENU BUTTONS END === */

/* === aguionOT GLOBAL HEADER START === */
#aguionOTGlobalHeader {
  position: fixed;
  z-index: 1000;
  top: 0;
  left: 0;
  width: 100%;
  min-width: 1000px;
  box-sizing: border-box;
  border-top: 1px solid rgba(153, 220, 255, .38);
  border-bottom: 0;
  background:
    radial-gradient(circle at 22% -80%, rgba(91, 99, 220, .38), transparent 34%),
    linear-gradient(180deg, rgba(10, 15, 32, .99) 0%, rgba(5, 9, 21, .99) 100%);
  box-shadow: 0 8px 22px rgba(1, 4, 18, .46);
}

#aguionOTGlobalHeader::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent 5%, #76ddff 34%, #a58cff 50%, #76ddff 66%, transparent 95%);
  opacity: .6;
  pointer-events: none;
}

#aguionOTGlobalHeader::after {
  content: '';
  position: absolute;
  z-index: 8;
  right: 0;
  bottom: -17px;
  left: 0;
  height: 34px;
  background-image: url("../images/ui/aguionOT-header-divider.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 1280px 34px;
  filter:
    drop-shadow(0 2px 3px rgba(1, 4, 18, .72))
    drop-shadow(0 0 4px rgba(112, 89, 234, .28));
  pointer-events: none;
}

.aguionOTGlobalHeaderInner {
  width: 100%;
  max-width: 1280px;
  min-width: 1000px;
  box-sizing: border-box;
  margin: 0 auto;
  padding: 0 15px;
}

#ContentRow {
  top: 230px;
}

#LeftArtwork img {
  top: -200px;
}

#topInfoBar.aguionOTCarouselCard {
  position: relative;
  margin: 8px 14px 18px;
  overflow: hidden;
  border: 0;
  border-radius: 18px;
  background: transparent;
  box-shadow: none;
}

#topInfoBar.aguionOTCarouselCard::before {
  display: none;
}

#topInfoBar.aguionOTCarouselCard::after {
  content: '';
  position: absolute;
  z-index: 3;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-image: url("../images/ui/aguionOT-carousel-frame.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  pointer-events: none;
}

.aguionOTTopbar {
  position: relative;
  z-index: 4;
  min-height: 60px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 0;
  font-family: Arial, sans-serif;
}

.aguionOTBrand,
.aguionOTBrand:link,
.aguionOTBrand:visited,
.aguionOTBrand:hover,
.aguionOTBrand:focus {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  color: #f5f7ff;
  text-decoration: none;
}


.aguionOTBrandName {
  margin-top: -1px;
  color: #f2f5ff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 25px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: .4px;
  text-shadow:
    0 1px 0 #02040d,
    0 0 7px rgba(134, 111, 255, .78);
}

.aguionOTQuickLinks,
.aguionOTTopbarMeta {
  display: flex;
  align-items: center;
  gap: 3px;
}

.aguionOTTopbarMeta {
  margin-left: auto;
  gap: 7px;
}

.aguionOTBoostWidget {
  position: relative;
  left: -5px;
  width: 190px;
  min-height: 0;
  box-sizing: border-box;
  margin: -4px auto 20px;
  padding: 18px 0 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  font-family: Arial, sans-serif;
  filter:
    drop-shadow(0 6px 8px rgba(1, 4, 18, .58))
    drop-shadow(0 0 7px rgba(107, 83, 220, .22));
}

.aguionOTBoostWidgetTitle {
  position: absolute;
  z-index: 3;
  top: 0;
  left: 50%;
  min-width: 112px;
  box-sizing: border-box;
  padding: 3px 15px 4px;
  border: 1px solid rgba(116, 191, 237, .52);
  border-radius: 10px;
  background:
    linear-gradient(180deg, rgba(36, 47, 99, .98), rgba(12, 18, 46, .98));
  color: #f1f4ff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 11px;
  font-weight: 700;
  line-height: 12px;
  letter-spacing: .55px;
  text-align: center;
  text-shadow:
    0 1px 2px #01030c,
    0 0 5px rgba(116, 207, 255, .38);
  text-transform: uppercase;
  transform: translateX(-50%);
  white-space: nowrap;
}

.aguionOTSidebarBoosts {
  position: relative;
  width: 176px;
  height: 76px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  margin: 0 auto;
  padding: 7px 12px 8px;
  background-image: url("../images/ui/aguionOT-boosts-sidebar-frame.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 176px 76px;
}

.aguionOTSidebarBoostItem {
  position: relative;
  width: 70px;
  height: 58px;
  flex: 0 0 70px;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  cursor: help;
}

.aguionOTSidebarBoostSprite {
  width: 48px;
  height: 48px;
  max-width: none;
  object-fit: contain;
  image-rendering: pixelated;
  filter:
    drop-shadow(0 2px 2px rgba(1, 3, 12, .9))
    drop-shadow(0 0 3px rgba(108, 216, 255, .34));
  transition: filter .18s ease, transform .18s ease;
}

.aguionOTSidebarBoostItem:hover .aguionOTSidebarBoostSprite {
  filter:
    brightness(1.12)
    drop-shadow(0 2px 2px rgba(1, 3, 12, .9))
    drop-shadow(0 0 6px rgba(133, 106, 255, .62));
  transform: translateY(-1px) scale(1.06);
}

.aguionOTSidebarBoostLabel {
  position: absolute;
  right: 2px;
  bottom: 0;
  left: 2px;
  overflow: hidden;
  color: #dcecff;
  font-size: 8px;
  font-weight: 700;
  line-height: 9px;
  letter-spacing: .5px;
  text-align: center;
  text-overflow: ellipsis;
  text-shadow:
    0 1px 2px #01030c,
    0 0 4px rgba(100, 205, 255, .34);
  text-transform: uppercase;
  white-space: nowrap;
}

.aguionOTRareDropWidget {
  position: relative;
  width: 190px;
  min-height: 0;
  box-sizing: border-box;
  margin: 18px auto 20px;
  padding: 48px 12px 16px;
  overflow: visible;
  border: 1px solid rgba(122, 205, 255, .42);
  border-radius: 15px;
  background:
    radial-gradient(circle at 50% 0%, rgba(137, 102, 255, .22), transparent 58px),
    radial-gradient(circle at 50% 100%, rgba(255, 214, 88, .12), transparent 68px),
    linear-gradient(180deg, rgba(12, 22, 52, .96), rgba(5, 10, 27, .98));
  color: #e8f0ff;
  box-shadow:
    inset 0 0 0 1px rgba(201, 232, 255, .08),
    inset 0 0 24px rgba(83, 72, 184, .18),
    0 9px 16px rgba(1, 4, 18, .62),
    0 0 10px rgba(98, 83, 212, .24);
  filter:
    drop-shadow(0 0 5px rgba(98, 83, 212, .2));
  font-family: Arial, sans-serif;
}

.aguionOTRareDropWidget::before,
.aguionOTRareDropWidget::after {
  content: '';
  position: absolute;
  z-index: 1;
  top: 48px;
  bottom: 16px;
  width: 1px;
  background: linear-gradient(180deg, transparent, rgba(125, 222, 255, .5) 22%, rgba(145, 104, 255, .34) 70%, transparent);
  pointer-events: none;
}

.aguionOTRareDropWidget::before {
  left: 8px;
}

.aguionOTRareDropWidget::after {
  right: 8px;
}

.aguionOTRareDropHeader {
  position: absolute;
  z-index: 4;
  top: -27px;
  left: -4px;
  width: 198px;
  height: 72px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 8px 22px 0;
  background-image: url("../images/ui/aguionOT-rank-title.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 198px 72px;
  filter: drop-shadow(0 3px 5px rgba(1, 3, 15, .7));
}

.aguionOTRareDropHeader::before,
.aguionOTRareDropHeader::after {
  content: '';
  position: absolute;
  top: 29px;
  width: 8px;
  height: 8px;
  border: 1px solid rgba(255, 214, 88, .8);
  background: radial-gradient(circle, #fff2a8 0%, #d6a72c 42%, rgba(71, 43, 120, .95) 100%);
  box-shadow: 0 0 7px rgba(255, 210, 74, .42);
  transform: rotate(45deg);
}

.aguionOTRareDropHeader::before {
  left: 19px;
}

.aguionOTRareDropHeader::after {
  right: 19px;
}

.aguionOTRareDropHeader strong {
  color: #ffe27a;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 13px;
  font-weight: 800;
  line-height: 16px;
  letter-spacing: 1.3px;
  text-transform: uppercase;
  text-shadow:
    0 1px 2px #02040d,
    0 0 7px rgba(255, 208, 74, .5),
    0 0 10px rgba(137, 102, 255, .28);
}

.aguionOTRareDropKicker {
  display: block;
  color: #c8d8f7;
  font-size: 7px;
  font-weight: 700;
  line-height: 11px;
  letter-spacing: .7px;
  text-transform: uppercase;
}

.aguionOTRareDropBody {
  position: relative;
  z-index: 2;
}

.aguionOTRareDropItem {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 12px;
}

.aguionOTRareDropItemGlow {
  position: absolute;
  top: 11px;
  left: 50%;
  width: 82px;
  height: 82px;
  border-radius: 50%;
  background:
    radial-gradient(circle, rgba(255, 215, 89, .2) 0%, rgba(127, 92, 222, .15) 45%, transparent 72%);
  filter: blur(7px);
  transform: translateX(-50%);
  pointer-events: none;
}

.aguionOTRareDropItemFrame {
  position: relative;
  width: 78px;
  height: 78px;
  box-sizing: border-box;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255, 211, 91, .76);
  border-radius: 18px;
  background:
    radial-gradient(circle at 50% 42%, rgba(92, 71, 181, .32), transparent 62%),
    linear-gradient(145deg, rgba(19, 34, 75, .96), rgba(5, 10, 28, .98));
  box-shadow:
    inset 0 0 0 1px rgba(155, 226, 255, .14),
    inset 0 -10px 18px rgba(1, 4, 18, .28),
    0 6px 11px rgba(1, 4, 18, .54),
    0 0 13px rgba(255, 205, 72, .18);
}

.aguionOTRareDropItemFrame::after {
  content: '';
  position: absolute;
  right: 12px;
  bottom: 9px;
  left: 12px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(120, 220, 255, .55), transparent);
}

.aguionOTRareDropItemFrame img {
  position: relative;
  z-index: 1;
  width: 56px;
  height: 56px;
  display: block;
  image-rendering: pixelated;
  filter:
    drop-shadow(0 3px 3px rgba(1, 3, 12, .9))
    drop-shadow(0 0 5px rgba(255, 214, 88, .22));
}

.aguionOTRareDropItemName {
  max-width: 156px;
  min-height: 36px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 9px;
  padding: 6px 17px;
  overflow: hidden;
  border: 1px solid rgba(255, 222, 103, .6);
  border-radius: 18px;
  background:
    linear-gradient(135deg, rgba(232, 187, 48, .98), rgba(192, 148, 36, .98));
  color: #06112b;
  font-size: 10px;
  font-weight: 900;
  line-height: 12px;
  text-align: center;
  text-transform: uppercase;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .35),
    0 4px 8px rgba(1, 4, 18, .38);
}

.aguionOTRareDropGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 12px;
}

.aguionOTRareDropInfo {
  min-height: 118px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 9px 6px 8px;
  border: 1px solid rgba(122, 205, 255, .32);
  border-radius: 11px;
  background:
    linear-gradient(180deg, rgba(22, 38, 79, .76), rgba(9, 18, 43, .88));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .06),
    inset 0 -8px 14px rgba(1, 4, 18, .18);
}

.aguionOTRareDropInfoTitle {
  margin-bottom: 7px;
  color: #ffe27a;
  font-size: 8px;
  font-weight: 800;
  line-height: 10px;
  letter-spacing: .8px;
  text-transform: uppercase;
}

.aguionOTRareDropPortrait {
  width: 56px;
  height: 56px;
  box-sizing: border-box;
  display: grid;
  place-items: center;
  margin-bottom: 6px;
  overflow: hidden;
  border: 1px solid rgba(124, 214, 255, .52);
  border-radius: 9px;
  background:
    radial-gradient(circle at 50% 42%, rgba(108, 89, 220, .28), transparent 64%),
    rgba(5, 10, 28, .72);
}

.aguionOTRareDropPortrait img {
  max-width: 60px;
  max-height: 60px;
  image-rendering: pixelated;
  filter: drop-shadow(0 2px 3px rgba(1, 3, 12, .82));
}

.aguionOTRareDropName,
.aguionOTRareDropName:link,
.aguionOTRareDropName:visited,
.aguionOTRareDropName:focus {
  max-width: 100%;
  overflow: hidden;
  color: #f3f6ff;
  font-size: 11px;
  font-weight: 800;
  line-height: 13px;
  text-align: center;
  text-decoration: none;
  text-overflow: ellipsis;
  text-shadow: 0 1px 2px rgba(1, 3, 12, .72);
  white-space: nowrap;
}

.aguionOTRareDropPlayer,
.aguionOTRareDropPlayer:link,
.aguionOTRareDropPlayer:visited,
.aguionOTRareDropPlayer:focus {
  color: #8bdfff;
}

.aguionOTRareDropPlayer:hover {
  color: #ffe27a;
  text-decoration: none;
}

.aguionOTRareDropLevel {
  margin-top: 2px;
  color: #9fb4dd;
  font-size: 9px;
  font-weight: 700;
  line-height: 11px;
}

.aguionOTRareDropTime {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 41px;
  box-sizing: border-box;
  padding: 7px 12px;
  border: 1px solid rgba(255, 214, 88, .42);
  border-radius: 22px;
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 211, 91, .13), transparent 58%),
    linear-gradient(90deg, rgba(26, 42, 80, .86), rgba(10, 19, 45, .9));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .07),
    0 4px 9px rgba(1, 4, 18, .34);
}

.aguionOTRareDropTimeIcon {
  width: 22px;
  height: 22px;
  flex: 0 0 22px;
  border: 1px solid rgba(255, 229, 126, .74);
  border-radius: 50%;
  background:
    radial-gradient(circle, #fff1a6 0%, #ddb13f 46%, #554089 100%);
  box-shadow: 0 0 8px rgba(255, 210, 74, .28);
}

.aguionOTRareDropTime small {
  display: block;
  color: #aebfe5;
  font-size: 8px;
  font-weight: 800;
  line-height: 10px;
  letter-spacing: .7px;
  text-transform: uppercase;
}

.aguionOTRareDropTime strong {
  display: block;
  color: #ffe27a;
  font-size: 13px;
  font-weight: 900;
  line-height: 15px;
}

.aguionOTRareDropItem {
  display: grid;
  grid-template-columns: 60px minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  margin: 1px 0 10px;
  padding: 8px 9px;
  border: 1px solid rgba(122, 205, 255, .32);
  border-radius: 11px;
  background:
    linear-gradient(90deg, rgba(23, 40, 84, .78), rgba(8, 17, 43, .88));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .06),
    inset 0 -8px 14px rgba(1, 4, 18, .18);
}

.aguionOTRareDropItemGlow {
  top: 50%;
  left: 32px;
  width: 58px;
  height: 58px;
  transform: translate(-50%, -50%);
}

.aguionOTRareDropItemFrame {
  width: 54px;
  height: 54px;
  border-radius: 10px;
}

.aguionOTRareDropItemFrame img {
  width: 42px;
  height: 42px;
}

.aguionOTRareDropItemMeta {
  min-width: 0;
  text-align: left;
}

.aguionOTRareDropItemMeta small {
  display: block;
  color: #ffe27a;
  font-size: 8px;
  font-weight: 800;
  line-height: 10px;
  letter-spacing: .8px;
  text-transform: uppercase;
}

.aguionOTRareDropItemMeta strong {
  display: block;
  overflow: hidden;
  color: #f3f6ff;
  font-size: 11px;
  font-weight: 900;
  line-height: 14px;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
  text-shadow: 0 1px 2px rgba(1, 3, 12, .72);
}

.aguionOTRareDropDetails {
  display: flex;
  flex-direction: column;
  gap: 7px;
  margin-bottom: 10px;
}

.aguionOTRareDropInfo {
  min-height: 54px;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  grid-template-rows: auto auto;
  column-gap: 8px;
  align-items: center;
  padding: 7px 9px;
  text-align: left;
}

.aguionOTRareDropInfoTitle {
  grid-column: 2;
  margin: 0 0 1px;
  line-height: 10px;
}

.aguionOTRareDropPortrait {
  grid-row: 1 / span 2;
  width: 40px;
  height: 40px;
  margin: 0;
  border-radius: 8px;
}

.aguionOTRareDropPortrait img {
  max-width: 46px;
  max-height: 46px;
}

.aguionOTRareDropName,
.aguionOTRareDropName:link,
.aguionOTRareDropName:visited,
.aguionOTRareDropName:focus {
  grid-column: 2;
  text-align: left;
}

.aguionOTRareDropLevel {
  grid-column: 2;
  margin-top: 0;
  text-align: left;
}

.aguionOTRareDropTime {
  justify-content: flex-start;
  min-height: 36px;
  padding: 6px 10px;
  border-color: rgba(122, 205, 255, .32);
  border-radius: 11px;
  background:
    linear-gradient(90deg, rgba(22, 38, 79, .76), rgba(9, 18, 43, .88));
}

.aguionOTRareDropTimeIcon {
  width: 18px;
  height: 18px;
  flex-basis: 18px;
}

.aguionOTRareDropTime small {
  color: #ffe27a;
}
.aguionOTNavLink,
.aguionOTNavLink:link,
.aguionOTNavLink:visited,
.aguionOTNavLink:focus {
  height: 36px;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0 8px;
  border: 1px solid transparent;
  border-radius: 9px;
  color: #dce6ff;
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
  transition: color .18s ease, border-color .18s ease, background .18s ease, transform .18s ease;
}

.aguionOTNavLink img {
  width: 16px;
  height: 16px;
  object-fit: contain;
  filter: drop-shadow(0 0 4px rgba(91, 205, 255, .42));
}

.aguionOTNavLink:first-child img {
  width: 18px;
  height: 18px;
}

.aguionOTNavLink:hover,
.aguionOTNavLink:active {
  border-color: rgba(130, 113, 238, .55);
  background: linear-gradient(180deg, rgba(75, 75, 159, .44), rgba(32, 42, 91, .42));
  color: #ffffff;
  text-decoration: none;
  transform: translateY(-1px);
}

.aguionOTOnlineStatus,
.aguionOTOnlineStatus:link,
.aguionOTOnlineStatus:visited,
.aguionOTOnlineStatus:focus {
  height: 34px;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 0 11px;
  border: 1px solid rgba(113, 104, 213, .55);
  border-radius: 18px;
  background: rgba(11, 17, 38, .8);
  color: #dce7ff;
  font-size: 11px;
  line-height: 1;
  text-decoration: none;
  box-shadow: inset 0 0 9px rgba(74, 91, 172, .16);
}

.aguionOTOnlineStatus:hover {
  border-color: rgba(105, 220, 255, .68);
  color: #ffffff;
  text-decoration: none;
}

.aguionOTOnlineStatus strong {
  color: #f5f7ff;
  font-size: 12px;
}

.aguionOTOnlineDot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #55df8b;
  box-shadow: 0 0 8px rgba(85, 223, 139, .9);
}

.aguionOTLoginButton,
.aguionOTLoginButton:link,
.aguionOTLoginButton:visited,
.aguionOTLoginButton:focus {
  height: 36px;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 0 13px;
  border: 1px solid rgba(166, 140, 255, .82);
  border-radius: 9px;
  background: linear-gradient(180deg, #4f43a7 0%, #2b2c72 100%);
  color: #ffffff;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: .35px;
  text-decoration: none;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .16),
    0 0 12px rgba(111, 86, 230, .28);
  transition: border-color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease;
}

.aguionOTLoginButton:hover,
.aguionOTLoginButton:active {
  border-color: #86e1ff;
  background: linear-gradient(180deg, #6251c3 0%, #30438d 100%);
  color: #ffffff;
  text-decoration: none;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .2),
    0 0 16px rgba(100, 209, 255, .35);
  transform: translateY(-1px);
}

.aguionOTLoginIcon {
  position: relative;
  width: 14px;
  height: 12px;
  box-sizing: border-box;
  border: 2px solid #dce9ff;
  border-left: 0;
  border-radius: 2px;
}

.aguionOTLoginIcon::before {
  content: '';
  position: absolute;
  top: 3px;
  left: -6px;
  width: 8px;
  height: 2px;
  background: #dce9ff;
  box-shadow: 0 0 4px rgba(125, 220, 255, .72);
}

.aguionOTLoginIcon::after {
  content: '';
  position: absolute;
  top: 1px;
  left: -7px;
  width: 5px;
  height: 5px;
  border-top: 2px solid #dce9ff;
  border-right: 2px solid #dce9ff;
  transform: rotate(45deg);
}

#topInfoBar #statusbar {
  overflow: hidden;
  border-radius: 18px;
  background: transparent;
}

#topInfoBar #carouselExampleCaptions {
  position: relative;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

#topInfoBar #carouselExampleCaptions .carousel-inner {
  border-radius: 18px;
}

#topInfoBar #carouselExampleCaptions .carousel-item img {
  width: calc(100% - 20px);
  height: auto;
  display: block;
  margin: 8px 10px;
  border-radius: 12px;
  aspect-ratio: 1000 / 364;
  object-fit: cover;
}

#topInfoBar .carousel-control-prev,
#topInfoBar .carousel-control-next {
  z-index: 4;
  top: 50%;
  bottom: auto;
  margin-top: 0;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(180, 204, 255, .5);
  border-radius: 50%;
  background: rgba(7, 11, 30, .66);
  color: #fff;
  cursor: pointer;
  opacity: .85;
  transform: translateY(-50%);
  backdrop-filter: blur(5px);
  box-shadow: 0 4px 16px rgba(1, 3, 15, .42);
  transition: opacity .18s ease, border-color .18s ease, background .18s ease, transform .18s ease;
}

#topInfoBar .carousel-control-prev {
  left: 16px;
}

#topInfoBar .carousel-control-next {
  right: 16px;
}

#topInfoBar .carousel-control-prev:hover,
#topInfoBar .carousel-control-next:hover {
  border-color: #a28fff;
  background: rgba(52, 43, 119, .78);
  opacity: 1;
  transform: translateY(-50%) scale(1.05);
}

#topInfoBar .aguionOTCarouselArrow {
  display: block;
  font: 700 28px/1 Arial, sans-serif;
  filter: drop-shadow(0 0 4px rgba(121, 216, 255, .65));
  transform: translateY(-1px);
}

#topInfoBar .carousel-indicators {
  z-index: 5;
  bottom: 8px;
  margin-bottom: 0;
}

#topInfoBar .carousel-indicators [data-bs-target] {
  width: 20px;
  height: 4px;
  margin: 0 4px;
  border: 0;
  border-radius: 4px;
  background-color: rgba(218, 228, 255, .65);
  opacity: .55;
  box-shadow: 0 0 5px rgba(74, 196, 255, .28);
}

#topInfoBar .carousel-indicators .active {
  width: 32px;
  background: linear-gradient(90deg, #67dcff, #a184ff);
  opacity: 1;
  box-shadow: 0 0 8px rgba(121, 107, 245, .75);
}

/* === aguionOT GLOBAL HEADER END === */

/* === aguionOT SIDE CARDS START === */
.aguionOTSideCard {
  position: relative;
  left: -47px;
  width: 208px;
  min-height: 134px;
  box-sizing: border-box;
  margin: 26px 0 24px;
  padding: 48px 18px 16px;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background-color: transparent;
  background-image: url("../images/ui/aguionOT-sidecard-frame.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  box-shadow: none;
  filter:
    drop-shadow(0 8px 10px rgba(1, 4, 18, .66))
    drop-shadow(0 0 7px rgba(98, 83, 212, .34));
  font-family: Arial, sans-serif;
}

.aguionOTSideCard::before {
  display: none;
}

.aguionOTSideCard::after {
  display: none;
}

.aguionOTSideCardHeader {
  position: absolute;
  z-index: 4;
  top: -25px;
  left: -6px;
  width: 220px;
  height: 70px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 0 17px 2px;
  border: 0;
  background-image: url("../images/ui/aguionOT-sidecard-title.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 220px 70px;
  color: #f2f5ff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 1.05px;
  text-align: center;
  text-shadow:
    0 1px 2px #02040d,
    0 0 5px rgba(115, 218, 255, .58);
  filter: drop-shadow(0 3px 5px rgba(1, 3, 15, .7));
}

.aguionOTSideCardGlyph {
  display: none;
}

.aguionOTAccountGlyph {
  border: 2px solid currentColor;
  border-radius: 50%;
}

.aguionOTAccountGlyph::before {
  content: '';
  position: absolute;
  top: 3px;
  left: 4px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: currentColor;
}

.aguionOTAccountGlyph::after {
  content: '';
  position: absolute;
  bottom: 2px;
  left: 2px;
  width: 9px;
  height: 4px;
  border-radius: 6px 6px 2px 2px;
  background: currentColor;
}

.aguionOTDownloadGlyph {
  border: 2px solid currentColor;
  border-top: 0;
  border-radius: 2px;
}

.aguionOTDownloadGlyph::before {
  content: '';
  position: absolute;
  top: -2px;
  left: 6px;
  width: 2px;
  height: 10px;
  background: currentColor;
}

.aguionOTDownloadGlyph::after {
  content: '';
  position: absolute;
  top: 4px;
  left: 4px;
  width: 6px;
  height: 6px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
}

.aguionOTSideCardForm {
  position: relative;
  z-index: 2;
  width: 100%;
  margin: 0;
}

.aguionOTSidePrimaryButton {
  position: relative;
  width: 100%;
  min-height: 43px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  margin: 0;
  padding: 8px 12px;
  overflow: hidden;
  border: 1px solid rgba(120, 211, 255, .7);
  border-radius: 10px;
  background:
    linear-gradient(135deg, rgba(42, 123, 184, .96) 0%, rgba(57, 74, 169, .96) 48%, rgba(92, 58, 173, .96) 100%);
  color: #ffffff;
  cursor: pointer;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 17px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: .25px;
  text-shadow: 0 1px 2px #050817, 0 0 5px rgba(116, 219, 255, .38);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .17),
    inset 0 -8px 14px rgba(10, 13, 56, .2),
    0 5px 12px rgba(3, 8, 30, .4),
    0 0 10px rgba(91, 135, 238, .22);
  transition: border-color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease;
}

.aguionOTSidePrimaryButton::before {
  content: '';
  position: absolute;
  top: 0;
  left: -60%;
  width: 44%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .18), transparent);
  transform: skewX(-18deg);
  transition: left .35s ease;
}

.aguionOTSidePrimaryButton:hover,
.aguionOTSidePrimaryButton:focus {
  border-color: #b7efff;
  outline: 0;
  background:
    linear-gradient(135deg, rgba(50, 145, 204, .98) 0%, rgba(70, 88, 195, .98) 48%, rgba(115, 71, 207, .98) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .22),
    0 7px 15px rgba(3, 8, 30, .48),
    0 0 15px rgba(104, 211, 255, .36);
  transform: translateY(-1px);
}

.aguionOTSidePrimaryButton:hover::before,
.aguionOTSidePrimaryButton:focus::before {
  left: 120%;
}

.aguionOTSidePrimaryButton:active {
  transform: translateY(1px);
}

.aguionOTDownloadButton {
  border-color: rgba(157, 127, 255, .78);
  background:
    linear-gradient(135deg, rgba(39, 100, 177, .98) 0%, rgba(66, 65, 171, .98) 45%, rgba(111, 62, 174, .98) 100%);
}

.aguionOTSideButtonIcon {
  position: relative;
  z-index: 1;
  width: 17px;
  height: 17px;
  flex: 0 0 17px;
  box-sizing: border-box;
  color: #dff7ff;
}

.aguionOTSidePrimaryButton > span:last-child {
  position: relative;
  z-index: 1;
}

.aguionOTLoginSideIcon,
.aguionOTUserIcon {
  border: 2px solid currentColor;
  border-left: 0;
  border-radius: 2px;
}

.aguionOTLoginSideIcon::before {
  content: '';
  position: absolute;
  top: 6px;
  left: -7px;
  width: 9px;
  height: 2px;
  background: currentColor;
}

.aguionOTLoginSideIcon::after {
  content: '';
  position: absolute;
  top: 4px;
  left: -8px;
  width: 6px;
  height: 6px;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
  transform: rotate(45deg);
}

.aguionOTUserIcon {
  border: 0;
}

.aguionOTUserIcon::before {
  content: '';
  position: absolute;
  top: 0;
  left: 5px;
  width: 7px;
  height: 7px;
  border: 2px solid currentColor;
  border-radius: 50%;
}

.aguionOTUserIcon::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 1px;
  width: 15px;
  height: 7px;
  box-sizing: border-box;
  border: 2px solid currentColor;
  border-radius: 10px 10px 3px 3px;
}

.aguionOTDownloadSideIcon {
  border-bottom: 2px solid currentColor;
}

.aguionOTDownloadSideIcon::before {
  content: '';
  position: absolute;
  top: 0;
  left: 7px;
  width: 2px;
  height: 11px;
  background: currentColor;
}

.aguionOTDownloadSideIcon::after {
  content: '';
  position: absolute;
  top: 4px;
  left: 4px;
  width: 7px;
  height: 7px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
}

.aguionOTSideSecondaryLink,
.aguionOTSideSecondaryLink:link,
.aguionOTSideSecondaryLink:visited,
.aguionOTSideSecondaryLink:focus {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  margin-top: 7px;
  padding: 3px 4px 1px;
  color: #b9c9ea;
  font-size: 11px;
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
  transition: color .16s ease, gap .16s ease;
}

.aguionOTSideSecondaryLink:hover {
  gap: 10px;
  color: #87e2ff;
  text-decoration: none;
}

.aguionOTSideLinkArrow {
  width: 6px;
  height: 6px;
  border-top: 1px solid currentColor;
  border-right: 1px solid currentColor;
  transform: rotate(45deg);
}

.aguionOTDownloadCard {
  min-height: 125px;
  margin-top: 28px;
  margin-bottom: 22px;
  padding-bottom: 15px;
}

.aguionOTSideCardNote {
  position: relative;
  z-index: 2;
  display: block;
  margin-top: 7px;
  color: #8193bd;
  font-size: 9px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: .8px;
  text-align: center;
  text-transform: uppercase;
}
/* === aguionOT SIDE CARDS END === */

/* === aguionOT TOP LEVELS START === */
.aguionOTRankWidget {
  position: relative;
  left: -5px;
  width: 190px;
  min-height: 535px;
  box-sizing: border-box;
  margin: 0 auto 18px;
  padding: 58px 18px 24px;
  border: 0;
  background-color: transparent;
  background-image: url("../images/ui/aguionOT-rank-frame.png");
  background-repeat: no-repeat;
  background-position: center top;
  background-size: 190px 535px;
  box-shadow: none;
  filter:
    drop-shadow(0 9px 12px rgba(1, 4, 18, .7))
    drop-shadow(0 0 8px rgba(97, 81, 210, .34));
  font-family: Arial, sans-serif;
}

.aguionOTRankHeader {
  position: absolute;
  z-index: 6;
  top: -29px;
  left: -4px;
  width: 198px;
  height: 72px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 7px 30px 0;
  background-image: url("../images/ui/aguionOT-rank-title.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 198px 72px;
  filter: drop-shadow(0 5px 6px rgba(1, 3, 15, .76));
}

.aguionOTRankHeaderText {
  color: #f0f4ff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: .9px;
  text-align: center;
  text-transform: uppercase;
  text-shadow:
    0 1px 2px #02040e,
    0 0 7px rgba(120, 216, 255, .62),
    0 0 10px rgba(142, 104, 255, .38);
}

.aguionOTRankPlayers {
  position: relative;
  z-index: 3;
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 0 12px;
}

.aguionOTRankPlayer {
  position: relative;
  min-height: 68px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 7px 6px;
  overflow: visible;
  border: 1px solid rgba(107, 153, 215, .3);
  border-radius: 8px;
  background:
    linear-gradient(110deg, rgba(29, 43, 86, .7) 0%, rgba(13, 22, 52, .78) 62%, rgba(27, 18, 62, .72) 100%);
  box-shadow:
    inset 0 1px 0 rgba(191, 229, 255, .07),
    inset 0 -7px 13px rgba(2, 5, 18, .14),
    0 2px 6px rgba(1, 4, 18, .28);
  transition: border-color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease;
}

.aguionOTRankPlayer::after {
  content: '';
  position: absolute;
  top: 0;
  left: 13px;
  right: 13px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(104, 216, 255, .35), transparent);
}

.aguionOTRankPlayer:hover {
  border-color: rgba(135, 118, 242, .72);
  background:
    linear-gradient(110deg, rgba(43, 61, 119, .92) 0%, rgba(21, 34, 76, .95) 58%, rgba(45, 27, 91, .92) 100%);
  box-shadow:
    inset 0 1px 0 rgba(204, 236, 255, .12),
    0 5px 11px rgba(1, 4, 18, .42),
    0 0 9px rgba(103, 84, 217, .22);
  transform: translateY(-1px);
}

.aguionOTRankMedal {
  position: absolute;
  z-index: 5;
  top: -5px;
  left: -5px;
  width: 22px;
  height: 22px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(219, 232, 255, .82);
  border-radius: 50%;
  background: linear-gradient(145deg, #5f6e9f, #27335f);
  color: #ffffff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  text-shadow: 0 1px 1px #050716;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .34),
    0 2px 5px rgba(1, 3, 15, .7),
    0 0 6px rgba(107, 194, 255, .3);
}

.aguionOTRankPosition1 .aguionOTRankMedal {
  border-color: #ded3ff;
  background: linear-gradient(145deg, #b68cff, #5d3db2 58%, #302263);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .42),
    0 2px 5px rgba(1, 3, 15, .72),
    0 0 9px rgba(164, 116, 255, .72);
}

.aguionOTRankPosition2 .aguionOTRankMedal {
  border-color: #d9f7ff;
  background: linear-gradient(145deg, #8eeaff, #397eaa 58%, #234869);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .4),
    0 2px 5px rgba(1, 3, 15, .72),
    0 0 8px rgba(102, 218, 255, .62);
}

.aguionOTRankPosition3 .aguionOTRankMedal {
  border-color: #f0ebff;
  background: linear-gradient(145deg, #c5b7e3, #6f628c 60%, #3c3454);
}

.aguionOTRankOutfit {
  position: relative;
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border: 1px solid rgba(127, 216, 255, .68);
  border-radius: 8px;
  background:
    radial-gradient(circle at 50% 44%, rgba(76, 125, 199, .26), transparent 64%),
    rgba(4, 9, 25, .72);
  box-shadow:
    inset 0 0 8px rgba(95, 84, 202, .16),
    0 0 6px rgba(72, 177, 231, .13);
}

.aguionOTRankPosition1 .aguionOTRankOutfit {
  border-color: rgba(176, 137, 255, .88);
  box-shadow:
    inset 0 0 10px rgba(111, 75, 213, .26),
    0 0 8px rgba(151, 105, 255, .3);
}

.aguionOTRankOutfit img {
  width: 60px;
  height: 60px;
  max-width: none;
  object-fit: contain;
  transform: translate(-5px, -5px);
  image-rendering: auto;
}

.aguionOTRankInfo {
  min-width: 0;
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 3px;
  padding-top: 1px;
  text-align: left;
}

.aguionOTRankName,
.aguionOTRankName:link,
.aguionOTRankName:visited,
.aguionOTRankName:focus {
  width: 100%;
  overflow: hidden;
  color: #8bdfff;
  font-size: 11px;
  font-weight: 700;
  line-height: 13px;
  text-align: left;
  text-decoration: none;
  text-overflow: ellipsis;
  text-shadow: 0 0 5px rgba(82, 185, 255, .25);
  white-space: nowrap;
}

.aguionOTRankName:hover {
  color: #c9f4ff;
  text-decoration: none;
}

.aguionOTRankLevel {
  color: #c2a4ff;
  font-size: 11px;
  font-weight: 800;
  line-height: 12px;
  text-shadow: 0 0 5px rgba(143, 104, 255, .28);
}

.aguionOTRankVocation {
  width: 100%;
  overflow: hidden;
  color: #eef3ff;
  font-size: 10px;
  line-height: 12px;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aguionOTRankAllButton,
.aguionOTRankAllButton:link,
.aguionOTRankAllButton:visited,
.aguionOTRankAllButton:focus {
  position: relative;
  z-index: 4;
  width: 142px;
  height: 39px;
  min-height: 0;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 10px auto 0;
  padding: 0 26px;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background-color: transparent;
  background-image: url("../images/ui/aguionOT-rank-button.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 142px 39px;
  color: #ffffff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  text-shadow:
    0 1px 2px #02040e,
    0 0 5px rgba(122, 207, 255, .42);
  box-shadow: none;
  filter:
    drop-shadow(0 4px 5px rgba(1, 4, 18, .58))
    drop-shadow(0 0 5px rgba(102, 80, 215, .2));
  transition: filter .18s ease, transform .18s ease;
}

.aguionOTRankAllButton::before {
  content: none;
}

.aguionOTRankAllButton:hover {
  color: #ffffff;
  text-decoration: none;
  filter:
    brightness(1.14)
    drop-shadow(0 5px 7px rgba(1, 4, 18, .64))
    drop-shadow(0 0 8px rgba(117, 94, 235, .34));
  transform: translateY(-1px);
}

.aguionOTRankAllButton:hover::before {
  left: 120%;
}

.aguionOTRankAllIcon {
  display: none;
}

.aguionOTRankAllIcon::before,
.aguionOTRankAllIcon::after {
  content: '';
  position: absolute;
  background: #dff7ff;
}

.aguionOTRankAllIcon::before {
  top: 4px;
  left: 2px;
  width: 5px;
  height: 2px;
}

.aguionOTRankAllIcon::after {
  top: 2px;
  right: 2px;
  width: 2px;
  height: 5px;
}

.aguionOTRankAllButton > span:last-child {
  position: relative;
  z-index: 1;
}
/* === aguionOT TOP LEVELS END === */

/* === aguionOT NEWS PANELS START === */
#NewsTicker,
#FeaturedArticle {
  position: relative;
  box-sizing: border-box;
  margin: 31px 14px 28px;
  padding: 42px 17px 17px;
  overflow: visible;
  border: 0;
  border-radius: 17px;
  background: transparent;
  color: #dfe8ff;
  font-size: 9pt;
  box-shadow:
    0 12px 26px rgba(1, 4, 18, .55),
    0 0 20px rgba(86, 69, 193, .2);
}

#NewsTicker::before,
#FeaturedArticle::before {
  content: '';
  position: absolute;
  z-index: 22;
  top: -22px;
  right: 0;
  left: 0;
  width: auto;
  height: 60px;
  background-image: url("../images/ui/aguionOT-content-title.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 60px;
  pointer-events: none;
  filter: drop-shadow(0 5px 6px rgba(1, 3, 15, .72));
}

#NewsTicker::after,
#FeaturedArticle::after {
  content: '';
  position: absolute;
  z-index: 12;
  top: 38px;
  right: 0;
  bottom: 0;
  left: 0;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  pointer-events: none;
  filter: drop-shadow(0 0 7px rgba(95, 82, 205, .25));
}

#NewsTicker::after {
  background-image: url("../images/ui/aguionOT-ticker-frame.png");
}

#FeaturedArticle::after {
  background-image: url("../images/ui/aguionOT-featured-frame.png");
}

#NewsTicker > .Corner-tl,
#NewsTicker > .Corner-tr,
#NewsTicker > .CornerWrapper-b,
#NewsTicker > .Border_1,
#NewsTicker > .BorderTitleText,
#FeaturedArticle > .Corner-tl,
#FeaturedArticle > .Corner-tr,
#FeaturedArticle > .CornerWrapper-b,
#FeaturedArticle > .Border_1,
#FeaturedArticle > .BorderTitleText {
  display: none !important;
}

#NewsTicker > .Border_2,
#NewsTicker > .Border_2 > .Border_3,
#FeaturedArticle > .Border_2,
#FeaturedArticle > .Border_2 > .Border_3 {
  position: relative;
  z-index: 3;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
}

#NewsTicker .HeaderPagesText,
#FeaturedArticle .HeaderPagesText {
  z-index: 25;
  top: -2px;
  right: 74px;
  left: 74px;
  color: #f2f5ff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 18px;
  font-weight: 700;
  line-height: 32px;
  letter-spacing: .6px;
  text-align: center;
  text-shadow:
    0 1px 2px #02040e,
    0 0 7px rgba(107, 211, 255, .58),
    0 0 10px rgba(137, 102, 255, .32);
}

.Content #NewsTicker .BoxContent,
.Content #FeaturedArticle .BoxContent {
  position: relative;
  z-index: 4;
  box-sizing: border-box;
  height: auto !important;
  border-radius: 13px;
  background-color: rgba(7, 13, 34, .9);
  background-image: none !important;
  color: #dfe8ff;
  box-shadow:
    inset 0 0 0 1px rgba(121, 149, 226, .14),
    inset 0 0 22px rgba(65, 64, 151, .12);
}

.Content #NewsTicker .BoxContent {
  min-height: 92px;
  padding: 13px 17px 14px;
}

.Content #NewsTicker .BoxContent .Row {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  margin: 0 0 5px !important;
  cursor: pointer;
}

.Content #NewsTicker .BoxContent .Row:last-child {
  margin-bottom: 0 !important;
}

.Content #NewsTicker .BoxContent .Odd,
.Content #NewsTicker .BoxContent .Even {
  position: relative;
  min-height: 28px;
  box-sizing: border-box;
  padding: 6px 35px 6px 35px;
  border: 1px solid rgba(97, 122, 193, .28);
  border-radius: 8px;
  background:
    linear-gradient(90deg, rgba(35, 48, 101, .64), rgba(13, 24, 59, .78) 62%, rgba(37, 22, 75, .68));
  box-shadow:
    inset 0 1px 0 rgba(205, 235, 255, .06),
    0 2px 6px rgba(1, 3, 15, .24);
  transition: border-color .16s ease, background .16s ease, transform .16s ease;
}

.Content #NewsTicker .BoxContent .Even {
  background:
    linear-gradient(90deg, rgba(27, 40, 88, .62), rgba(10, 20, 51, .8) 62%, rgba(29, 19, 66, .7));
}

.Content #NewsTicker .Row:hover > .Odd,
.Content #NewsTicker .Row:hover > .Even {
  border-color: rgba(126, 113, 231, .64);
  background:
    linear-gradient(90deg, rgba(49, 68, 131, .78), rgba(19, 34, 76, .9) 60%, rgba(53, 29, 99, .82));
  transform: translateX(2px);
}

.Content #NewsTicker .NewsTickerIcon {
  top: 50%;
  left: 9px;
  width: 18px;
  height: 18px;
  box-sizing: border-box;
  border: 1px solid rgba(121, 211, 255, .55);
  border-radius: 5px;
  background-color: rgba(5, 10, 28, .85);
  background-position: center;
  background-size: 16px 16px;
  transform: translateY(-50%);
  box-shadow: 0 0 6px rgba(90, 180, 239, .2);
}

.Content #NewsTicker .NewsTickerText {
  margin-left: 0;
  color: #dce6ff;
  font-size: 11px;
  line-height: 16px;
}

.Content #NewsTicker .NewsTickerDate {
  top: 0;
  width: 87px;
  color: #91a7d4;
  font-size: 9px;
  line-height: 16px;
}

.Content #NewsTicker .NewsTickerTime {
  top: 17px;
  color: #879ac6;
  font-size: 9px;
}

.Content #NewsTicker .NewsTickerTextContainer {
  min-width: 0;
  margin-right: 0;
  margin-left: 92px;
}

.Content #NewsTicker .NewsTickerShortText,
.Content #NewsTicker .NewsTickerFullText {
  min-width: 0;
  color: #e6ecff;
}

.Content #NewsTicker .NewsTickerShortText {
  height: 16px;
}

.Content #NewsTicker .NewsTickerShortText p,
.Content #NewsTicker .NewsTickerFullText p {
  color: inherit;
  line-height: 16px;
  text-align: left;
}

.Content #NewsTicker .NewsTickerShortText b,
.Content #NewsTicker .NewsTickerFullText b {
  color: #bba4ff;
}

.Content #NewsTicker .NewsTickerExtend {
  position: absolute;
  z-index: 10;
  top: 50%;
  right: 9px;
  width: 16px;
  height: 16px;
  box-sizing: border-box;
  float: none;
  border: 1px solid rgba(142, 220, 255, .72);
  border-radius: 5px;
  background-image: none !important;
  background:
    linear-gradient(145deg, rgba(58, 77, 154, .95), rgba(24, 31, 76, .98) 60%, rgba(76, 44, 132, .96));
  box-shadow:
    inset 0 0 4px rgba(113, 207, 255, .28),
    0 0 6px rgba(91, 118, 226, .28);
  transform: translateY(-50%) rotate(45deg);
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.Content #NewsTicker .NewsTickerExtend::before {
  content: '';
  position: absolute;
  top: 4px;
  left: 4px;
  width: 5px;
  height: 5px;
  border-right: 2px solid #dff7ff;
  border-bottom: 2px solid #dff7ff;
}

.Content #NewsTicker .NewsTickerExtend.is-open {
  border-color: #c3aaff;
  box-shadow:
    inset 0 0 5px rgba(165, 124, 255, .34),
    0 0 8px rgba(126, 100, 238, .42);
  transform: translateY(-50%) rotate(225deg);
}

.Content #FeaturedArticle .BoxContent {
  min-height: 260px;
  padding: 20px 23px 22px;
  color: #dce5ff;
  font-family: Arial, sans-serif;
  font-size: 13px;
  line-height: 16px;
}

.Content #FeaturedArticle .BoxContent b {
  color: #f3f5ff;
}

.Content #FeaturedArticle .BoxContent center {
  color: #c9d6f4;
}

.Content #FeaturedArticle #TeaserThumbnail {
  top: 0;
  right: 0;
  width: 164px;
  height: 110px;
  margin: 0 0 12px 18px;
  overflow: hidden;
  border: 1px solid rgba(142, 115, 231, .78);
  border-radius: 11px;
  background: #050817;
  box-shadow:
    0 7px 16px rgba(1, 4, 18, .48),
    0 0 10px rgba(93, 79, 201, .25);
}

.Content #FeaturedArticle #TeaserThumbnail > a:first-child,
.Content #FeaturedArticle #TeaserThumbnail > a:first-child img {
  width: 100% !important;
  height: 100%;
  display: block;
  object-fit: cover;
}

.Content #FeaturedArticle .BoxContent > div:not(#TeaserThumbnail) {
  top: 0 !important;
}

.Content #FeaturedArticle .BoxContent font {
  color: inherit;
  font-family: inherit;
}
/* === aguionOT NEWS PANELS END === */

/* === aguionOT LATEST NEWS START === */
#latestnews {
  position: relative;
  box-sizing: border-box;
  margin: 31px 14px 30px;
  padding: 42px 17px 18px;
  overflow: visible;
  border: 0;
  border-radius: 17px;
  background: transparent;
  color: #dfe8ff;
  font-size: 13px;
  box-shadow:
    0 12px 26px rgba(1, 4, 18, .55),
    0 0 20px rgba(86, 69, 193, .2);
}

#latestnews::before {
  content: '';
  position: absolute;
  z-index: 22;
  top: -22px;
  right: 0;
  left: 0;
  width: auto;
  height: 60px;
  background-image: url("../images/ui/aguionOT-content-title.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 60px;
  pointer-events: none;
  filter: drop-shadow(0 5px 6px rgba(1, 3, 15, .72));
}

#latestnews::after {
  content: '';
  position: absolute;
  z-index: 12;
  top: 38px;
  right: 0;
  bottom: 0;
  left: 0;
  background-image: url("../images/ui/aguionOT-featured-frame.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  pointer-events: none;
  filter: drop-shadow(0 0 7px rgba(95, 82, 205, .25));
}

#latestnews > .Corner-tl,
#latestnews > .Corner-tr,
#latestnews > .CornerWrapper-b,
#latestnews > .Border_1,
#latestnews > .BorderTitleText {
  display: none !important;
}

#latestnews > .Border_2,
#latestnews > .Border_2 > .Border_3 {
  position: relative;
  z-index: 3;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
}

.Content #latestnews .BoxContent {
  position: relative;
  z-index: 4;
  box-sizing: border-box;
  min-height: 285px;
  height: auto !important;
  padding: 20px 23px 22px;
  border-radius: 13px;
  background-color: rgba(7, 13, 34, .92);
  background-image: none !important;
  color: #dfe8ff;
  font-family: Arial, sans-serif;
  font-size: 13px;
  line-height: 18px;
  box-shadow:
    inset 0 0 0 1px rgba(121, 149, 226, .14),
    inset 0 0 28px rgba(65, 64, 151, .14);
}

#latestnews .HeaderPagesText {
  z-index: 25;
  top: -42px;
  right: 74px;
  left: 74px;
  color: #f2f5ff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 18px;
  font-weight: 700;
  line-height: 32px;
  letter-spacing: .6px;
  text-align: center;
  text-shadow:
    0 1px 2px #02040e,
    0 0 7px rgba(107, 211, 255, .58),
    0 0 10px rgba(137, 102, 255, .32);
}

.Content #latestnews .bg-body {
  padding: 0;
  border: 0;
  background: none !important;
  color: #dfe8ff;
}

.Content #latestnews .topic--list {
  color: #dfe8ff;
}

.Content #latestnews .NewsHeadline {
  margin: 0 0 16px !important;
}

.Content #latestnews .NewsHeadlineBackground {
  position: relative;
  display: flex;
  min-height: 46px;
  height: auto;
  box-sizing: border-box;
  align-items: center;
  gap: 12px;
  margin: 0;
  padding: 7px 16px;
  overflow: hidden;
  border: 1px solid rgba(125, 183, 255, .44);
  border-radius: 11px;
  background-image: none !important;
  background:
    linear-gradient(105deg, rgba(41, 63, 127, .94) 0%, rgba(18, 31, 75, .98) 58%, rgba(60, 34, 112, .94) 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(224, 245, 255, .11),
    inset 0 0 16px rgba(95, 100, 220, .13),
    0 5px 12px rgba(1, 4, 18, .34);
}

.Content #latestnews .NewsHeadlineBackground::after {
  content: '';
  position: absolute;
  top: 0;
  left: -34%;
  width: 24%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(188, 235, 255, .12), transparent);
  transform: skewX(-20deg);
  pointer-events: none;
}

.Content #latestnews .NewsHeadlineIcon {
  position: relative;
  top: auto;
  left: auto;
  z-index: 2;
  width: 28px;
  height: 28px;
  box-sizing: border-box;
  flex: 0 0 28px;
  margin: 0;
  padding: 4px;
  border: 1px solid rgba(150, 215, 255, .58);
  border-radius: 8px;
  background: rgba(5, 10, 28, .7);
  object-fit: contain;
  box-shadow: 0 0 8px rgba(90, 180, 239, .2);
}

.Content #latestnews .NewsHeadlineDate {
  position: relative;
  top: auto;
  left: auto;
  z-index: 2;
  width: auto;
  flex: 0 0 auto;
  color: #9eb6e5;
  font-size: 10px;
  font-weight: 700;
  line-height: 16px;
  letter-spacing: .2px;
  white-space: nowrap;
}

.Content #latestnews .NewsHeadlineText {
  position: relative;
  top: auto;
  left: auto;
  z-index: 2;
  min-width: 0;
  width: auto;
  flex: 1 1 auto;
  color: #f1f4ff;
  font-size: 14px;
  font-weight: 700;
  line-height: 18px;
  text-shadow: 0 0 7px rgba(138, 111, 242, .26);
}

.Content #latestnews .panel,
.Content #latestnews .panel-body {
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  color: inherit;
  box-shadow: none;
}

.Content #latestnews #news-body {
  color: #dfe8ff;
  font-size: 13px;
  line-height: 19px;
}

.Content #latestnews #news-body:first-letter {
  color: #bca6ff;
}

.Content #latestnews b,
.Content #latestnews strong {
  color: #f4f6ff;
}

.Content #latestnews a,
.Content #latestnews a:link,
.Content #latestnews a:visited {
  color: #82dcff;
  font-weight: 700;
  text-decoration: none;
}

.Content #latestnews a:hover {
  color: #c8f1ff;
  text-shadow: 0 0 7px rgba(112, 211, 255, .45);
}

.Content #latestnews hr {
  height: 1px;
  margin: 20px 0 13px !important;
  border: 0;
  background:
    linear-gradient(90deg, transparent, rgba(113, 153, 231, .48) 15%, rgba(153, 122, 239, .56) 50%, rgba(113, 153, 231, .48) 85%, transparent);
}

.Content #latestnews .topic--list > .panel-body:last-of-type {
  box-sizing: border-box;
  padding: 9px 13px;
  border: 1px solid rgba(104, 130, 199, .25);
  border-radius: 8px;
  background:
    linear-gradient(90deg, rgba(27, 40, 88, .58), rgba(12, 23, 56, .72) 65%, rgba(39, 23, 78, .62));
}

.Content #latestnews .topic--list > .panel-body:last-of-type font {
  color: #9eb1dc !important;
}
/* === aguionOT LATEST NEWS END === */

/* === aguionOT ACCOUNT MANAGEMENT SKIN START === */
.Content .aguionOTAccountPage {
  --account-bg: rgba(5, 13, 36, .92);
  --account-bg-2: rgba(12, 24, 58, .86);
  --account-line: rgba(131, 218, 255, .72);
  --account-line-soft: rgba(110, 153, 224, .34);
  --account-violet: rgba(147, 93, 255, .78);
  --account-text: #edf4ff;
  --account-muted: #aec2e7;
  --account-gold: #ffe27b;
  box-sizing: border-box;
  width: 100%;
  color: var(--account-text);
  font-size: 13px;
  line-height: 1.45;
}

.Content .aguionOTAccountPage *,
.Content .aguionOTAccountPage *::before,
.Content .aguionOTAccountPage *::after {
  box-sizing: border-box;
}

.Content .aguionOTAccountPage .topic--body {
  width: 100% !important;
}

.Content .aguionOTAccountPage center table:first-child {
  margin: 4px auto 14px;
  color: #f7fbff;
  text-shadow: 0 1px 0 #020612, 0 0 10px rgba(125, 199, 255, .55);
}

.Content .aguionOTAccountPage center table:first-child td[style*="font-size"] {
  color: #fff7d6 !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: 18px !important;
  letter-spacing: .2px;
}

.Content .aguionOTAccountPage .TableContainer {
  position: relative;
  width: 100%;
  margin: 0 0 18px;
  padding: 1px;
  border: 1px solid rgba(177, 217, 255, .58) !important;
  border-radius: 14px;
  background:
    radial-gradient(circle at 8% 0%, rgba(125, 79, 255, .22), transparent 34%),
    radial-gradient(circle at 94% 12%, rgba(62, 183, 255, .20), transparent 32%),
    linear-gradient(180deg, rgba(18, 35, 82, .96), rgba(5, 12, 32, .98));
  box-shadow:
    0 0 0 1px rgba(10, 18, 50, .96),
    inset 0 0 0 1px rgba(255, 255, 255, .06),
    inset 0 0 28px rgba(94, 54, 185, .18),
    0 8px 22px rgba(0, 0, 0, .42),
    0 0 18px rgba(62, 178, 255, .16) !important;
  overflow: hidden;
  font-size: 13px;
}

.Content .aguionOTAccountPage .TableContainer::before,
.Content .aguionOTAccountPage .TableContainer::after {
  content: '';
  position: absolute;
  z-index: 2;
  width: 18px;
  height: 18px;
  border-radius: 4px;
  pointer-events: none;
  transform: rotate(45deg);
  background:
    radial-gradient(circle at 50% 45%, #f1eaff 0 12%, #9d72ff 13% 40%, #4620a6 42% 67%, rgba(17, 31, 80, .35) 69% 100%);
  border: 1px solid rgba(218, 238, 255, .75);
  box-shadow: 0 0 10px rgba(130, 86, 255, .8), 0 0 14px rgba(70, 190, 255, .45);
}

.Content .aguionOTAccountPage .TableContainer::before { left: 12px; top: 10px; }
.Content .aguionOTAccountPage .TableContainer::after { right: 12px; top: 10px; }

.Content .aguionOTAccountPage .CaptionContainer,
.Content .aguionOTAccountPage .CaptionInnerContainer {
  min-height: 31px;
  border: 0 !important;
  background:
    linear-gradient(90deg, rgba(4, 12, 32, .96), rgba(14, 47, 92, .96) 48%, rgba(5, 13, 35, .96)) !important;
}

.Content .aguionOTAccountPage .CaptionInnerContainer {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6px 48px 7px !important;
  border-bottom: 1px solid rgba(119, 213, 255, .66);
  box-shadow: inset 0 -1px 0 rgba(255, 255, 255, .12), 0 1px 12px rgba(61, 177, 255, .20);
}

.Content .aguionOTAccountPage .CaptionContainer .Text {
  position: relative;
  z-index: 3;
  padding: 0 !important;
  color: #f8fbff !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: 15px !important;
  font-weight: 700;
  letter-spacing: .25px;
  text-align: center;
  text-shadow: 0 1px 0 #010817, 0 0 9px rgba(112, 204, 255, .52);
}

.Content .aguionOTAccountPage .CaptionEdgeLeftTop,
.Content .aguionOTAccountPage .CaptionEdgeRightTop,
.Content .aguionOTAccountPage .CaptionEdgeLeftBottom,
.Content .aguionOTAccountPage .CaptionEdgeRightBottom,
.Content .aguionOTAccountPage .CaptionBorderTop,
.Content .aguionOTAccountPage .CaptionBorderBottom,
.Content .aguionOTAccountPage .CaptionVerticalLeft,
.Content .aguionOTAccountPage .CaptionVerticalRight {
  display: none !important;
  background-image: none !important;
}

.Content .aguionOTAccountPage .Table1,
.Content .aguionOTAccountPage .Table2,
.Content .aguionOTAccountPage .Table3,
.Content .aguionOTAccountPage .Table4,
.Content .aguionOTAccountPage .Table5,
.Content .aguionOTAccountPage .InnerTableContainer,
.Content .aguionOTAccountPage .TableContentContainer,
.Content .aguionOTAccountPage .TableContent,
.Content .aguionOTAccountPage .TableContentAndRightShadow {
  width: 100% !important;
  max-width: none !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.Content .aguionOTAccountPage .InnerTableContainer {
  padding: 10px;
}

.Content .aguionOTAccountPage .TableContent,
.Content .aguionOTAccountPage .Table1,
.Content .aguionOTAccountPage .Table2,
.Content .aguionOTAccountPage .Table3,
.Content .aguionOTAccountPage .Table4,
.Content .aguionOTAccountPage .Table5 {
  border-collapse: separate !important;
  border-spacing: 0 !important;
  color: var(--account-text);
}

.Content .aguionOTAccountPage .TableContent td,
.Content .aguionOTAccountPage .Table1 td,
.Content .aguionOTAccountPage .Table2 td,
.Content .aguionOTAccountPage .Table3 td,
.Content .aguionOTAccountPage .Table4 td,
.Content .aguionOTAccountPage .Table5 td {
  color: var(--account-text) !important;
  border-color: rgba(126, 174, 235, .22) !important;
  background: rgba(9, 20, 50, .48) !important;
  padding: 8px 10px;
  vertical-align: middle;
}

.Content .aguionOTAccountPage .TableContent tr:nth-child(odd) td,
.Content .aguionOTAccountPage .Odd td,
.Content .aguionOTAccountPage tr.Odd td {
  background: rgba(17, 33, 73, .66) !important;
}

.Content .aguionOTAccountPage .TableContent tr:nth-child(even) td,
.Content .aguionOTAccountPage .Even td,
.Content .aguionOTAccountPage tr.Even td {
  background: rgba(10, 23, 57, .74) !important;
}

.Content .aguionOTAccountPage .LabelV,
.Content .aguionOTAccountPage b,
.Content .aguionOTAccountPage strong,
.Content .aguionOTAccountPage .BigBoldText {
  color: #fff1ad !important;
  text-shadow: 0 0 7px rgba(125, 201, 255, .22);
}

.Content .aguionOTAccountPage small,
.Content .aguionOTAccountPage li,
.Content .aguionOTAccountPage p {
  color: #d7e5ff;
}

.Content .aguionOTAccountPage a,
.Content .aguionOTAccountPage a:link,
.Content .aguionOTAccountPage a:visited {
  color: #7de3ff;
  font-weight: 700;
  text-decoration: none;
}

.Content .aguionOTAccountPage a:hover {
  color: #d8f7ff;
  text-shadow: 0 0 8px rgba(115, 222, 255, .65);
}

.Content .aguionOTAccountPage .AccountStatusImage {
  width: 54px;
  height: 54px;
  margin: 2px 8px 2px 2px;
  filter: drop-shadow(0 0 8px rgba(120, 194, 255, .35));
}

.Content .aguionOTAccountPage input[type="text"],
.Content .aguionOTAccountPage input[type="password"],
.Content .aguionOTAccountPage input[type="email"],
.Content .aguionOTAccountPage select,
.Content .aguionOTAccountPage textarea,
.Content .aguionOTAccountPage .InputField,
.Content .aguionOTAccountPage .CreateAccountFormInput,
.Content .aguionOTAccountPage .ChangePasswordFormInput,
.Content .aguionOTAccountPage .SetPasswordFormInput {
  max-width: 100%;
  border: 1px solid rgba(120, 194, 255, .52) !important;
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(6, 18, 48, .94), rgba(11, 25, 61, .94)) !important;
  color: #f2f7ff !important;
  box-shadow: inset 0 0 12px rgba(31, 95, 176, .28), 0 0 10px rgba(63, 176, 255, .10);
  padding: 7px 9px;
}

.Content .aguionOTAccountPage textarea {
  min-height: 120px;
  resize: vertical;
}

.Content .aguionOTAccountPage .BigButton,
.Content .aguionOTAccountPage .BigButtonGreen,
.Content .aguionOTAccountPage .BigButtonRed {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 132px;
  height: 28px;
  margin: 2px;
  padding: 0 12px;
  border: 1px solid rgba(175, 222, 255, .72);
  border-radius: 8px;
  background: linear-gradient(180deg, #1a4f9c, #102f70 52%, #0a1740) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.22), 0 0 12px rgba(72, 180, 255, .28);
}

.Content .aguionOTAccountPage .BigButtonGreen {
  background: linear-gradient(180deg, #25905e, #126136 56%, #082817) !important;
  border-color: rgba(128, 255, 194, .72);
}

.Content .aguionOTAccountPage .BigButtonRed {
  background: linear-gradient(180deg, #9b2e4c, #6d1430 56%, #2d0614) !important;
  border-color: rgba(255, 151, 179, .72);
}

.Content .aguionOTAccountPage .BigButtonText,
.Content .aguionOTAccountPage .ButtonText,
.Content .aguionOTAccountPage input[type="submit"].Button,
.Content .aguionOTAccountPage input[type="submit"] {
  color: #fff8d8 !important;
  font-weight: 700;
  text-shadow: 0 1px 1px #02040b;
}

.Content .aguionOTAccountPage .BigButtonText,
.Content .aguionOTAccountPage .ButtonText {
  border: 0 !important;
  background: transparent !important;
  cursor: pointer;
}

.Content .aguionOTAccountPage img[src*="scroll.gif"],
.Content .aguionOTAccountPage .panel-body[style*="scroll.gif"] {
  background-image: none !important;
}

.Content .aguionOTAccountPage .panel-body {
  border: 1px solid rgba(128, 194, 255, .35);
  border-radius: 12px;
  background: linear-gradient(180deg, rgba(10, 23, 57, .84), rgba(4, 10, 29, .92)) !important;
  color: var(--account-text);
}

@media (max-width: 900px) {
  .Content .aguionOTAccountPage .InnerTableContainer { padding: 7px; }
  .Content .aguionOTAccountPage .TableContent td,
  .Content .aguionOTAccountPage .Table1 td,
  .Content .aguionOTAccountPage .Table2 td,
  .Content .aguionOTAccountPage .Table3 td,
  .Content .aguionOTAccountPage .Table4 td,
  .Content .aguionOTAccountPage .Table5 td { padding: 7px; }
}
/* === aguionOT ACCOUNT MANAGEMENT SKIN END === */

/* === aguionOT ACCOUNT ACTION LINKS FIX START === */
.Content .aguionOTAccountPage .linkButton,
.Content .aguionOTAccountPage td[id^="CharacterCell4"] button.linkButton {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 68px;
  height: 24px;
  margin: 2px 0;
  padding: 0 10px;
  border: 1px solid rgba(143, 221, 255, .82) !important;
  border-radius: 7px;
  background: linear-gradient(180deg, rgba(31, 91, 165, .98), rgba(15, 47, 105, .98) 56%, rgba(7, 20, 55, .98)) !important;
  color: #f6fbff !important;
  font-size: 12px;
  font-weight: 800;
  line-height: 22px;
  letter-spacing: .1px;
  text-shadow: 0 1px 1px #020611, 0 0 7px rgba(105, 216, 255, .42);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.22), 0 0 10px rgba(68, 179, 255, .26);
  cursor: pointer;
  appearance: none;
}

.Content .aguionOTAccountPage .linkButton:hover,
.Content .aguionOTAccountPage td[id^="CharacterCell4"] button.linkButton:hover {
  border-color: rgba(217, 246, 255, .96) !important;
  background: linear-gradient(180deg, rgba(52, 132, 218, 1), rgba(20, 72, 149, 1) 58%, rgba(9, 29, 75, 1)) !important;
  color: #ffffff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.28), 0 0 14px rgba(89, 209, 255, .48);
}

.Content .aguionOTAccountPage td[id^="CharacterCell4"] {
  min-width: 104px;
  color: rgba(210, 226, 255, .62) !important;
  text-align: center !important;
}

.Content .aguionOTAccountPage td[id^="CharacterCell4"] span {
  color: rgba(210, 226, 255, .62) !important;
}

.Content .aguionOTAccountPage td[id^="CharacterCell4"] form[action*="deletecharacter"] .linkButton {
  border-color: rgba(255, 165, 190, .82) !important;
  background: linear-gradient(180deg, rgba(151, 48, 82, .98), rgba(101, 22, 49, .98) 58%, rgba(42, 6, 23, .98)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 0 10px rgba(255, 92, 140, .20);
}

.Content .aguionOTAccountPage td[id^="CharacterCell4"] form[action*="deletecharacter"] .linkButton:hover {
  border-color: rgba(255, 210, 222, .98) !important;
  background: linear-gradient(180deg, rgba(185, 65, 101, 1), rgba(126, 28, 61, 1) 58%, rgba(55, 7, 27, 1)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.22), 0 0 14px rgba(255, 97, 146, .38);
}

.Content .aguionOTAccountPage td[id^="CharacterCell4"] a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 68px;
  height: 24px;
  margin: 2px 0;
  padding: 0 10px;
  border: 1px solid rgba(143, 221, 255, .82);
  border-radius: 7px;
  background: linear-gradient(180deg, rgba(31, 91, 165, .98), rgba(15, 47, 105, .98) 56%, rgba(7, 20, 55, .98));
  color: #f6fbff !important;
  font-size: 12px;
  font-weight: 800;
  text-shadow: 0 1px 1px #020611, 0 0 7px rgba(105, 216, 255, .42);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.22), 0 0 10px rgba(68, 179, 255, .26);
}
/* === aguionOT ACCOUNT ACTION LINKS FIX END === */

/* === aguionOT INTERNAL PAGES REFRESH START === */
.Content .aguionOTInternalPage,
.Content .vip-container,
.Content .modern-container,
.Content .commands-wrapper {
  --li-bg: rgba(5, 13, 34, .94);
  --li-bg-2: rgba(12, 28, 68, .88);
  --li-bg-3: rgba(18, 40, 92, .72);
  --li-line: rgba(132, 219, 255, .70);
  --li-line-soft: rgba(121, 166, 236, .30);
  --li-violet: rgba(139, 92, 246, .78);
  --li-text: #eef6ff;
  --li-muted: #b7c9ec;
  --li-gold: #ffe58a;
  color: var(--li-text) !important;
  font-family: Verdana, Arial, sans-serif;
}

.Content .aguionOTInternalPage *,
.Content .vip-container *,
.Content .modern-container *,
.Content .commands-wrapper * {
  box-sizing: border-box;
}

.Content .aguionOTInternalPage a,
.Content .vip-container a,
.Content .modern-container a,
.Content .commands-wrapper a {
  color: #84e8ff !important;
  font-weight: 800;
  text-decoration: none !important;
  text-shadow: 0 0 7px rgba(104, 216, 255, .34);
}

.Content .aguionOTInternalPage a:hover,
.Content .vip-container a:hover,
.Content .modern-container a:hover,
.Content .commands-wrapper a:hover {
  color: #ffffff !important;
  text-shadow: 0 0 11px rgba(122, 225, 255, .70);
}

.Content .aguionOTInternalPage .TableContainer,
.Content .aguionOTTopGuildsPage .TableContainer,
.Content .aguionOTEventCalendar .TableContainer {
  position: relative;
  margin: 0 0 18px;
  padding: 1px;
  border: 1px solid rgba(184, 226, 255, .62) !important;
  border-radius: 15px;
  background:
    radial-gradient(circle at 8% 0%, rgba(139, 92, 246, .22), transparent 34%),
    radial-gradient(circle at 94% 10%, rgba(69, 190, 255, .18), transparent 32%),
    linear-gradient(180deg, rgba(18, 38, 91, .96), rgba(5, 12, 32, .99)) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.06), 0 8px 22px rgba(0,0,0,.44), 0 0 20px rgba(74, 185, 255, .15) !important;
  overflow: hidden;
}

.Content .aguionOTInternalPage .CaptionContainer,
.Content .aguionOTInternalPage .CaptionInnerContainer {
  border: 0 !important;
  background: linear-gradient(90deg, rgba(4, 12, 32, .96), rgba(14, 49, 96, .97), rgba(5, 13, 35, .96)) !important;
}

.Content .aguionOTInternalPage .CaptionInnerContainer {
  min-height: 34px;
  padding: 7px 44px !important;
  border-bottom: 1px solid rgba(122, 218, 255, .65) !important;
  box-shadow: inset 0 -1px 0 rgba(255,255,255,.12), 0 1px 14px rgba(62, 178, 255, .20);
}

.Content .aguionOTInternalPage .CaptionContainer .Text {
  padding: 0 !important;
  color: #fbfdff !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: 15px !important;
  font-weight: 800;
  text-align: center;
  text-shadow: 0 1px 0 #010817, 0 0 9px rgba(114, 206, 255, .55);
}

.Content .aguionOTInternalPage .CaptionEdgeLeftTop,
.Content .aguionOTInternalPage .CaptionEdgeRightTop,
.Content .aguionOTInternalPage .CaptionEdgeLeftBottom,
.Content .aguionOTInternalPage .CaptionEdgeRightBottom,
.Content .aguionOTInternalPage .CaptionBorderTop,
.Content .aguionOTInternalPage .CaptionBorderBottom,
.Content .aguionOTInternalPage .CaptionVerticalLeft,
.Content .aguionOTInternalPage .CaptionVerticalRight {
  display: none !important;
  background-image: none !important;
}

.Content .aguionOTInternalPage .InnerTableContainer,
.Content .aguionOTInternalPage .TableContentContainer,
.Content .aguionOTInternalPage .TableContent,
.Content .aguionOTInternalPage .Table1,
.Content .aguionOTInternalPage .Table2,
.Content .aguionOTInternalPage .Table3,
.Content .aguionOTInternalPage .Table4,
.Content .aguionOTInternalPage .Table5 {
  width: 100% !important;
  max-width: none !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.Content .aguionOTInternalPage .InnerTableContainer { padding: 12px !important; }

.Content .aguionOTInternalPage table,
.Content .aguionOTInternalPage td,
.Content .aguionOTInternalPage th {
  color: var(--li-text) !important;
  border-color: rgba(126, 174, 235, .24) !important;
}

.Content .aguionOTInternalPage .TableContent td,
.Content .aguionOTInternalPage .Table1 td,
.Content .aguionOTInternalPage .Table2 td,
.Content .aguionOTInternalPage .Table3 td,
.Content .aguionOTInternalPage .Table4 td,
.Content .aguionOTInternalPage .Table5 td {
  background: rgba(9, 20, 50, .56) !important;
  padding: 9px 10px;
}

.Content .aguionOTInternalPage .Odd td,
.Content .aguionOTInternalPage tr.Odd td,
.Content .aguionOTInternalPage tr:nth-child(odd) > td { background-color: rgba(17, 35, 78, .62) !important; }
.Content .aguionOTInternalPage .Even td,
.Content .aguionOTInternalPage tr.Even td,
.Content .aguionOTInternalPage tr:nth-child(even) > td { background-color: rgba(8, 21, 55, .74) !important; }

.Content .aguionOTInternalPage .LabelV,
.Content .aguionOTInternalPage .LabelV200,
.Content .aguionOTInternalPage b,
.Content .aguionOTInternalPage strong {
  color: #fff0aa !important;
  text-shadow: 0 0 7px rgba(125, 201, 255, .24);
}

/* Event Calendar */
.Content .aguionOTEventCalendar {
  padding: 4px 2px 14px;
}

.Content .aguionOTEventCalendar #eventscheduletablecontainer {
  border-radius: 16px;
}

.Content .aguionOTEventCalendar .eventscheduleheadertop {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  width: 100%;
}

.Content .aguionOTEventCalendar .eventscheduleheaderdateblock {
  display: inline-flex;
  align-items: center;
  gap: 18px;
  color: #fff7d4 !important;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 17px;
  text-transform: uppercase;
  letter-spacing: .4px;
}

.Content .aguionOTEventCalendar .eventscheduleheaderblockright {
  color: #9fdfff !important;
  font-size: 12px;
  font-weight: 700;
}

.Content .aguionOTEventCalendar .eventscheduleheaderleft a,
.Content .aguionOTEventCalendar .eventscheduleheaderright a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border: 1px solid rgba(147, 222, 255, .70);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(124, 85, 246, .58), rgba(18, 44, 101, .95));
  color: #fff !important;
}

.Content .aguionOTEventCalendar #eventscheduletable {
  border-collapse: separate !important;
  border-spacing: 5px !important;
  background: transparent !important;
}

.Content .aguionOTEventCalendar #eventscheduletable th {
  padding: 9px 5px !important;
  border: 1px solid rgba(130, 211, 255, .42) !important;
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(20, 54, 112, .98), rgba(8, 22, 57, .98)) !important;
  color: #f6fbff !important;
  text-shadow: 0 0 8px rgba(116, 211, 255, .32);
}

.Content .aguionOTEventCalendar #eventscheduletable td {
  min-height: 86px;
  border: 1px solid rgba(109, 155, 226, .32) !important;
  border-radius: 10px;
  background: linear-gradient(180deg, rgba(12, 26, 61, .82), rgba(6, 15, 39, .88)) !important;
  box-shadow: inset 0 0 14px rgba(59, 123, 203, .12);
}

.Content .aguionOTEventCalendar #eventscheduletable small {
  color: #dbe9ff !important;
}

.Content .aguionOTEventCalendar > div:last-child {
  padding: 10px 13px;
  border: 1px solid rgba(120, 190, 255, .28);
  border-radius: 10px;
  background: rgba(7, 17, 45, .72);
  color: #bcd0ef;
}

/* VIP */
.Content .vip-container {
  max-width: none !important;
  padding: 4px 2px 18px !important;
}

.Content .vip-header,
.Content .commands-header,
.Content .modern-card-header {
  border: 1px solid rgba(180, 226, 255, .62) !important;
  border-radius: 16px !important;
  background:
    radial-gradient(circle at 8% 8%, rgba(145, 96, 255, .30), transparent 33%),
    radial-gradient(circle at 90% 18%, rgba(66, 193, 255, .24), transparent 36%),
    linear-gradient(135deg, rgba(7, 19, 50, .98), rgba(21, 61, 124, .96) 55%, rgba(36, 24, 91, .96)) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.07), 0 9px 24px rgba(0,0,0,.38), 0 0 22px rgba(70, 190, 255, .18) !important;
  color: #f7fbff !important;
}

.Content .vip-header h1,
.Content .commands-header h1,
.Content .modern-header {
  color: #fff7d6 !important;
  -webkit-text-fill-color: initial !important;
  background: none !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  text-shadow: 0 1px 0 #020713, 0 0 12px rgba(126, 209, 255, .55) !important;
}

.Content .vip-header p,
.Content .commands-header p {
  color: #dceaff !important;
}

.Content .info-card,
.Content .benefit-card,
.Content .comparison-table,
.Content .loyalty-section,
.Content .premium-section,
.Content .faq-item,
.Content .vip-card,
.Content .plan-card {
  border: 1px solid rgba(128, 198, 255, .38) !important;
  border-radius: 14px !important;
  background: linear-gradient(180deg, rgba(13, 30, 69, .92), rgba(6, 15, 41, .96)) !important;
  color: var(--li-text) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.045), 0 6px 18px rgba(0,0,0,.32), 0 0 15px rgba(73, 181, 255, .10) !important;
}

.Content .info-card p,
.Content .benefit-description,
.Content .vip-container p,
.Content .vip-container li,
.Content .vip-container td,
.Content .vip-container small {
  color: #dbe8ff !important;
}

.Content .benefit-title,
.Content .vip-container h2,
.Content .vip-container h3,
.Content .vip-container h4 {
  color: #fff0aa !important;
  border-color: rgba(126, 211, 255, .25) !important;
}

.Content .benefit-icon,
.Content .benefit-badge,
.Content .info-highlight {
  color: #ffffff !important;
  background: linear-gradient(135deg, rgba(48, 139, 219, .96), rgba(118, 82, 238, .96)) !important;
  box-shadow: 0 0 12px rgba(82, 194, 255, .24) !important;
}

.Content .warning-note {
  border-left-color: #7fe2ff !important;
  background: rgba(8, 22, 55, .86) !important;
  color: #dceaff !important;
}

/* Server Info */
.Content .modern-container {
  max-width: none !important;
  padding: 4px 2px 18px !important;
}

.Content .modern-header {
  display: block !important;
  margin: 4px 0 16px !important;
  padding: 12px 16px !important;
  border: 1px solid rgba(134, 213, 255, .52) !important;
  border-radius: 14px;
  background: linear-gradient(90deg, rgba(6, 15, 39, .96), rgba(17, 54, 109, .93), rgba(6, 15, 39, .96)) !important;
  text-align: center;
}

.Content .modern-card,
.Content .modern-stat,
.Content .modern-alert {
  border: 1px solid rgba(128, 198, 255, .38) !important;
  border-radius: 14px !important;
  background: linear-gradient(180deg, rgba(13, 30, 69, .92), rgba(6, 15, 41, .96)) !important;
  color: var(--li-text) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.045), 0 6px 18px rgba(0,0,0,.32) !important;
}

.Content .modern-card-body,
.Content .modern-table,
.Content .stages-table {
  background: transparent !important;
  color: var(--li-text) !important;
}

.Content .modern-table th,
.Content .stages-table th {
  background: linear-gradient(180deg, rgba(20, 54, 112, .98), rgba(8, 22, 57, .98)) !important;
  color: #f7fbff !important;
  border-color: rgba(126, 211, 255, .32) !important;
}

.Content .modern-table td,
.Content .stages-table td {
  color: #dbe8ff !important;
  border-color: rgba(126, 174, 235, .22) !important;
  background: rgba(9, 20, 50, .52) !important;
}

.Content .modern-table tr:hover td,
.Content .stages-table tr:hover td {
  background: rgba(20, 54, 112, .70) !important;
}

.Content .modern-stat-value { color: #8fe9ff !important; text-shadow: 0 0 12px rgba(92, 207, 255, .38); }
.Content .modern-stat-label { color: #fff0aa !important; }
.Content .modern-badge { border: 1px solid rgba(255,255,255,.20); border-radius: 999px !important; }

/* Commands */
.Content .commands-wrapper {
  max-width: none !important;
  margin: 4px auto 18px !important;
}

.Content .commands-control,
.Content .commands-grid {
  border-left: 1px solid rgba(128, 198, 255, .38) !important;
  border-right: 1px solid rgba(128, 198, 255, .38) !important;
  background: linear-gradient(180deg, rgba(13, 30, 69, .92), rgba(6, 15, 41, .96)) !important;
  box-shadow: none !important;
}

.Content .commands-grid {
  border-bottom: 1px solid rgba(128, 198, 255, .38) !important;
  border-radius: 0 0 16px 16px !important;
}

.Content .toggle-btn,
.Content .command-item {
  border: 1px solid rgba(128, 198, 255, .38) !important;
  background: linear-gradient(180deg, rgba(14, 34, 80, .94), rgba(7, 18, 48, .98)) !important;
  color: var(--li-text) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.045), 0 6px 16px rgba(0,0,0,.28) !important;
}

.Content .command-header {
  background: rgba(12, 29, 70, .72) !important;
  color: var(--li-text) !important;
}

.Content .command-name {
  color: #8beaff !important;
  font-weight: 900 !important;
}

.Content .command-description,
.Content .command-content,
.Content .commands-wrapper p {
  color: #dbe8ff !important;
}

.Content .expand-icon,
.Content .command-icon { color: #fff0aa !important; }

/* Top Guilds */
.Content .aguionOTTopGuildsPage > p,
.Content .aguionOTTopGuildsPage p {
  color: #dbe8ff !important;
  text-align: center;
}

.Content .aguionOTTopGuildsPage select {
  width: 100% !important;
  padding: 8px 10px;
  border: 1px solid rgba(133, 214, 255, .55) !important;
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(6, 18, 48, .94), rgba(11, 25, 61, .94)) !important;
  color: #f2f7ff !important;
}

.Content .aguionOTTopGuildsPage .guild-cards-container {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 12px;
  width: 100%;
  padding: 2px;
}

.Content .aguionOTTopGuildsPage .guild-card {
  position: relative;
  overflow: hidden;
  min-height: 188px;
  border: 1px solid rgba(128, 198, 255, .40) !important;
  border-radius: 14px !important;
  background:
    radial-gradient(circle at 50% 4%, rgba(139, 92, 246, .20), transparent 42%),
    linear-gradient(180deg, rgba(14, 34, 80, .94), rgba(7, 18, 48, .98)) !important;
  color: var(--li-text) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.045), 0 6px 18px rgba(0,0,0,.34), 0 0 15px rgba(73, 181, 255, .10) !important;
}

.Content .aguionOTTopGuildsPage .guild-card-header {
  padding: 8px 10px !important;
  border-bottom: 1px solid rgba(126, 211, 255, .30) !important;
  background: linear-gradient(90deg, rgba(28, 78, 150, .82), rgba(83, 58, 165, .68)) !important;
  color: #fff7d6 !important;
  font-weight: 900;
  text-align: center;
  text-shadow: 0 0 8px rgba(122, 219, 255, .35);
}

.Content .aguionOTTopGuildsPage .guild-card-content {
  padding: 12px 10px !important;
  text-align: center;
}

.Content .aguionOTTopGuildsPage .guild-card img {
  width: 58px;
  height: 58px;
  object-fit: contain;
  margin-bottom: 7px;
  filter: drop-shadow(0 0 8px rgba(121, 209, 255, .28));
}

.Content .aguionOTTopGuildsPage .guild-card small {
  display: block;
  margin-top: 7px;
  color: #bcd0ef !important;
  line-height: 1.35;
}

.Content .aguionOTTopGuildsPage .linkButton {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  max-width: 100%;
  padding: 6px 10px;
  border: 1px solid rgba(143, 221, 255, .78) !important;
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(31, 91, 165, .98), rgba(15, 47, 105, .98) 56%, rgba(7, 20, 55, .98)) !important;
  color: #f6fbff !important;
  font-weight: 900;
  text-shadow: 0 1px 1px #020611, 0 0 7px rgba(105, 216, 255, .42);
  cursor: pointer;
}

@media (max-width: 760px) {
  .Content .aguionOTEventCalendar .eventscheduleheadertop { flex-direction: column; gap: 6px; }
  .Content .aguionOTEventCalendar #eventscheduletable { border-spacing: 3px !important; }
  .Content .aguionOTTopGuildsPage .guild-cards-container { grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); }
}
/* === aguionOT INTERNAL PAGES REFRESH END === */

/* === aguionOT TOP GUILDS FOOD CHAIN START === */
.Content .aguionOTTopGuildsPage .guild-food-chain {
  position: relative;
  width: 100%;
  padding: 18px 8px 8px;
  overflow: hidden;
}

.Content .aguionOTTopGuildsPage .guild-food-chain::before {
  content: 'CADEIA DE DOMÍNIO';
  display: block;
  width: max-content;
  max-width: 100%;
  margin: 0 auto 16px;
  padding: 7px 18px;
  border: 1px solid rgba(153, 225, 255, .48);
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(7, 18, 48, .88), rgba(38, 66, 132, .80), rgba(7, 18, 48, .88));
  color: #fff7d6;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: 1.8px;
  text-align: center;
  text-shadow: 0 0 9px rgba(119, 215, 255, .50);
  box-shadow: 0 0 18px rgba(83, 190, 255, .14);
}

.Content .aguionOTTopGuildsPage .guild-food-chain::after {
  content: '';
  position: absolute;
  top: 62px;
  left: 50%;
  width: 2px;
  height: calc(100% - 82px);
  transform: translateX(-50%);
  background: linear-gradient(180deg, rgba(141, 222, 255, .70), rgba(125, 86, 242, .36), transparent);
  box-shadow: 0 0 12px rgba(102, 207, 255, .36);
  pointer-events: none;
  opacity: .72;
}

.Content .aguionOTTopGuildsPage .guild-cards-container {
  position: relative;
  z-index: 1;
  display: grid !important;
  grid-template-columns: repeat(12, 1fr);
  gap: 14px;
  align-items: stretch;
  width: 100%;
  padding: 0 4px 6px;
}

.Content .aguionOTTopGuildsPage .guild-card {
  grid-column: span 3;
  min-height: 168px;
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.Content .aguionOTTopGuildsPage .guild-card:hover {
  transform: translateY(-4px);
  border-color: rgba(194, 238, 255, .76) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.06), 0 9px 24px rgba(0,0,0,.40), 0 0 20px rgba(94, 204, 255, .25) !important;
}

.Content .aguionOTTopGuildsPage .guild-rank-1 {
  grid-column: 4 / span 6;
  min-height: 238px;
  margin-bottom: 10px;
  border-color: rgba(255, 232, 140, .78) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 225, 123, .22), transparent 32%),
    radial-gradient(circle at 50% 48%, rgba(138, 92, 246, .22), transparent 42%),
    linear-gradient(180deg, rgba(26, 52, 109, .98), rgba(8, 18, 48, .99)) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.07), 0 10px 28px rgba(0,0,0,.48), 0 0 28px rgba(255, 220, 106, .20), 0 0 30px rgba(93, 204, 255, .16) !important;
}

.Content .aguionOTTopGuildsPage .guild-rank-1::before {
  content: 'PREDADOR ALFA';
  position: absolute;
  top: 44px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 3;
  padding: 3px 10px;
  border: 1px solid rgba(255, 235, 154, .55);
  border-radius: 999px;
  background: rgba(7, 16, 41, .74);
  color: #ffe88f;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 1px;
  text-shadow: 0 0 8px rgba(255, 224, 112, .40);
}

.Content .aguionOTTopGuildsPage .guild-rank-1 .guild-card-header {
  padding: 12px 10px 25px !important;
  background: linear-gradient(90deg, rgba(99, 71, 189, .88), rgba(30, 108, 184, .88), rgba(99, 71, 189, .88)) !important;
  color: #fff3ad !important;
  font-size: 20px;
}

.Content .aguionOTTopGuildsPage .guild-rank-1 .guild-card-content {
  padding-top: 16px !important;
}

.Content .aguionOTTopGuildsPage .guild-rank-1 img {
  width: 82px;
  height: 82px;
  filter: drop-shadow(0 0 10px rgba(255, 224, 117, .34)) drop-shadow(0 0 12px rgba(112, 210, 255, .25));
}

.Content .aguionOTTopGuildsPage .guild-rank-1 .linkButton {
  min-width: 170px;
  min-height: 34px;
  font-size: 15px;
  border-color: rgba(255, 231, 147, .78) !important;
  background: linear-gradient(180deg, rgba(40, 116, 197, .98), rgba(71, 55, 153, .98) 58%, rgba(9, 24, 64, .98)) !important;
}

.Content .aguionOTTopGuildsPage .guild-rank-2,
.Content .aguionOTTopGuildsPage .guild-rank-3 {
  grid-column: span 6;
  min-height: 204px;
  border-color: rgba(150, 224, 255, .62) !important;
}

.Content .aguionOTTopGuildsPage .guild-rank-2::before,
.Content .aguionOTTopGuildsPage .guild-rank-3::before {
  content: 'DESAFIANTE';
  position: absolute;
  top: 43px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 3;
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(7, 16, 41, .68);
  color: #9eeaff;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .8px;
}

.Content .aguionOTTopGuildsPage .guild-rank-2 .guild-card-header,
.Content .aguionOTTopGuildsPage .guild-rank-3 .guild-card-header {
  padding-bottom: 22px !important;
  font-size: 17px;
}

.Content .aguionOTTopGuildsPage .guild-rank-2 img,
.Content .aguionOTTopGuildsPage .guild-rank-3 img {
  width: 72px;
  height: 72px;
}

.Content .aguionOTTopGuildsPage .guild-rank-4,
.Content .aguionOTTopGuildsPage .guild-rank-5,
.Content .aguionOTTopGuildsPage .guild-rank-6 {
  grid-column: span 4;
  min-height: 184px;
}

.Content .aguionOTTopGuildsPage .guild-rank-1,
.Content .aguionOTTopGuildsPage .guild-rank-2,
.Content .aguionOTTopGuildsPage .guild-rank-3,
.Content .aguionOTTopGuildsPage .guild-rank-4,
.Content .aguionOTTopGuildsPage .guild-rank-5,
.Content .aguionOTTopGuildsPage .guild-rank-6 {
  position: relative;
}

.Content .aguionOTTopGuildsPage .guild-rank-1::after,
.Content .aguionOTTopGuildsPage .guild-rank-2::after,
.Content .aguionOTTopGuildsPage .guild-rank-3::after {
  content: '';
  position: absolute;
  left: 50%;
  bottom: -15px;
  width: 10px;
  height: 10px;
  transform: translateX(-50%) rotate(45deg);
  border: 1px solid rgba(211, 240, 255, .74);
  background: radial-gradient(circle, #efe8ff, #8f63ff 45%, #261061 76%);
  box-shadow: 0 0 10px rgba(137, 95, 255, .70), 0 0 14px rgba(87, 206, 255, .40);
}

.Content .aguionOTTopGuildsPage .guild-card-header {
  position: relative;
  isolation: isolate;
}

.Content .aguionOTTopGuildsPage .guild-card-header::after {
  content: '';
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(137, 220, 255, .75), transparent);
}

.Content .aguionOTTopGuildsPage .guild-card small {
  font-size: 10px;
}

@media (max-width: 920px) {
  .Content .aguionOTTopGuildsPage .guild-cards-container { grid-template-columns: repeat(6, 1fr); }
  .Content .aguionOTTopGuildsPage .guild-rank-1 { grid-column: 1 / -1; }
  .Content .aguionOTTopGuildsPage .guild-rank-2,
  .Content .aguionOTTopGuildsPage .guild-rank-3 { grid-column: span 3; }
  .Content .aguionOTTopGuildsPage .guild-rank-4,
  .Content .aguionOTTopGuildsPage .guild-rank-5,
  .Content .aguionOTTopGuildsPage .guild-rank-6,
  .Content .aguionOTTopGuildsPage .guild-card { grid-column: span 3; }
}

@media (max-width: 560px) {
  .Content .aguionOTTopGuildsPage .guild-cards-container { grid-template-columns: 1fr; }
  .Content .aguionOTTopGuildsPage .guild-card,
  .Content .aguionOTTopGuildsPage .guild-rank-1,
  .Content .aguionOTTopGuildsPage .guild-rank-2,
  .Content .aguionOTTopGuildsPage .guild-rank-3,
  .Content .aguionOTTopGuildsPage .guild-rank-4,
  .Content .aguionOTTopGuildsPage .guild-rank-5,
  .Content .aguionOTTopGuildsPage .guild-rank-6 { grid-column: 1 / -1; }
}
/* === aguionOT TOP GUILDS FOOD CHAIN END === */

/* === aguionOT VIP PAGE REWORK START === */
.Content .vip-container {
  width: 100% !important;
  max-width: none !important;
  margin: 0 auto 18px !important;
  padding: 4px 4px 18px !important;
  color: #edf6ff !important;
  font-family: Verdana, Arial, sans-serif !important;
}

.Content .vip-container::before {
  content: 'MEMBROSIA DE aguionOT';
  display: block;
  width: fit-content;
  max-width: 100%;
  margin: 0 auto 13px;
  padding: 7px 18px;
  border: 1px solid rgba(151, 226, 255, .52);
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(7, 18, 48, .88), rgba(36, 65, 134, .80), rgba(7, 18, 48, .88));
  color: #fff3bc;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 1.7px;
  text-align: center;
  text-shadow: 0 0 9px rgba(119, 215, 255, .50);
  box-shadow: 0 0 18px rgba(83, 190, 255, .14);
}

.Content .vip-header {
  position: relative;
  min-height: 164px;
  margin: 0 0 16px !important;
  padding: 26px 34px 28px !important;
  overflow: hidden;
  border: 1px solid rgba(190, 231, 255, .70) !important;
  border-radius: 18px !important;
  background:
    radial-gradient(circle at 12% 14%, rgba(152, 96, 255, .30), transparent 34%),
    radial-gradient(circle at 86% 28%, rgba(74, 203, 255, .25), transparent 36%),
    linear-gradient(135deg, rgba(4, 12, 34, .98), rgba(15, 47, 104, .97) 52%, rgba(25, 18, 76, .98)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.08),
    inset 0 -28px 56px rgba(5, 11, 31, .38),
    0 10px 28px rgba(0,0,0,.44),
    0 0 24px rgba(75, 191, 255, .16) !important;
}

.Content .vip-header::before {
  content: '' !important;
  position: absolute;
  right: 22px;
  top: 22px;
  width: 70px;
  height: 70px;
  opacity: .95 !important;
  transform: rotate(45deg) !important;
  border: 1px solid rgba(223, 244, 255, .72);
  border-radius: 14px;
  background:
    radial-gradient(circle at 50% 40%, #fff7ff 0 9%, #b58cff 10% 34%, #572ac6 36% 64%, rgba(12, 29, 76, .64) 66% 100%);
  box-shadow: 0 0 18px rgba(149, 94, 255, .70), 0 0 26px rgba(78, 199, 255, .38);
}

.Content .vip-header::after {
  content: '';
  position: absolute;
  left: 34px;
  right: 120px;
  bottom: 18px;
  height: 1px;
  background: linear-gradient(90deg, rgba(126, 222, 255, .75), rgba(158, 107, 255, .58), transparent);
  box-shadow: 0 0 12px rgba(94, 202, 255, .45);
}

.Content .vip-header h1 {
  position: relative;
  z-index: 1;
  max-width: calc(100% - 104px);
  margin: 0 !important;
  color: #fff8df !important;
  background: none !important;
  -webkit-text-fill-color: #fff8df !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: 28px !important;
  line-height: 1.12;
  font-weight: 900 !important;
  letter-spacing: .8px;
  text-transform: uppercase;
  text-shadow: 0 1px 0 #010715, 0 0 13px rgba(116, 209, 255, .62) !important;
}

.Content .vip-header p {
  position: relative;
  z-index: 1;
  max-width: 560px;
  margin: 10px 0 0 !important;
  color: #cfe1ff !important;
  font-size: 13px !important;
  font-weight: 700;
  line-height: 1.5;
  text-shadow: 0 1px 0 rgba(0,0,0,.45) !important;
}

.Content .vip-container h2,
.Content .vip-container .mounts-title {
  margin: 24px 0 14px !important;
  color: #fff3bc !important;
  background: none !important;
  -webkit-text-fill-color: #fff3bc !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: 20px !important;
  font-weight: 900 !important;
  line-height: 1.2;
  letter-spacing: .5px;
  text-align: center !important;
  text-shadow: 0 1px 0 #010715, 0 0 10px rgba(116, 209, 255, .48) !important;
}

.Content .vip-container h2::before,
.Content .vip-container h2::after,
.Content .vip-container .mounts-title::before,
.Content .vip-container .mounts-title::after {
  content: '';
  display: inline-block;
  width: 42px;
  height: 1px;
  margin: 0 10px 5px;
  background: linear-gradient(90deg, transparent, rgba(126, 222, 255, .70));
  box-shadow: 0 0 8px rgba(94, 202, 255, .38);
}

.Content .vip-container h2::after,
.Content .vip-container .mounts-title::after {
  background: linear-gradient(90deg, rgba(126, 222, 255, .70), transparent);
}

.Content .vip-container .info-card,
.Content .vip-container .info-box,
.Content .vip-container .mounts-section,
.Content .vip-container .loyalty-table,
.Content .vip-container > div[style*="text-align: center"] {
  position: relative;
  border: 1px solid rgba(132, 204, 255, .42) !important;
  border-radius: 16px !important;
  background:
    radial-gradient(circle at 8% 0%, rgba(139, 92, 246, .16), transparent 34%),
    linear-gradient(180deg, rgba(12, 29, 70, .92), rgba(5, 14, 39, .97)) !important;
  color: #edf6ff !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.045), 0 7px 20px rgba(0,0,0,.34), 0 0 16px rgba(73, 181, 255, .10) !important;
}

.Content .vip-container .info-card {
  margin: 0 0 16px !important;
  padding: 18px 20px !important;
  border-left: 1px solid rgba(132, 204, 255, .42) !important;
}

.Content .vip-container .info-card:hover,
.Content .vip-container .benefit-card:hover,
.Content .vip-container .mount-card:hover,
.Content .vip-container .vocation-card:hover {
  transform: translateY(-3px) !important;
  border-color: rgba(190, 234, 255, .66) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.065), 0 10px 24px rgba(0,0,0,.38), 0 0 20px rgba(83, 196, 255, .20) !important;
}

.Content .vip-container p,
.Content .vip-container li,
.Content .vip-container td,
.Content .vip-container small,
.Content .vip-container .benefit-description,
.Content .vip-container .info-box-content p,
.Content .vip-container .vocation-bonus {
  color: #dce9ff !important;
  font-size: 12.5px;
  line-height: 1.55;
}

.Content .vip-container b,
.Content .vip-container strong,
.Content .vip-container .benefit-title,
.Content .vip-container .mount-name,
.Content .vip-container .vocation-name {
  color: #fff4bf !important;
  text-shadow: 0 0 8px rgba(113, 205, 255, .22);
}

.Content .vip-container .info-highlight,
.Content .vip-container .benefit-badge,
.Content .vip-container .mount-badge {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  padding: 3px 10px !important;
  border: 1px solid rgba(145, 225, 255, .52) !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, rgba(36, 104, 190, .96), rgba(105, 72, 226, .94)) !important;
  color: #f8fbff !important;
  font-size: 10px !important;
  font-weight: 900 !important;
  letter-spacing: .4px;
  text-shadow: 0 1px 0 rgba(0,0,0,.45);
  box-shadow: 0 0 10px rgba(82, 194, 255, .20) !important;
}

.Content .vip-container .warning-note {
  margin-top: 12px !important;
  padding: 10px 12px !important;
  border: 1px solid rgba(255, 227, 142, .34) !important;
  border-left: 3px solid rgba(255, 227, 142, .80) !important;
  border-radius: 10px !important;
  background: linear-gradient(90deg, rgba(48, 38, 74, .72), rgba(9, 20, 52, .72)) !important;
  color: #e7efff !important;
}

.Content .vip-container .benefits-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
  margin: 16px 0 22px !important;
}

.Content .vip-container .benefit-card,
.Content .vip-container .mount-card,
.Content .vip-container .vocation-card {
  position: relative;
  overflow: hidden;
  min-height: 142px;
  padding: 15px 14px !important;
  border: 1px solid rgba(126, 195, 255, .36) !important;
  border-radius: 14px !important;
  background:
    radial-gradient(circle at 90% 8%, rgba(133, 90, 246, .13), transparent 34%),
    linear-gradient(180deg, rgba(13, 31, 74, .92), rgba(5, 14, 39, .98)) !important;
  color: #edf6ff !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.04), 0 6px 16px rgba(0,0,0,.30) !important;
  animation: none !important;
}

.Content .vip-container .benefit-card::before,
.Content .vip-container .benefit-card::after,
.Content .vip-container .mount-card::before,
.Content .vip-container .vocation-card::before {
  display: none !important;
}

.Content .vip-container .benefit-icon,
.Content .vip-container .vocation-icon,
.Content .vip-container .info-box-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  margin: 0 0 10px !important;
  border: 1px solid rgba(156, 226, 255, .46);
  border-radius: 12px;
  background: radial-gradient(circle, rgba(128, 86, 242, .34), rgba(12, 31, 75, .88));
  color: #fff4bf !important;
  font-size: 22px !important;
  filter: drop-shadow(0 0 8px rgba(113, 205, 255, .24)) !important;
}

.Content .vip-container .benefit-title {
  margin: 0 0 8px !important;
  padding: 0 0 8px !important;
  border-bottom: 1px solid rgba(123, 205, 255, .22) !important;
  font-size: 13px !important;
  font-weight: 900 !important;
}

.Content .vip-container .mounts-section {
  margin: 18px 0 22px !important;
  padding: 18px !important;
}

.Content .vip-container .mounts-grid,
.Content .vip-container .vocation-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(142px, 1fr)) !important;
  gap: 12px !important;
  margin: 12px 0 0 !important;
}

.Content .vip-container .mount-card {
  min-height: 132px;
  text-align: center;
}

.Content .vip-container .mount-card img {
  width: 68px !important;
  height: 68px !important;
  object-fit: contain;
  margin: 0 0 8px !important;
  filter: drop-shadow(0 0 9px rgba(116, 210, 255, .25)) !important;
}

.Content .vip-container .loyalty-table {
  margin: 16px 0 20px !important;
  overflow: hidden auto !important;
}

.Content .vip-container .loyalty-table table {
  width: 100% !important;
  border-collapse: collapse !important;
  background: transparent !important;
}

.Content .vip-container .loyalty-table th {
  padding: 10px 12px !important;
  border-bottom: 1px solid rgba(126, 211, 255, .32) !important;
  background: linear-gradient(180deg, rgba(20, 54, 112, .98), rgba(8, 22, 57, .98)) !important;
  color: #f7fbff !important;
  font-size: 12px !important;
  letter-spacing: .6px;
  text-shadow: 0 0 8px rgba(116, 211, 255, .32);
}

.Content .vip-container .loyalty-table td {
  padding: 9px 12px !important;
  border-bottom: 1px solid rgba(126, 174, 235, .20) !important;
  background: rgba(9, 20, 50, .52) !important;
  color: #dbe8ff !important;
}

.Content .vip-container .loyalty-table tr:nth-child(even) td {
  background: rgba(15, 32, 75, .62) !important;
}

.Content .vip-container .loyalty-table tr:hover td {
  background: rgba(25, 63, 124, .72) !important;
}

.Content .vip-container .loyalty-points,
.Content .vip-container .skill-bonus {
  color: #8eeaff !important;
  font-weight: 900 !important;
  text-align: center !important;
  text-shadow: 0 0 10px rgba(102, 210, 255, .30) !important;
}

.Content .vip-container .skill-bonus {
  color: #fff0a8 !important;
}

.Content .vip-container .info-box {
  display: grid !important;
  grid-template-columns: auto 1fr;
  gap: 14px !important;
  align-items: start !important;
  margin: 14px 0 18px !important;
  padding: 15px !important;
  border-left: 1px solid rgba(132, 204, 255, .42) !important;
}

.Content .vip-container .vocation-card {
  min-height: 132px;
  text-align: center;
}

.Content .vip-container > div[style*="text-align: center"] {
  margin-top: 20px !important;
  padding: 14px 16px !important;
}

.Content .vip-container > div[style*="text-align: center"] p {
  margin: 0 !important;
  color: #fff3bc !important;
  font-size: 13px !important;
  font-weight: 800;
}

@media (max-width: 900px) {
  .Content .vip-container .benefits-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .Content .vip-header h1 { max-width: 100%; font-size: 24px !important; }
  .Content .vip-header::before { opacity: .28 !important; }
}

@media (max-width: 560px) {
  .Content .vip-container .benefits-grid,
  .Content .vip-container .mounts-grid,
  .Content .vip-container .vocation-grid { grid-template-columns: 1fr !important; }
  .Content .vip-header { padding: 22px 20px !important; }
  .Content .vip-header h1 { font-size: 21px !important; }
  .Content .vip-container .info-box { grid-template-columns: 1fr !important; }
}
/* === aguionOT VIP PAGE REWORK END === */

/* === aguionOT LOGIN PAGE REWORK START === */
.Content .aguionOTLoginPage {
  --login-bg: rgba(5, 13, 34, .96);
  --login-bg-2: rgba(12, 29, 70, .90);
  --login-line: rgba(132, 219, 255, .68);
  --login-line-soft: rgba(121, 166, 236, .30);
  --login-violet: rgba(139, 92, 246, .75);
  --login-text: #edf6ff;
  --login-muted: #b9cbea;
  --login-gold: #fff1a8;
  width: 100%;
  color: var(--login-text);
  font-size: 13px;
  line-height: 1.45;
}

.Content .aguionOTLoginPage *,
.Content .aguionOTLoginPage *::before,
.Content .aguionOTLoginPage *::after {
  box-sizing: border-box;
}

.Content .aguionOTLoginPage::before {
  content: 'ACESSO À CONTA';
  display: block;
  width: fit-content;
  max-width: 100%;
  margin: 0 auto 13px;
  padding: 7px 18px;
  border: 1px solid rgba(151, 226, 255, .52);
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(7, 18, 48, .88), rgba(36, 65, 134, .80), rgba(7, 18, 48, .88));
  color: var(--login-gold);
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 1.7px;
  text-align: center;
  text-shadow: 0 0 9px rgba(119, 215, 255, .50);
  box-shadow: 0 0 18px rgba(83, 190, 255, .14);
}

.Content .aguionOTLoginPage .SmallBox,
.Content .aguionOTLoginPage > .TableContainer {
  position: relative;
  overflow: hidden;
  margin: 0 0 18px !important;
  padding: 1px;
  border: 1px solid rgba(184, 226, 255, .62) !important;
  border-radius: 16px;
  background:
    radial-gradient(circle at 8% 0%, rgba(139, 92, 246, .20), transparent 34%),
    radial-gradient(circle at 94% 14%, rgba(69, 190, 255, .18), transparent 34%),
    linear-gradient(180deg, rgba(18, 38, 91, .96), rgba(5, 12, 32, .99)) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.06), 0 8px 22px rgba(0,0,0,.44), 0 0 20px rgba(74, 185, 255, .15) !important;
}

.Content .aguionOTLoginPage .SmallBox {
  padding: 14px 16px 14px 70px;
}

.Content .aguionOTLoginPage .SmallBox::before {
  content: '!';
  position: absolute;
  left: 18px;
  top: 50%;
  width: 38px;
  height: 38px;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255, 229, 143, .70);
  border-radius: 12px;
  background: radial-gradient(circle, rgba(255, 226, 123, .22), rgba(48, 34, 85, .88));
  color: #fff1a8;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 24px;
  font-weight: 900;
  text-shadow: 0 0 10px rgba(255, 226, 123, .42);
  box-shadow: 0 0 14px rgba(255, 224, 112, .16), 0 0 18px rgba(93, 204, 255, .12);
}

.Content .aguionOTLoginPage .MessageContainer,
.Content .aguionOTLoginPage .Message,
.Content .aguionOTLoginPage .HintBox {
  position: static !important;
  width: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #dce9ff !important;
  box-shadow: none !important;
}

.Content .aguionOTLoginPage .BoxFrameHorizontal,
.Content .aguionOTLoginPage .BoxFrameEdgeLeftTop,
.Content .aguionOTLoginPage .BoxFrameEdgeRightTop,
.Content .aguionOTLoginPage .BoxFrameEdgeRightBottom,
.Content .aguionOTLoginPage .BoxFrameEdgeLeftBottom,
.Content .aguionOTLoginPage .BoxFrameVerticalLeft,
.Content .aguionOTLoginPage .BoxFrameVerticalRight,
.Content .aguionOTLoginPage .AttentionSign,
.Content .aguionOTLoginPage .TableShadowContainerRightTop,
.Content .aguionOTLoginPage .TableShadowRightTop {
  display: none !important;
  background-image: none !important;
}

.Content .aguionOTLoginPage .HintBox b {
  color: var(--login-gold) !important;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 15px;
  text-shadow: 0 0 8px rgba(113, 205, 255, .25);
}

.Content .aguionOTLoginPage > .TableContainer::before,
.Content .aguionOTLoginPage > .TableContainer::after {
  content: '';
  position: absolute;
  z-index: 2;
  width: 18px;
  height: 18px;
  top: 10px;
  transform: rotate(45deg);
  border: 1px solid rgba(218, 238, 255, .75);
  border-radius: 4px;
  background: radial-gradient(circle at 50% 45%, #f1eaff 0 12%, #9d72ff 13% 40%, #4620a6 42% 67%, rgba(17, 31, 80, .35) 69% 100%);
  box-shadow: 0 0 10px rgba(130, 86, 255, .8), 0 0 14px rgba(70, 190, 255, .45);
  pointer-events: none;
}

.Content .aguionOTLoginPage > .TableContainer::before { left: 14px; }
.Content .aguionOTLoginPage > .TableContainer::after { right: 14px; }

.Content .aguionOTLoginPage .CaptionContainer,
.Content .aguionOTLoginPage .CaptionInnerContainer {
  border: 0 !important;
  background: linear-gradient(90deg, rgba(4, 12, 32, .96), rgba(14, 49, 96, .97), rgba(5, 13, 35, .96)) !important;
}

.Content .aguionOTLoginPage .CaptionInnerContainer {
  min-height: 36px;
  padding: 8px 52px !important;
  border-bottom: 1px solid rgba(122, 218, 255, .65) !important;
  box-shadow: inset 0 -1px 0 rgba(255,255,255,.12), 0 1px 14px rgba(62, 178, 255, .20);
}

.Content .aguionOTLoginPage .CaptionContainer .Text {
  padding: 0 !important;
  color: #fbfdff !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: 16px !important;
  font-weight: 900;
  text-align: center;
  text-shadow: 0 1px 0 #010817, 0 0 9px rgba(114, 206, 255, .55);
}

.Content .aguionOTLoginPage .CaptionEdgeLeftTop,
.Content .aguionOTLoginPage .CaptionEdgeRightTop,
.Content .aguionOTLoginPage .CaptionEdgeLeftBottom,
.Content .aguionOTLoginPage .CaptionEdgeRightBottom,
.Content .aguionOTLoginPage .CaptionBorderTop,
.Content .aguionOTLoginPage .CaptionBorderBottom,
.Content .aguionOTLoginPage .CaptionVerticalLeft,
.Content .aguionOTLoginPage .CaptionVerticalRight {
  display: none !important;
  background-image: none !important;
}

.Content .aguionOTLoginPage .Table4,
.Content .aguionOTLoginPage .InnerTableContainer,
.Content .aguionOTLoginPage .TableContentAndRightShadow,
.Content .aguionOTLoginPage .TableContentContainer,
.Content .aguionOTLoginPage .TableContent {
  width: 100% !important;
  max-width: none !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.Content .aguionOTLoginPage .InnerTableContainer {
  padding: 16px !important;
}

.Content .aguionOTLoginPage .TableContent td {
  padding: 13px 14px !important;
  border: 1px solid rgba(126, 174, 235, .20) !important;
  background: rgba(9, 20, 50, .54) !important;
  color: var(--login-text) !important;
}

.Content .aguionOTLoginPage .loginBoxLogin {
  display: grid !important;
  grid-template-columns: 140px minmax(0, 1fr);
  gap: 10px 14px;
  align-items: center;
  max-width: 560px;
}

.Content .aguionOTLoginPage .loginBoxLogin .Cell {
  float: none !important;
  width: auto !important;
  display: block !important;
}

.Content .aguionOTLoginPage .loginBoxLogin .Break {
  display: none !important;
}

.Content .aguionOTLoginPage .LabelV120 span {
  color: var(--login-gold) !important;
  font-weight: 900 !important;
  text-shadow: 0 0 7px rgba(113, 205, 255, .22);
}

.Content .aguionOTLoginPage .InputField input,
.Content .aguionOTLoginPage input[type='email'],
.Content .aguionOTLoginPage input[type='password'],
.Content .aguionOTLoginPage input[type='text'] {
  width: 100% !important;
  max-width: 100%;
  height: 34px;
  padding: 7px 10px !important;
  border: 1px solid rgba(133, 214, 255, .58) !important;
  border-radius: 9px;
  outline: none;
  background: linear-gradient(180deg, rgba(6, 18, 48, .96), rgba(11, 25, 61, .96)) !important;
  color: #f4f8ff !important;
  box-shadow: inset 0 0 12px rgba(31, 95, 176, .28), 0 0 10px rgba(63, 176, 255, .10);
}

.Content .aguionOTLoginPage .InputField input:focus,
.Content .aguionOTLoginPage input[type='email']:focus,
.Content .aguionOTLoginPage input[type='password']:focus,
.Content .aguionOTLoginPage input[type='text']:focus {
  border-color: rgba(215, 244, 255, .90) !important;
  box-shadow: inset 0 0 13px rgba(62, 144, 220, .34), 0 0 14px rgba(93, 204, 255, .28);
}

.Content .aguionOTLoginPage .LoginButtons {
  width: 170px;
  min-width: 170px;
  vertical-align: middle !important;
  text-align: center;
}

.Content .aguionOTLoginPage .ButtonField {
  display: block !important;
  float: none !important;
  margin: 4px auto 8px !important;
  width: auto !important;
}

.Content .aguionOTLoginPage .BigButton {
  position: relative;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-width: 146px;
  height: 34px;
  margin: 2px auto;
  padding: 0 12px;
  overflow: hidden;
  border: 1px solid rgba(175, 222, 255, .74);
  border-radius: 9px;
  background: linear-gradient(180deg, #1d5aaa, #123878 54%, #091940) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.22), 0 0 12px rgba(72, 180, 255, .28);
}

.Content .aguionOTLoginPage .BigButton::after {
  content: attr(data-label);
}

.Content .aguionOTLoginPage .BigButton:hover {
  border-color: rgba(221, 248, 255, .92);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.28), 0 0 16px rgba(89, 209, 255, .46);
}

.Content .aguionOTLoginPage .BigButton input[type='image'],
.Content .aguionOTLoginPage .ButtonText {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  border: 0 !important;
  background: transparent !important;
  filter: saturate(1.08) brightness(1.08) drop-shadow(0 0 4px rgba(0,0,0,.45));
}

.Content .aguionOTLoginPage #hiddeninfoToken,
.Content .aguionOTLoginPage #showinfoToken {
  padding: 3px 0;
  color: #dce9ff !important;
}

.Content .aguionOTLoginPage #hiddeninfoToken p,
.Content .aguionOTLoginPage #showinfoToken p {
  color: #c9d9f5 !important;
}

.Content .aguionOTLoginPage .g-recaptcha {
  display: inline-block;
  padding: 8px;
  border: 1px solid rgba(132, 204, 255, .26);
  border-radius: 10px;
  background: rgba(6, 16, 42, .64);
}

.Content .aguionOTLoginPage a,
.Content .aguionOTLoginPage a:link,
.Content .aguionOTLoginPage a:visited {
  color: #84e8ff !important;
  font-weight: 800;
  text-decoration: none;
}

.Content .aguionOTLoginPage a:hover {
  color: #ffffff !important;
  text-shadow: 0 0 10px rgba(122, 225, 255, .65);
}

@media (max-width: 720px) {
  .Content .aguionOTLoginPage .TableContent > tbody > tr,
  .Content .aguionOTLoginPage .TableContent > tr {
    display: grid;
  }
  .Content .aguionOTLoginPage .LoginButtons {
    width: 100%;
    min-width: 0;
  }
  .Content .aguionOTLoginPage .loginBoxLogin {
    grid-template-columns: 1fr;
  }
  .Content .aguionOTLoginPage .SmallBox {
    padding-left: 16px;
    padding-top: 58px;
  }
  .Content .aguionOTLoginPage .SmallBox::before {
    top: 16px;
    transform: none;
  }
}
/* === aguionOT LOGIN PAGE REWORK END === */

/* === aguionOT GLOBAL PAGE TITLE + ACCOUNT BACKDROP FIX START === */
.Content .Box {
  background-color: rgba(5, 12, 32, .92) !important;
  border-left-color: rgba(130, 190, 255, .34) !important;
  border-right-color: rgba(130, 190, 255, .34) !important;
}

.Content .Box > .Border_1,
.Content .Box > .Border_2,
.Content .Box > .Border_3 {
  background-color: transparent !important;
}

.Content .Box > .Border_2 > .Border_3 > .BoxContent {
  position: relative;
  border-color: rgba(143, 214, 255, .42) !important;
  background:
    radial-gradient(circle at 8% 0%, rgba(138, 91, 246, .15), transparent 32%),
    radial-gradient(circle at 94% 12%, rgba(64, 188, 255, .12), transparent 34%),
    linear-gradient(180deg, rgba(8, 18, 48, .94), rgba(4, 10, 30, .98)) !important;
  color: #edf6ff !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.035), inset 0 0 34px rgba(82, 48, 172, .10);
}

.Content .Box > .Border_2 > .Border_3 > .BoxContent::before {
  content: '';
  position: absolute;
  left: 10px;
  right: 10px;
  top: 0;
  height: 34px;
  border-bottom: 1px solid rgba(122, 218, 255, .42);
  background:
    radial-gradient(circle at 2% 50%, rgba(139, 92, 246, .34), transparent 12%),
    radial-gradient(circle at 98% 50%, rgba(139, 92, 246, .34), transparent 12%),
    linear-gradient(90deg, rgba(5, 13, 35, .94), rgba(16, 50, 99, .88) 50%, rgba(5, 13, 35, .94));
  box-shadow: 0 1px 12px rgba(65, 185, 255, .16), inset 0 -1px 0 rgba(255,255,255,.08);
  pointer-events: none;
  z-index: 1;
}

.HeaderPagesText {
  top: 4px !important;
  left: 34px !important;
  max-width: calc(100% - 68px);
  height: 27px;
  display: inline-flex;
  align-items: center;
  margin: 0 !important;
  padding: 0 14px !important;
  border: 1px solid rgba(151, 226, 255, .40);
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(7, 18, 48, .82), rgba(37, 64, 132, .74), rgba(7, 18, 48, .82));
  color: #fff2bd !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  letter-spacing: .55px;
  text-transform: uppercase;
  white-space: nowrap;
  text-shadow: 0 1px 0 #020714, 0 0 10px rgba(116, 209, 255, .46) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.055), 0 0 13px rgba(84, 194, 255, .16);
}

.HeaderPagesText::before,
.HeaderPagesText::after {
  content: '';
  width: 9px;
  height: 9px;
  flex: 0 0 auto;
  margin-right: 9px;
  transform: rotate(45deg);
  border: 1px solid rgba(221, 242, 255, .68);
  border-radius: 2px;
  background: radial-gradient(circle, #f3efff 0 10%, #a578ff 14% 45%, #4d23b5 50% 100%);
  box-shadow: 0 0 8px rgba(137, 95, 255, .65), 0 0 10px rgba(87, 206, 255, .30);
}

.HeaderPagesText::after {
  margin: 0 0 0 9px;
}

.Content .aguionOTAccountPage {
  margin-top: 4px;
  padding: 16px 14px 18px;
  border: 1px solid rgba(143, 214, 255, .28);
  border-radius: 15px;
  background:
    radial-gradient(circle at 50% 0%, rgba(120, 76, 230, .11), transparent 42%),
    linear-gradient(180deg, rgba(5, 14, 40, .82), rgba(3, 9, 26, .88)) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.035), 0 8px 22px rgba(0,0,0,.20);
}

.Content .aguionOTAccountPage .topic--body {
  padding: 0 !important;
  background: transparent !important;
}

.Content .aguionOTAccountPage center:first-of-type {
  display: block;
  margin: 2px 0 16px;
  padding: 13px 16px;
  border: 1px solid rgba(131, 205, 255, .34);
  border-radius: 13px;
  background: linear-gradient(90deg, rgba(9, 21, 55, .78), rgba(18, 39, 88, .68), rgba(9, 21, 55, .78));
  box-shadow: inset 0 0 18px rgba(94, 54, 185, .10), 0 0 14px rgba(72, 180, 255, .08);
}

.Content .aguionOTAccountPage center:first-of-type table {
  margin: 0 auto !important;
}

.Content .aguionOTAccountPage center:first-of-type td[style*="font-size"] {
  color: #fff2bd !important;
  -webkit-text-fill-color: #fff2bd;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: 17px !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 0 #020714, 0 0 10px rgba(116, 209, 255, .46) !important;
}

.Content .aguionOTAccountPage center:first-of-type img {
  filter: drop-shadow(0 0 8px rgba(112, 202, 255, .28));
}

.Content .aguionOTAccountPage .TableContent td,
.Content .aguionOTAccountPage .Table1 td,
.Content .aguionOTAccountPage .Table2 td,
.Content .aguionOTAccountPage .Table3 td,
.Content .aguionOTAccountPage .Table4 td,
.Content .aguionOTAccountPage .Table5 td {
  color: #f1f6ff !important;
}

.Content .aguionOTAccountPage .TableContent td[style*="text-align:center"],
.Content .aguionOTAccountPage .TableContent td[style*="text-align: center"] {
  color: #f1f6ff !important;
}

@media (max-width: 760px) {
  .HeaderPagesText {
    left: 24px !important;
    max-width: calc(100% - 48px);
    font-size: 13px !important;
    padding: 0 10px !important;
  }
  .HeaderPagesText::before,
  .HeaderPagesText::after { display: none; }
  .Content .aguionOTAccountPage { padding: 12px 10px 14px; }
}
/* === aguionOT GLOBAL PAGE TITLE + ACCOUNT BACKDROP FIX END === */

/* === aguionOT MAIN TITLE POSITION FIX START === */
.Content .Box > .Border_2 > .Border_3 > .BoxContent::before {
  left: 0 !important;
  right: 0 !important;
  top: -34px !important;
  height: 34px !important;
  border-top: 1px solid rgba(126, 222, 255, .34);
  border-bottom: 1px solid rgba(122, 218, 255, .46);
  background:
    radial-gradient(circle at 2% 50%, rgba(139, 92, 246, .34), transparent 11%),
    radial-gradient(circle at 98% 50%, rgba(139, 92, 246, .34), transparent 11%),
    linear-gradient(90deg, rgba(5, 13, 35, .94), rgba(14, 52, 105, .92) 46%, rgba(44, 28, 91, .78) 74%, rgba(5, 13, 35, .94)) !important;
  z-index: 2 !important;
}

.HeaderPagesText {
  top: -29px !important;
  left: 14px !important;
  height: 28px !important;
  max-width: calc(100% - 28px) !important;
  padding: 0 16px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #fff2bd !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: 17px !important;
  font-weight: 900 !important;
  line-height: 28px !important;
  letter-spacing: .55px;
  text-transform: uppercase;
  text-shadow:
    0 1px 0 #020714,
    0 0 8px rgba(116, 209, 255, .58),
    -1px -1px 0 rgba(0, 0, 0, .85),
    1px 1px 0 rgba(0, 0, 0, .85) !important;
}

.HeaderPagesText::before,
.HeaderPagesText::after {
  width: 8px !important;
  height: 8px !important;
  margin-right: 9px !important;
  border-radius: 2px !important;
  opacity: .95;
}

.HeaderPagesText::after {
  margin: 0 0 0 9px !important;
}

.Content .aguionOTAccountPage {
  margin-top: 0 !important;
}

@media (max-width: 760px) {
  .HeaderPagesText {
    top: -28px !important;
    left: 10px !important;
    max-width: calc(100% - 20px) !important;
    font-size: 14px !important;
    padding: 0 10px !important;
  }
  .HeaderPagesText::before,
  .HeaderPagesText::after { display: inline-block !important; }
}
/* === aguionOT MAIN TITLE POSITION FIX END === */

/* === aguionOT LOST ACCOUNT PAGE REWORK START === */
.Content .aguionOTLostAccountPage {
  --lost-bg: rgba(5, 13, 34, .96);
  --lost-bg-2: rgba(12, 29, 70, .90);
  --lost-line: rgba(132, 219, 255, .68);
  --lost-text: #edf6ff;
  --lost-muted: #b9cbea;
  --lost-gold: #fff1a8;
  width: 100%;
  margin-top: 0;
  padding: 14px;
  border: 1px solid rgba(143, 214, 255, .28);
  border-radius: 15px;
  background:
    radial-gradient(circle at 50% 0%, rgba(120, 76, 230, .12), transparent 42%),
    linear-gradient(180deg, rgba(5, 14, 40, .84), rgba(3, 9, 26, .90)) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.035), 0 8px 22px rgba(0,0,0,.20);
  color: var(--lost-text);
  font-size: 13px;
  line-height: 1.45;
}

.Content .aguionOTLostAccountPage *,
.Content .aguionOTLostAccountPage *::before,
.Content .aguionOTLostAccountPage *::after { box-sizing: border-box; }

.Content .aguionOTLostAccountPage > .TableContainer {
  position: relative;
  overflow: hidden;
  margin: 0 0 18px !important;
  padding: 1px;
  border: 1px solid rgba(184, 226, 255, .62) !important;
  border-radius: 16px;
  background:
    radial-gradient(circle at 8% 0%, rgba(139, 92, 246, .20), transparent 34%),
    radial-gradient(circle at 94% 14%, rgba(69, 190, 255, .18), transparent 34%),
    linear-gradient(180deg, rgba(18, 38, 91, .96), rgba(5, 12, 32, .99)) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.06), 0 8px 22px rgba(0,0,0,.44), 0 0 20px rgba(74, 185, 255, .15) !important;
  font-size: 13px;
}

.Content .aguionOTLostAccountPage > .TableContainer::before,
.Content .aguionOTLostAccountPage > .TableContainer::after {
  content: '';
  position: absolute;
  z-index: 2;
  width: 18px;
  height: 18px;
  top: 10px;
  transform: rotate(45deg);
  border: 1px solid rgba(218, 238, 255, .75);
  border-radius: 4px;
  background: radial-gradient(circle at 50% 45%, #f1eaff 0 12%, #9d72ff 13% 40%, #4620a6 42% 67%, rgba(17, 31, 80, .35) 69% 100%);
  box-shadow: 0 0 10px rgba(130, 86, 255, .8), 0 0 14px rgba(70, 190, 255, .45);
  pointer-events: none;
}

.Content .aguionOTLostAccountPage > .TableContainer::before { left: 14px; }
.Content .aguionOTLostAccountPage > .TableContainer::after { right: 14px; }

.Content .aguionOTLostAccountPage .CaptionContainer,
.Content .aguionOTLostAccountPage .CaptionInnerContainer {
  border: 0 !important;
  background: linear-gradient(90deg, rgba(4, 12, 32, .96), rgba(14, 49, 96, .97), rgba(5, 13, 35, .96)) !important;
}

.Content .aguionOTLostAccountPage .CaptionInnerContainer {
  min-height: 36px;
  padding: 8px 52px !important;
  border-bottom: 1px solid rgba(122, 218, 255, .65) !important;
  box-shadow: inset 0 -1px 0 rgba(255,255,255,.12), 0 1px 14px rgba(62, 178, 255, .20);
}

.Content .aguionOTLostAccountPage .CaptionContainer .Text {
  padding: 0 !important;
  color: #fbfdff !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: 15px !important;
  font-weight: 900;
  text-align: center;
  text-shadow: 0 1px 0 #010817, 0 0 9px rgba(114, 206, 255, .55);
}

.Content .aguionOTLostAccountPage .CaptionEdgeLeftTop,
.Content .aguionOTLostAccountPage .CaptionEdgeRightTop,
.Content .aguionOTLostAccountPage .CaptionEdgeLeftBottom,
.Content .aguionOTLostAccountPage .CaptionEdgeRightBottom,
.Content .aguionOTLostAccountPage .CaptionBorderTop,
.Content .aguionOTLostAccountPage .CaptionBorderBottom,
.Content .aguionOTLostAccountPage .CaptionVerticalLeft,
.Content .aguionOTLostAccountPage .CaptionVerticalRight,
.Content .aguionOTLostAccountPage .TableScrollbarWrapper,
.Content .aguionOTLostAccountPage .TableScrollbarContainer {
  display: none !important;
  background-image: none !important;
}

.Content .aguionOTLostAccountPage .Table5,
.Content .aguionOTLostAccountPage .InnerTableContainer,
.Content .aguionOTLostAccountPage .TableContentContainer,
.Content .aguionOTLostAccountPage .TableContent {
  width: 100% !important;
  max-width: none !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.Content .aguionOTLostAccountPage .InnerTableContainer { padding: 14px !important; }

.Content .aguionOTLostAccountPage .TableContent td,
.Content .aguionOTLostAccountPage .Table5 td {
  padding: 10px 12px !important;
  border: 1px solid rgba(126, 174, 235, .20) !important;
  background: rgba(9, 20, 50, .56) !important;
  color: var(--lost-text) !important;
}

.Content .aguionOTLostAccountPage .TableContent tr[style*="background-color"],
.Content .aguionOTLostAccountPage .TableContent tr[style*="background-color"] td {
  background: rgba(15, 32, 75, .66) !important;
}

.Content .aguionOTLostAccountPage .LabelV200,
.Content .aguionOTLostAccountPage b,
.Content .aguionOTLostAccountPage strong {
  color: var(--lost-gold) !important;
  font-weight: 900 !important;
  text-shadow: 0 0 7px rgba(113, 205, 255, .22);
}

.Content .aguionOTLostAccountPage input[type='text'],
.Content .aguionOTLostAccountPage input[type='password'],
.Content .aguionOTLostAccountPage input[type='email'] {
  width: min(100%, 380px) !important;
  height: 34px;
  padding: 7px 10px !important;
  border: 1px solid rgba(133, 214, 255, .58) !important;
  border-radius: 9px;
  outline: none;
  background: linear-gradient(180deg, rgba(6, 18, 48, .96), rgba(11, 25, 61, .96)) !important;
  color: #f4f8ff !important;
  box-shadow: inset 0 0 12px rgba(31, 95, 176, .28), 0 0 10px rgba(63, 176, 255, .10);
}

.Content .aguionOTLostAccountPage input[type='text']:focus,
.Content .aguionOTLostAccountPage input[type='password']:focus,
.Content .aguionOTLostAccountPage input[type='email']:focus {
  border-color: rgba(215, 244, 255, .90) !important;
  box-shadow: inset 0 0 13px rgba(62, 144, 220, .34), 0 0 14px rgba(93, 204, 255, .28);
}

.Content .aguionOTLostAccountPage input[type='radio'] {
  width: 16px;
  height: 16px;
  margin: 4px 7px 4px 0;
  accent-color: #7fe4ff;
  vertical-align: middle;
}

.Content .aguionOTLostAccountPage .BigButton {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-width: 136px;
  height: 32px;
  margin: 4px auto;
  padding: 0 14px !important;
  overflow: hidden;
  border: 1px solid rgba(175, 222, 255, .74);
  border-radius: 9px;
  background: linear-gradient(180deg, #1d5aaa, #123878 54%, #091940) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.22), 0 0 12px rgba(72, 180, 255, .28);
}

.Content .aguionOTLostAccountPage .BigButton:hover {
  border-color: rgba(221, 248, 255, .92);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.28), 0 0 16px rgba(89, 209, 255, .46);
}

.Content .aguionOTLostAccountPage .BigButtonText,
.Content .aguionOTLostAccountPage input[type='submit'] {
  border: 0 !important;
  background: transparent !important;
  color: #fff7d8 !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 1px #020611, 0 0 7px rgba(105, 216, 255, .35);
  cursor: pointer;
}

.Content .aguionOTLostAccountPage td[style*="color: red"] {
  color: #ff9ab8 !important;
  background: rgba(73, 16, 36, .54) !important;
  border-color: rgba(255, 144, 177, .30) !important;
}

.Content .aguionOTLostAccountPage a,
.Content .aguionOTLostAccountPage a:link,
.Content .aguionOTLostAccountPage a:visited {
  color: #84e8ff !important;
  font-weight: 800;
  text-decoration: none;
}

.Content .aguionOTLostAccountPage a:hover {
  color: #fff !important;
  text-shadow: 0 0 10px rgba(122, 225, 255, .65);
}

@media (max-width: 720px) {
  .Content .aguionOTLostAccountPage { padding: 10px; }
  .Content .aguionOTLostAccountPage .CaptionInnerContainer { padding-left: 42px !important; padding-right: 42px !important; }
  .Content .aguionOTLostAccountPage .CaptionContainer .Text { font-size: 13px !important; }
  .Content .aguionOTLostAccountPage .TableContent td { display: block; width: 100% !important; }
}
/* === aguionOT LOST ACCOUNT PAGE REWORK END === */

/* === aguionOT DOWNLOAD PAGE REWORK START === */
.Content .aguionOTDownloadPage {
  --download-text: #edf6ff;
  --download-muted: #b9cbea;
  --download-gold: #fff1a8;
  width: 100%;
  padding: 14px;
  border: 1px solid rgba(143, 214, 255, .28);
  border-radius: 15px;
  background:
    radial-gradient(circle at 50% 0%, rgba(120, 76, 230, .12), transparent 42%),
    linear-gradient(180deg, rgba(5, 14, 40, .84), rgba(3, 9, 26, .90)) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.035), 0 8px 22px rgba(0,0,0,.20);
  color: var(--download-text);
  font-size: 13px;
  line-height: 1.48;
}

.Content .aguionOTDownloadPage *,
.Content .aguionOTDownloadPage *::before,
.Content .aguionOTDownloadPage *::after { box-sizing: border-box; }

.Content .aguionOTDownloadPage .topic--body {
  width: 100% !important;
  padding: 0 !important;
  background: transparent !important;
}

.Content .aguionOTDownloadPage .topic--body > p:first-child {
  margin: 0 0 15px;
  padding: 15px 18px 15px 66px;
  position: relative;
  border: 1px solid rgba(132, 204, 255, .38);
  border-radius: 14px;
  background:
    radial-gradient(circle at 8% 0%, rgba(139, 92, 246, .15), transparent 34%),
    linear-gradient(180deg, rgba(12, 29, 70, .82), rgba(5, 14, 39, .92)) !important;
  color: #dce9ff !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.04), 0 7px 18px rgba(0,0,0,.24);
}

.Content .aguionOTDownloadPage .topic--body > p:first-child::before {
  content: '↓';
  position: absolute;
  left: 18px;
  top: 50%;
  width: 34px;
  height: 34px;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(151, 226, 255, .56);
  border-radius: 12px;
  background: radial-gradient(circle, rgba(118, 85, 246, .38), rgba(12, 31, 75, .88));
  color: #fff1a8;
  font-size: 22px;
  font-weight: 900;
  text-shadow: 0 0 10px rgba(255, 226, 123, .34);
  box-shadow: 0 0 14px rgba(93, 204, 255, .16);
}

.Content .aguionOTDownloadPage > .topic--body > .TableContainer,
.Content .aguionOTDownloadPage .TableContainer {
  position: relative;
  overflow: hidden;
  margin: 0 0 18px !important;
  padding: 1px;
  border: 1px solid rgba(184, 226, 255, .62) !important;
  border-radius: 16px;
  background:
    radial-gradient(circle at 8% 0%, rgba(139, 92, 246, .20), transparent 34%),
    radial-gradient(circle at 94% 14%, rgba(69, 190, 255, .18), transparent 34%),
    linear-gradient(180deg, rgba(18, 38, 91, .96), rgba(5, 12, 32, .99)) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.06), 0 8px 22px rgba(0,0,0,.44), 0 0 20px rgba(74, 185, 255, .15) !important;
  font-size: 13px;
}

.Content .aguionOTDownloadPage .TableContainer::before,
.Content .aguionOTDownloadPage .TableContainer::after {
  content: '';
  position: absolute;
  z-index: 2;
  width: 18px;
  height: 18px;
  top: 10px;
  transform: rotate(45deg);
  border: 1px solid rgba(218, 238, 255, .75);
  border-radius: 4px;
  background: radial-gradient(circle at 50% 45%, #f1eaff 0 12%, #9d72ff 13% 40%, #4620a6 42% 67%, rgba(17, 31, 80, .35) 69% 100%);
  box-shadow: 0 0 10px rgba(130, 86, 255, .8), 0 0 14px rgba(70, 190, 255, .45);
  pointer-events: none;
}

.Content .aguionOTDownloadPage .TableContainer::before { left: 14px; }
.Content .aguionOTDownloadPage .TableContainer::after { right: 14px; }

.Content .aguionOTDownloadPage .CaptionContainer,
.Content .aguionOTDownloadPage .CaptionInnerContainer {
  border: 0 !important;
  background: linear-gradient(90deg, rgba(4, 12, 32, .96), rgba(14, 49, 96, .97), rgba(5, 13, 35, .96)) !important;
}

.Content .aguionOTDownloadPage .CaptionInnerContainer {
  min-height: 36px;
  padding: 8px 52px !important;
  border-bottom: 1px solid rgba(122, 218, 255, .65) !important;
  box-shadow: inset 0 -1px 0 rgba(255,255,255,.12), 0 1px 14px rgba(62, 178, 255, .20);
}

.Content .aguionOTDownloadPage .CaptionContainer .Text {
  padding: 0 !important;
  color: #fbfdff !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: 16px !important;
  font-weight: 900;
  text-align: center;
  text-shadow: 0 1px 0 #010817, 0 0 9px rgba(114, 206, 255, .55);
}

.Content .aguionOTDownloadPage .CaptionContainer small {
  color: #9eeaff !important;
  font-family: Verdana, Arial, sans-serif;
  font-size: 10px !important;
  text-shadow: none !important;
}

.Content .aguionOTDownloadPage .CaptionEdgeLeftTop,
.Content .aguionOTDownloadPage .CaptionEdgeRightTop,
.Content .aguionOTDownloadPage .CaptionEdgeLeftBottom,
.Content .aguionOTDownloadPage .CaptionEdgeRightBottom,
.Content .aguionOTDownloadPage .CaptionBorderTop,
.Content .aguionOTDownloadPage .CaptionBorderBottom,
.Content .aguionOTDownloadPage .CaptionVerticalLeft,
.Content .aguionOTDownloadPage .CaptionVerticalRight,
.Content .aguionOTDownloadPage .TableScrollbarWrapper,
.Content .aguionOTDownloadPage .TableScrollbarContainer {
  display: none !important;
  background-image: none !important;
}

.Content .aguionOTDownloadPage .Table3,
.Content .aguionOTDownloadPage .Table5,
.Content .aguionOTDownloadPage .InnerTableContainer,
.Content .aguionOTDownloadPage .TableContentContainer,
.Content .aguionOTDownloadPage .TableContent {
  width: 100% !important;
  max-width: none !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.Content .aguionOTDownloadPage .InnerTableContainer { padding: 14px !important; }

.Content .aguionOTDownloadPage .TableContent td,
.Content .aguionOTDownloadPage .Table3 td,
.Content .aguionOTDownloadPage .Table5 td {
  padding: 12px 14px !important;
  border: 1px solid rgba(126, 174, 235, .20) !important;
  background: rgba(9, 20, 50, .56) !important;
  color: var(--download-text) !important;
}

.Content .aguionOTDownloadPage tr[bgcolor],
.Content .aguionOTDownloadPage tr[bgcolor] > td {
  background:
    radial-gradient(circle at 96% 10%, rgba(139, 92, 246, .14), transparent 32%),
    linear-gradient(180deg, rgba(15, 32, 75, .78), rgba(7, 18, 48, .92)) !important;
}

.Content .aguionOTDownloadPage .TableStripped {
  border-collapse: separate !important;
  border-spacing: 0 !important;
  margin: 0 0 12px;
  border: 1px solid rgba(126, 195, 255, .34) !important;
  border-radius: 14px;
  overflow: hidden;
  background: linear-gradient(180deg, rgba(13, 31, 74, .92), rgba(5, 14, 39, .98)) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.04), 0 6px 16px rgba(0,0,0,.30) !important;
}

.Content .aguionOTDownloadPage .TableStripped td:first-child {
  width: auto;
}

.Content .aguionOTDownloadPage .TableStripped td:last-child {
  width: 132px !important;
  text-align: center;
  border-left: 1px solid rgba(126, 174, 235, .24) !important;
  background: rgba(8, 19, 49, .62) !important;
}

.Content .aguionOTDownloadPage p,
.Content .aguionOTDownloadPage small,
.Content .aguionOTDownloadPage em {
  color: #dce9ff !important;
  line-height: 1.58;
}

.Content .aguionOTDownloadPage b,
.Content .aguionOTDownloadPage strong {
  color: var(--download-gold) !important;
  font-weight: 900 !important;
  text-shadow: 0 0 7px rgba(113, 205, 255, .22);
}

.Content .aguionOTDownloadPage font,
.Content .aguionOTDownloadPage strong[style*="color"] {
  color: #ff9ab8 !important;
}

.Content .aguionOTDownloadPage a,
.Content .aguionOTDownloadPage a:link,
.Content .aguionOTDownloadPage a:visited {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 26px;
  padding: 4px 12px;
  border: 1px solid rgba(143, 221, 255, .72);
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(31, 91, 165, .98), rgba(15, 47, 105, .98) 56%, rgba(7, 20, 55, .98));
  color: #f6fbff !important;
  font-weight: 900;
  text-decoration: none !important;
  text-shadow: 0 1px 1px #020611, 0 0 7px rgba(105, 216, 255, .42);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 0 10px rgba(68, 179, 255, .20);
}

.Content .aguionOTDownloadPage p a,
.Content .aguionOTDownloadPage small a {
  display: inline;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  color: #84e8ff !important;
  text-shadow: 0 0 7px rgba(104, 216, 255, .34);
}

.Content .aguionOTDownloadPage a:hover {
  border-color: rgba(221, 248, 255, .92);
  color: #fff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.24), 0 0 14px rgba(89, 209, 255, .42);
}

.Content .aguionOTDownloadPage img[src*="client_"],
.Content .aguionOTDownloadPage img.NewsImageLinkThumbnail {
  width: 64px !important;
  height: 64px !important;
  object-fit: contain;
  margin: 0 0 8px !important;
  border-radius: 12px;
  filter: drop-shadow(0 0 10px rgba(116, 210, 255, .28));
}

.Content .aguionOTDownloadPage center > form .BigButton,
.Content .aguionOTDownloadPage .BigButton {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-width: 146px;
  height: 34px;
  margin: 4px auto;
  padding: 0 14px !important;
  border: 1px solid rgba(175, 222, 255, .74);
  border-radius: 9px;
  background: linear-gradient(180deg, #1d5aaa, #123878 54%, #091940) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.22), 0 0 12px rgba(72, 180, 255, .28);
}

.Content .aguionOTDownloadPage center > form .BigButton {
  min-width: 190px;
  height: 40px;
  border-color: rgba(255, 230, 145, .68);
  background: linear-gradient(180deg, rgba(39, 128, 206, .98), rgba(62, 61, 155, .98) 56%, rgba(9, 24, 64, .98)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.26), 0 0 18px rgba(89, 209, 255, .32), 0 0 16px rgba(255, 225, 132, .12);
}

.Content .aguionOTDownloadPage .BigButtonText,
.Content .aguionOTDownloadPage input[type='submit'] {
  border: 0 !important;
  background: transparent !important;
  color: #fff7d8 !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 1px #020611, 0 0 7px rgba(105, 216, 255, .35);
  cursor: pointer;
}

@media (max-width: 720px) {
  .Content .aguionOTDownloadPage { padding: 10px; }
  .Content .aguionOTDownloadPage .topic--body > p:first-child { padding-left: 16px; padding-top: 56px; }
  .Content .aguionOTDownloadPage .topic--body > p:first-child::before { top: 16px; transform: none; }
  .Content .aguionOTDownloadPage .TableStripped td { display: block; width: 100% !important; }
  .Content .aguionOTDownloadPage .TableStripped td:last-child { border-left: 0 !important; border-top: 1px solid rgba(126, 174, 235, .24) !important; }
}
/* === aguionOT DOWNLOAD PAGE REWORK END === */

/* === aguionOT CASTS + CHARACTERS REWORK START === */
.Content .aguionOTCastsPage,
.Content .aguionOTCharactersPage {
  --lc-text: #edf6ff;
  --lc-muted: #b9cbea;
  --lc-gold: #fff1a8;
  --lc-cyan: #8eeaff;
  width: 100%;
  padding: 14px;
  border: 1px solid rgba(143, 214, 255, .28);
  border-radius: 15px;
  background:
    radial-gradient(circle at 50% 0%, rgba(120, 76, 230, .12), transparent 42%),
    linear-gradient(180deg, rgba(5, 14, 40, .84), rgba(3, 9, 26, .90)) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.035), 0 8px 22px rgba(0,0,0,.20);
  color: var(--lc-text);
  font-size: 13px;
  line-height: 1.48;
}

.Content .aguionOTCastsPage *,
.Content .aguionOTCastsPage *::before,
.Content .aguionOTCastsPage *::after,
.Content .aguionOTCharactersPage *,
.Content .aguionOTCharactersPage *::before,
.Content .aguionOTCharactersPage *::after { box-sizing: border-box; }

/* Casts */
.Content .aguionOTCastsPage .info-section,
.Content .aguionOTCastsPage .commands-section,
.Content .aguionOTCastsPage .spectator-section,
.Content .aguionOTCastsPage .empty-state {
  position: relative;
  overflow: hidden;
  margin: 0 0 16px !important;
  padding: 17px 18px !important;
  border: 1px solid rgba(132, 204, 255, .40) !important;
  border-left: 1px solid rgba(132, 204, 255, .40) !important;
  border-radius: 15px !important;
  background:
    radial-gradient(circle at 8% 0%, rgba(139, 92, 246, .16), transparent 34%),
    linear-gradient(180deg, rgba(12, 29, 70, .92), rgba(5, 14, 39, .97)) !important;
  color: var(--lc-text) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.04), 0 7px 20px rgba(0,0,0,.30), 0 0 16px rgba(73, 181, 255, .10) !important;
}

.Content .aguionOTCastsPage .info-header,
.Content .aguionOTCastsPage .commands-header,
.Content .aguionOTCastsPage .spectator-header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 13px !important;
  padding: 0 0 10px !important;
  border-bottom: 1px solid rgba(123, 205, 255, .26) !important;
}

.Content .aguionOTCastsPage .info-icon,
.Content .aguionOTCastsPage .commands-icon,
.Content .aguionOTCastsPage .spectator-icon,
.Content .aguionOTCastsPage .feature-icon,
.Content .aguionOTCastsPage .empty-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border: 1px solid rgba(156, 226, 255, .46);
  border-radius: 12px;
  background: radial-gradient(circle, rgba(128, 86, 242, .34), rgba(12, 31, 75, .88));
  color: var(--lc-gold) !important;
  font-size: 20px !important;
  filter: drop-shadow(0 0 8px rgba(113, 205, 255, .24));
}

.Content .aguionOTCastsPage h3,
.Content .aguionOTCastsPage .active-casts-title {
  margin: 0 !important;
  color: var(--lc-gold) !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: 18px !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 0 #020714, 0 0 10px rgba(116, 209, 255, .42) !important;
}

.Content .aguionOTCastsPage .active-casts-title {
  display: block;
  margin: 22px 0 12px !important;
  text-align: center;
}

.Content .aguionOTCastsPage p,
.Content .aguionOTCastsPage small,
.Content .aguionOTCastsPage .command-desc,
.Content .aguionOTCastsPage .feature-text small {
  color: #dce9ff !important;
  line-height: 1.58;
}

.Content .aguionOTCastsPage .highlight {
  display: inline;
  padding: 2px 7px !important;
  border: 1px solid rgba(255, 226, 128, .30);
  border-radius: 7px;
  background: rgba(58, 44, 86, .64) !important;
  color: var(--lc-gold) !important;
  font-weight: 900;
}

.Content .aguionOTCastsPage .commands-grid,
.Content .aguionOTCastsPage .feature-box {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 12px !important;
}

.Content .aguionOTCastsPage .command-card,
.Content .aguionOTCastsPage .feature,
.Content .aguionOTCastsPage .cast-card-compact {
  border: 1px solid rgba(126, 195, 255, .34) !important;
  border-radius: 14px !important;
  background:
    radial-gradient(circle at 96% 0%, rgba(139, 92, 246, .13), transparent 34%),
    linear-gradient(180deg, rgba(13, 31, 74, .92), rgba(5, 14, 39, .98)) !important;
  color: var(--lc-text) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.04), 0 6px 16px rgba(0,0,0,.30) !important;
}

.Content .aguionOTCastsPage .command-card { padding: 14px !important; }
.Content .aguionOTCastsPage .command {
  margin: 0 0 10px !important;
  padding: 0 0 10px !important;
  border-bottom: 1px dashed rgba(126, 174, 235, .24) !important;
}
.Content .aguionOTCastsPage .command:last-child { margin-bottom: 0 !important; padding-bottom: 0 !important; border-bottom: 0 !important; }
.Content .aguionOTCastsPage .command-name {
  display: block !important;
  min-width: 0 !important;
  margin-bottom: 4px;
  color: var(--lc-cyan) !important;
  font-family: Consolas, 'Courier New', monospace;
  font-weight: 900 !important;
  text-shadow: 0 0 8px rgba(102, 210, 255, .28);
}

.Content .aguionOTCastsPage .feature {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 14px !important;
}
.Content .aguionOTCastsPage .feature strong { color: var(--lc-gold) !important; }

.Content .aguionOTCastsPage .casts-grid-compact {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px !important;
  padding: 0 !important;
}

.Content .aguionOTCastsPage .cast-card-compact { overflow: hidden; }
.Content .aguionOTCastsPage .cast-header-compact {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 10px;
  border-bottom: 1px solid rgba(126, 211, 255, .28);
  background: linear-gradient(90deg, rgba(28, 78, 150, .82), rgba(83, 58, 165, .68)) !important;
}
.Content .aguionOTCastsPage .cast-world-tag { color: #fff7d6 !important; font-weight: 900; font-size: 11px; }
.Content .aguionOTCastsPage .cast-body-compact { padding: 12px !important; }
.Content .aguionOTCastsPage .cast-player-compact { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.Content .aguionOTCastsPage .player-outfit-compact img { max-width: 54px; max-height: 54px; filter: drop-shadow(0 0 8px rgba(116,210,255,.26)); }
.Content .aguionOTCastsPage .player-name-compact { color: var(--lc-cyan) !important; font-weight: 900; text-decoration: none; }
.Content .aguionOTCastsPage .player-level-compact,
.Content .aguionOTCastsPage .cast-meta-compact { color: var(--lc-muted) !important; font-size: 11px; }
.Content .aguionOTCastsPage .cast-title-compact { color: var(--lc-gold) !important; font-weight: 900; margin: 8px 0; }
.Content .aguionOTCastsPage .cast-footer-compact { padding: 0 12px 12px; }
.Content .aguionOTCastsPage .watch-button-compact {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 30px;
  padding: 6px 12px !important;
  border: 1px solid rgba(143, 221, 255, .72) !important;
  border-radius: 9px !important;
  background: linear-gradient(180deg, rgba(31, 91, 165, .98), rgba(15, 47, 105, .98) 56%, rgba(7, 20, 55, .98)) !important;
  color: #f6fbff !important;
  font-weight: 900;
  text-decoration: none !important;
  text-shadow: 0 1px 1px #020611, 0 0 7px rgba(105, 216, 255, .42);
}

/* Characters */
.Content .aguionOTCharactersPage > .TableContainer,
.Content .aguionOTCharactersPage .TableContainer {
  position: relative;
  overflow: hidden;
  margin: 0 0 18px !important;
  padding: 1px;
  border: 1px solid rgba(184, 226, 255, .62) !important;
  border-radius: 16px;
  background:
    radial-gradient(circle at 8% 0%, rgba(139, 92, 246, .20), transparent 34%),
    radial-gradient(circle at 94% 14%, rgba(69, 190, 255, .18), transparent 34%),
    linear-gradient(180deg, rgba(18, 38, 91, .96), rgba(5, 12, 32, .99)) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.06), 0 8px 22px rgba(0,0,0,.44), 0 0 20px rgba(74, 185, 255, .15) !important;
  font-size: 13px;
}

.Content .aguionOTCharactersPage .TableContainer::before,
.Content .aguionOTCharactersPage .TableContainer::after {
  content: '';
  position: absolute;
  z-index: 2;
  width: 18px;
  height: 18px;
  top: 10px;
  transform: rotate(45deg);
  border: 1px solid rgba(218, 238, 255, .75);
  border-radius: 4px;
  background: radial-gradient(circle at 50% 45%, #f1eaff 0 12%, #9d72ff 13% 40%, #4620a6 42% 67%, rgba(17, 31, 80, .35) 69% 100%);
  box-shadow: 0 0 10px rgba(130, 86, 255, .8), 0 0 14px rgba(70, 190, 255, .45);
  pointer-events: none;
}
.Content .aguionOTCharactersPage .TableContainer::before { left: 14px; }
.Content .aguionOTCharactersPage .TableContainer::after { right: 14px; }

.Content .aguionOTCharactersPage .CaptionContainer,
.Content .aguionOTCharactersPage .CaptionInnerContainer {
  border: 0 !important;
  background: linear-gradient(90deg, rgba(4, 12, 32, .96), rgba(14, 49, 96, .97), rgba(5, 13, 35, .96)) !important;
}
.Content .aguionOTCharactersPage .CaptionInnerContainer {
  min-height: 36px;
  padding: 8px 52px !important;
  border-bottom: 1px solid rgba(122, 218, 255, .65) !important;
  box-shadow: inset 0 -1px 0 rgba(255,255,255,.12), 0 1px 14px rgba(62, 178, 255, .20);
}
.Content .aguionOTCharactersPage .CaptionContainer .Text {
  padding: 0 !important;
  color: #fbfdff !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: 16px !important;
  font-weight: 900;
  text-align: center;
  text-shadow: 0 1px 0 #010817, 0 0 9px rgba(114, 206, 255, .55);
}
.Content .aguionOTCharactersPage .CaptionEdgeLeftTop,
.Content .aguionOTCharactersPage .CaptionEdgeRightTop,
.Content .aguionOTCharactersPage .CaptionEdgeLeftBottom,
.Content .aguionOTCharactersPage .CaptionEdgeRightBottom,
.Content .aguionOTCharactersPage .CaptionBorderTop,
.Content .aguionOTCharactersPage .CaptionBorderBottom,
.Content .aguionOTCharactersPage .CaptionVerticalLeft,
.Content .aguionOTCharactersPage .CaptionVerticalRight,
.Content .aguionOTCharactersPage .TableScrollbarWrapper,
.Content .aguionOTCharactersPage .TableScrollbarContainer {
  display: none !important;
  background-image: none !important;
}

.Content .aguionOTCharactersPage .Table1,
.Content .aguionOTCharactersPage .Table2,
.Content .aguionOTCharactersPage .Table3,
.Content .aguionOTCharactersPage .Table4,
.Content .aguionOTCharactersPage .Table5,
.Content .aguionOTCharactersPage .InnerTableContainer,
.Content .aguionOTCharactersPage .TableContentContainer,
.Content .aguionOTCharactersPage .TableContent,
.Content .aguionOTCharactersPage .TableContentAndRightShadow {
  width: 100% !important;
  max-width: none !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.Content .aguionOTCharactersPage .InnerTableContainer { padding: 14px !important; }

.Content .aguionOTCharactersPage .TableContent {
  border-collapse: separate !important;
  border-spacing: 0 !important;
  overflow: hidden;
  border-radius: 12px;
}

.Content .aguionOTCharactersPage .TableContent td,
.Content .aguionOTCharactersPage .Table1 td,
.Content .aguionOTCharactersPage .Table2 td,
.Content .aguionOTCharactersPage .Table3 td,
.Content .aguionOTCharactersPage .Table4 td,
.Content .aguionOTCharactersPage .Table5 td {
  padding: 9px 11px !important;
  border: 1px solid rgba(126, 174, 235, .20) !important;
  background: rgba(9, 20, 50, .56) !important;
  color: var(--lc-text) !important;
}

.Content .aguionOTCharactersPage tr[bgcolor] > td,
.Content .aguionOTCharactersPage tr:nth-child(odd) > td { background: rgba(15, 32, 75, .66) !important; }
.Content .aguionOTCharactersPage tr:nth-child(even) > td { background: rgba(8, 21, 55, .74) !important; }

.Content .aguionOTCharactersPage .LabelV120,
.Content .aguionOTCharactersPage .LabelV175,
.Content .aguionOTCharactersPage .LabelV200,
.Content .aguionOTCharactersPage b,
.Content .aguionOTCharactersPage strong {
  color: var(--lc-gold) !important;
  font-weight: 900 !important;
  text-shadow: 0 0 7px rgba(113, 205, 255, .22);
}

.Content .aguionOTCharactersPage .TableContent .LabelV175,
.Content .aguionOTCharactersPage .TableContent .LabelV200,
.Content .aguionOTCharactersPage .TableContent .LabelV120 {
  width: 190px !important;
  background: linear-gradient(90deg, rgba(24, 50, 105, .78), rgba(12, 27, 66, .72)) !important;
}

.Content .aguionOTCharactersPage a,
.Content .aguionOTCharactersPage a:link,
.Content .aguionOTCharactersPage a:visited {
  color: var(--lc-cyan) !important;
  font-weight: 900;
  text-decoration: none !important;
  text-shadow: 0 0 7px rgba(104, 216, 255, .34);
}
.Content .aguionOTCharactersPage a:hover { color: #fff !important; text-shadow: 0 0 10px rgba(122, 225, 255, .65); }

.Content .aguionOTCharactersPage input:not([type='image']),
.Content .aguionOTCharactersPage select,
.Content .aguionOTCharactersPage textarea {
  max-width: 100%;
  height: 34px;
  padding: 7px 10px !important;
  border: 1px solid rgba(133, 214, 255, .58) !important;
  border-radius: 9px;
  outline: none;
  background: linear-gradient(180deg, rgba(6, 18, 48, .96), rgba(11, 25, 61, .96)) !important;
  color: #f4f8ff !important;
  box-shadow: inset 0 0 12px rgba(31, 95, 176, .28), 0 0 10px rgba(63, 176, 255, .10);
}
.Content .aguionOTCharactersPage input:focus,
.Content .aguionOTCharactersPage select:focus,
.Content .aguionOTCharactersPage textarea:focus {
  border-color: rgba(215, 244, 255, .90) !important;
  box-shadow: inset 0 0 13px rgba(62, 144, 220, .34), 0 0 14px rgba(93, 204, 255, .28);
}

.Content .aguionOTCharactersPage .ThreeColumnsForm {
  display: grid !important;
  grid-template-columns: 150px minmax(0, 1fr) auto;
  gap: 10px 12px;
  align-items: center;
}
.Content .aguionOTCharactersPage .ThreeColumnsFormCell { width: auto !important; float: none !important; }
.Content .aguionOTCharactersPage .ThreeColumnsFormButton { justify-self: end; }

.Content .aguionOTCharactersPage .BigButton,
.Content .aguionOTCharactersPage .BigButtonNoImage {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-width: 136px;
  height: 32px;
  margin: 4px auto;
  padding: 0 14px !important;
  border: 1px solid rgba(175, 222, 255, .74);
  border-radius: 9px;
  background: linear-gradient(180deg, #1d5aaa, #123878 54%, #091940) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.22), 0 0 12px rgba(72, 180, 255, .28);
}
.Content .aguionOTCharactersPage .BigButtonText,
.Content .aguionOTCharactersPage input[type='submit'] {
  border: 0 !important;
  background: transparent !important;
  color: #fff7d8 !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 1px #020611, 0 0 7px rgba(105, 216, 255, .35);
  cursor: pointer;
}

.Content .aguionOTCharactersPage img[src*='outfit'],
.Content .aguionOTCharactersPage img[src*='skulls'],
.Content .aguionOTCharactersPage img[src*='Achievement'],
.Content .aguionOTCharactersPage img[src*='icon-character'] {
  filter: drop-shadow(0 0 7px rgba(116,210,255,.22));
}

.Content .aguionOTCharactersPage .yes-tick { color: #75ffbf !important; }
.Content .aguionOTCharactersPage .no-tick { color: #ff8fae !important; }
.Content .aguionOTCharactersPage td[style*='color:red'],
.Content .aguionOTCharactersPage span[style*='color:red'] { color: #ff9ab8 !important; }
.Content .aguionOTCharactersPage span[style*='color:green'] { color: #75ffbf !important; }

@media (max-width: 760px) {
  .Content .aguionOTCastsPage,
  .Content .aguionOTCharactersPage { padding: 10px; }
  .Content .aguionOTCharactersPage .ThreeColumnsForm { grid-template-columns: 1fr; }
  .Content .aguionOTCharactersPage .ThreeColumnsFormButton { justify-self: stretch; }
  .Content .aguionOTCharactersPage .TableContent .LabelV175,
  .Content .aguionOTCharactersPage .TableContent .LabelV200,
  .Content .aguionOTCharactersPage .TableContent .LabelV120 { width: auto !important; }
}
/* === aguionOT CASTS + CHARACTERS REWORK END === */

/* === aguionOT CHARACTER PROFILE DETAIL FIX START === */
.Content .aguionOTCharactersPage #ReadableEquips > td {
  padding: 16px !important;
  background:
    radial-gradient(circle at 10% 0%, rgba(139, 92, 246, .13), transparent 32%),
    linear-gradient(180deg, rgba(8, 20, 53, .74), rgba(4, 12, 34, .88)) !important;
}

.Content .aguionOTCharactersPage .parent-container {
  display: grid !important;
  grid-template-columns: 276px minmax(0, 1fr);
  gap: 16px;
  align-items: stretch;
  width: 100%;
  max-width: 100%;
}

.Content .aguionOTCharactersPage .parent-container > table {
  width: 100% !important;
  min-width: 0 !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

.Content .aguionOTCharactersPage .parent-container > table:first-child {
  grid-column: 1;
}

.Content .aguionOTCharactersPage .parent-container > table:nth-of-type(2) {
  grid-column: 2;
}

.Content .aguionOTCharactersPage .parent-container > table > tbody > tr > td,
.Content .aguionOTCharactersPage .parent-container > table > tr > td {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

.Content .aguionOTCharactersPage .equipped-items {
  width: 100%;
  height: 100%;
  padding: 12px;
  border: 1px solid rgba(151, 226, 255, .42);
  border-radius: 14px;
  background:
    radial-gradient(circle at 50% 8%, rgba(139, 92, 246, .15), transparent 38%),
    linear-gradient(180deg, rgba(12, 29, 70, .78), rgba(5, 14, 39, .94)) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.035), 0 0 14px rgba(70, 190, 255, .08);
}

.Content .aguionOTCharactersPage .equipped-items::before {
  content: 'EQUIPAMENTOS';
  display: block;
  margin: 0 0 10px;
  color: var(--lc-gold);
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 1px;
  text-align: center;
  text-shadow: 0 0 8px rgba(116, 209, 255, .36);
}

.Content .aguionOTCharactersPage .equipped-items .TableContent,
.Content .aguionOTCharactersPage .equipped-items table {
  width: 100% !important;
  height: auto !important;
  table-layout: fixed;
  border: 0 !important;
  background: transparent !important;
}

.Content .aguionOTCharactersPage .equipped-items table table {
  border-collapse: separate !important;
  border-spacing: 8px !important;
}

.Content .aguionOTCharactersPage .equipped-items td {
  position: relative;
  width: 33.333% !important;
  min-width: 0 !important;
  height: 58px !important;
  padding: 5px !important;
  overflow: visible !important;
  border: 1px solid rgba(162, 208, 255, .20) !important;
  border-radius: 8px;
  background:
    radial-gradient(circle at 50% 38%, rgba(222, 215, 189, .18), rgba(12, 25, 60, .86) 62%, rgba(5, 13, 35, .96)) !important;
  color: #f4f8ff !important;
  text-align: center !important;
  vertical-align: middle !important;
  box-shadow: inset 0 0 10px rgba(0,0,0,.20), 0 0 8px rgba(73, 181, 255, .05);
}

.Content .aguionOTCharactersPage .equipped-items td img {
  max-width: 45px !important;
  max-height: 45px !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain;
  vertical-align: middle;
  filter: drop-shadow(0 0 7px rgba(119, 211, 255, .22));
}

.Content .aguionOTCharactersPage .equipped-items td:has(img.HelperDivIndicator) {
  background:
    radial-gradient(circle at 50% 38%, rgba(115, 218, 255, .18), rgba(15, 35, 82, .88) 62%, rgba(5, 13, 35, .96)) !important;
  border-color: rgba(139, 222, 255, .34) !important;
}

.Content .aguionOTCharactersPage .equipped-items td:not(:has(img)) {
  font-size: 12px;
  font-weight: 900;
  line-height: 1.35;
  color: #dce9ff !important;
}

.Content .aguionOTCharactersPage .equipped-items td:not(:has(img))::first-line {
  color: var(--lc-gold);
}

.Content .aguionOTCharactersPage #ReadableEquips .parent-container > table:nth-of-type(2) > tbody > tr:first-child .TableContentContainer,
.Content .aguionOTCharactersPage #ReadableEquips .parent-container > table:nth-of-type(2) > tr:first-child .TableContentContainer {
  margin-bottom: 12px;
}

.Content .aguionOTCharactersPage #ReadableEquips .parent-container > table:nth-of-type(2) .TableContentContainer {
  width: 100%;
  padding: 0;
  border: 1px solid rgba(126, 195, 255, .34) !important;
  border-radius: 14px;
  overflow: hidden;
  background:
    radial-gradient(circle at 96% 0%, rgba(139, 92, 246, .12), transparent 34%),
    linear-gradient(180deg, rgba(13, 31, 74, .86), rgba(5, 14, 39, .96)) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.035), 0 6px 16px rgba(0,0,0,.24) !important;
}

.Content .aguionOTCharactersPage #ReadableEquips .parent-container > table:nth-of-type(2) .Table5,
.Content .aguionOTCharactersPage #ReadableEquips .parent-container > table:nth-of-type(2) table[style*='height: 115px'] {
  min-width: 0 !important;
  width: 100% !important;
  height: auto !important;
  table-layout: fixed;
  border: 0 !important;
}

.Content .aguionOTCharactersPage #ReadableEquips .parent-container > table:nth-of-type(2) .Table5 td {
  min-width: 52px;
  padding: 8px 6px !important;
  white-space: nowrap;
  text-align: center !important;
}

.Content .aguionOTCharactersPage #ReadableEquips .parent-container > table:nth-of-type(2) .Table5 img[src*='images/skills'] {
  width: 38px !important;
  height: 38px !important;
  object-fit: contain;
  filter: drop-shadow(0 0 7px rgba(116,210,255,.28));
}

.Content .aguionOTCharactersPage #ReadableEquips .parent-container > table:nth-of-type(2) .Table5 strong {
  display: block;
  color: var(--lc-gold) !important;
  font-size: 12px;
  text-shadow: 0 0 7px rgba(116, 209, 255, .26);
}

.Content .aguionOTCharactersPage #ReadableEquips .parent-container > table:nth-of-type(2) table:not(.Table5) td[width='200'],
.Content .aguionOTCharactersPage #ReadableEquips .parent-container > table:nth-of-type(2) table:not(.Table5) td[width='405'] {
  width: auto !important;
}

.Content .aguionOTCharactersPage #ReadableEquips .parent-container > table:nth-of-type(2) table:not(.Table5) tr {
  display: grid;
  grid-template-columns: minmax(145px, 32%) minmax(0, 1fr);
}

.Content .aguionOTCharactersPage #ReadableEquips .parent-container > table:nth-of-type(2) table:not(.Table5) td {
  display: block;
  width: 100% !important;
  min-width: 0 !important;
  padding: 9px 11px !important;
  overflow: hidden;
  text-overflow: ellipsis;
}

.Content .aguionOTCharactersPage #ReadableEquips .parent-container > table:nth-of-type(2) table:not(.Table5) td:first-child {
  color: var(--lc-gold) !important;
  font-weight: 900 !important;
  background: linear-gradient(90deg, rgba(24, 50, 105, .78), rgba(12, 27, 66, .72)) !important;
}

.Content .aguionOTCharactersPage #ReadableEquips .parent-container > table:nth-of-type(2) table:not(.Table5) td:last-child {
  color: #f1f7ff !important;
  white-space: normal;
  overflow-wrap: anywhere;
}

.Content .aguionOTCharactersPage #ReadableEquips div[style*='background: red'],
.Content .aguionOTCharactersPage #ReadableEquips div[style*='background:red'] {
  height: 5px !important;
  border-radius: 999px;
  background: linear-gradient(90deg, #ff4778, #ff174d) !important;
  box-shadow: 0 0 8px rgba(255, 55, 96, .38);
}

.Content .aguionOTCharactersPage #ReadableEquips div[style*='background: blue'],
.Content .aguionOTCharactersPage #ReadableEquips div[style*='background:blue'] {
  height: 5px !important;
  border-radius: 999px;
  background: linear-gradient(90deg, #36b7ff, #5b45ff) !important;
  box-shadow: 0 0 8px rgba(80, 157, 255, .38);
}

.Content .aguionOTCharactersPage #ReadableEquips div[style*='height: 3px'][style*='border'] {
  height: 5px !important;
  margin-top: 4px;
  overflow: hidden;
  border: 0 !important;
  border-radius: 999px;
  background: rgba(2, 7, 22, .72) !important;
}

.Content .aguionOTCharactersPage #ReadableEquips + tr .TableContent,
.Content .aguionOTCharactersPage #ReadableEquips + tr .TableContent td[colspan='2'] {
  border: 0 !important;
  background: transparent !important;
}

.Content .aguionOTCharactersPage #ReadableEquips + tr .TableContent td[colspan='2'] > center {
  display: block;
  padding: 22px 16px !important;
  border: 1px solid rgba(126, 195, 255, .34);
  border-radius: 16px;
  background:
    radial-gradient(circle at 50% 0%, rgba(139, 92, 246, .16), transparent 34%),
    linear-gradient(180deg, rgba(13, 31, 74, .86), rgba(5, 14, 39, .96)) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.035), 0 6px 16px rgba(0,0,0,.24);
}

.Content .aguionOTCharactersPage #ReadableEquips + tr .left-side {
  max-width: 100% !important;
  min-width: 0 !important;
  display: grid;
  justify-items: center;
  gap: 8px;
}

.Content .aguionOTCharactersPage #ReadableEquips + tr .left-side::before {
  content: 'GUILDA';
  color: var(--lc-gold);
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: 1px;
  text-shadow: 0 0 8px rgba(116, 209, 255, .36);
}

.Content .aguionOTCharactersPage #ReadableEquips + tr .left-side img {
  width: 72px !important;
  height: 72px !important;
  object-fit: contain;
  filter: drop-shadow(0 0 10px rgba(116, 210, 255, .28));
}

.Content .aguionOTCharactersPage #ReadableEquips + tr .left-side small {
  color: var(--lc-muted) !important;
  font-size: 12px;
}

@media (max-width: 900px) {
  .Content .aguionOTCharactersPage .parent-container {
    grid-template-columns: 1fr;
  }
  .Content .aguionOTCharactersPage .parent-container > table:first-child,
  .Content .aguionOTCharactersPage .parent-container > table:nth-of-type(2) {
    grid-column: 1;
  }
  .Content .aguionOTCharactersPage #ReadableEquips .parent-container > table:nth-of-type(2) .Table5 {
    min-width: 560px !important;
  }
  .Content .aguionOTCharactersPage #ReadableEquips .parent-container > table:nth-of-type(2) .TableContentContainer:first-child {
    overflow-x: auto;
  }
}
/* === aguionOT CHARACTER PROFILE DETAIL FIX END === */

/* === aguionOT CASTS CONTENT REFRESH START === */
.Content .aguionOTCastsPage .cast-hero-panel {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 260px;
  gap: 16px;
  align-items: stretch;
  margin: 0 0 16px;
  padding: 20px;
  overflow: hidden;
  border: 1px solid rgba(184, 226, 255, .52);
  border-radius: 18px;
  background:
    radial-gradient(circle at 12% 10%, rgba(139, 92, 246, .24), transparent 34%),
    radial-gradient(circle at 88% 16%, rgba(69, 190, 255, .18), transparent 34%),
    linear-gradient(135deg, rgba(9, 21, 55, .96), rgba(17, 45, 102, .90) 52%, rgba(28, 18, 76, .94));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.055), 0 10px 24px rgba(0,0,0,.34), 0 0 20px rgba(74,185,255,.12);
}

.Content .aguionOTCastsPage .cast-hero-panel::after {
  content: '';
  position: absolute;
  left: 20px;
  right: 20px;
  bottom: 16px;
  height: 1px;
  background: linear-gradient(90deg, rgba(126,222,255,.72), rgba(158,107,255,.52), transparent);
  box-shadow: 0 0 12px rgba(94,202,255,.38);
}

.Content .aguionOTCastsPage .cast-kicker,
.Content .aguionOTCastsPage .cast-login-badge {
  display: inline-flex;
  width: fit-content;
  margin-bottom: 8px;
  padding: 4px 10px;
  border: 1px solid rgba(151, 226, 255, .38);
  border-radius: 999px;
  background: rgba(5, 14, 39, .56);
  color: var(--lc-cyan);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.Content .aguionOTCastsPage .cast-hero-copy h2 {
  margin: 0 0 9px;
  color: var(--lc-gold);
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 27px;
  font-weight: 900;
  letter-spacing: .4px;
  text-shadow: 0 1px 0 #020714, 0 0 12px rgba(116,209,255,.45);
}

.Content .aguionOTCastsPage .cast-hero-copy p,
.Content .aguionOTCastsPage .cast-login-card p {
  margin: 0;
  color: #dce9ff !important;
}

.Content .aguionOTCastsPage .cast-login-card {
  position: relative;
  z-index: 1;
  padding: 15px;
  border: 1px solid rgba(255, 226, 128, .28);
  border-radius: 14px;
  background:
    radial-gradient(circle at 100% 0%, rgba(255, 226, 128, .12), transparent 36%),
    linear-gradient(180deg, rgba(12, 29, 70, .84), rgba(5, 14, 39, .94));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.035), 0 0 14px rgba(255,226,128,.08);
}

.Content .aguionOTCastsPage .cast-login-card strong {
  display: block;
  margin-bottom: 7px;
  color: var(--lc-gold) !important;
  font-size: 14px;
}

.Content .aguionOTCastsPage .cast-path-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 0 0 16px;
}

.Content .aguionOTCastsPage .cast-path-card,
.Content .aguionOTCastsPage .caster-console-section,
.Content .aguionOTCastsPage .cast-perk {
  border: 1px solid rgba(126, 195, 255, .34);
  border-radius: 15px;
  background:
    radial-gradient(circle at 96% 0%, rgba(139, 92, 246, .13), transparent 34%),
    linear-gradient(180deg, rgba(13, 31, 74, .92), rgba(5, 14, 39, .98));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.04), 0 6px 16px rgba(0,0,0,.30);
}

.Content .aguionOTCastsPage .cast-path-card {
  padding: 14px;
}

.Content .aguionOTCastsPage .cast-path-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 26px;
  margin-bottom: 10px;
  border: 1px solid rgba(143, 221, 255, .48);
  border-radius: 9px;
  background: linear-gradient(180deg, rgba(31,91,165,.86), rgba(10,26,64,.92));
  color: var(--lc-cyan);
  font-weight: 900;
  font-size: 11px;
}

.Content .aguionOTCastsPage .cast-path-card h3 {
  margin: 0 0 7px !important;
  font-size: 15px !important;
}

.Content .aguionOTCastsPage .caster-console-section {
  margin: 0 0 16px;
  padding: 16px;
}

.Content .aguionOTCastsPage .caster-console-header {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 6px 11px;
  align-items: center;
  margin-bottom: 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(123,205,255,.26);
}

.Content .aguionOTCastsPage .caster-console-icon {
  grid-row: span 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border: 1px solid rgba(156,226,255,.46);
  border-radius: 12px;
  background: radial-gradient(circle, rgba(128,86,242,.34), rgba(12,31,75,.88));
  color: var(--lc-gold);
  font-size: 18px;
}

.Content .aguionOTCastsPage .caster-console-header h3 {
  margin: 0 !important;
}

.Content .aguionOTCastsPage .caster-console-header p {
  margin: 0;
  color: var(--lc-muted) !important;
  font-size: 12px;
}

.Content .aguionOTCastsPage .cast-perks-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 0 0 18px;
}

.Content .aguionOTCastsPage .cast-perk {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 5px 10px;
  padding: 13px;
}

.Content .aguionOTCastsPage .cast-perk span {
  grid-row: span 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border: 1px solid rgba(151,226,255,.44);
  border-radius: 10px;
  background: radial-gradient(circle, rgba(128,86,242,.30), rgba(12,31,75,.86));
  color: var(--lc-gold);
  font-weight: 900;
}

.Content .aguionOTCastsPage .cast-perk strong {
  color: var(--lc-gold) !important;
  font-weight: 900;
}

.Content .aguionOTCastsPage .cast-perk small {
  color: var(--lc-muted) !important;
}

@media (max-width: 820px) {
  .Content .aguionOTCastsPage .cast-hero-panel,
  .Content .aguionOTCastsPage .cast-path-grid,
  .Content .aguionOTCastsPage .cast-perks-row {
    grid-template-columns: 1fr;
  }
}
/* === aguionOT CASTS CONTENT REFRESH END === */

/* === aguionOT CHARACTER PROFILE PROPORTION PASS START === */
.Content .aguionOTCharactersPage #ReadableEquips > td {
  padding: 14px 16px 10px !important;
  overflow: hidden;
}

.Content .aguionOTCharactersPage #ReadableEquips .parent-container {
  display: grid !important;
  grid-template-columns: 250px minmax(0, 1fr) !important;
  gap: 16px !important;
  align-items: start !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

.Content .aguionOTCharactersPage #ReadableEquips .parent-container > table:first-child {
  width: 250px !important;
  min-width: 0 !important;
  margin: 0 !important;
}

.Content .aguionOTCharactersPage #ReadableEquips .equipped-items {
  width: 100% !important;
  max-width: 250px !important;
  margin: 0 !important;
  padding: 12px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(144, 210, 255, .42) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(139, 92, 246, .18), transparent 38%),
    linear-gradient(180deg, rgba(11, 30, 76, .92), rgba(4, 12, 36, .98)) !important;
}

.Content .aguionOTCharactersPage #ReadableEquips .equipped-items::before {
  content: 'Inventário';
  display: block;
  margin: 0 0 10px;
  color: var(--lc-gold);
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 14px;
  font-weight: 900;
  letter-spacing: .5px;
  text-align: center;
  text-shadow: 0 0 8px rgba(116, 209, 255, .35);
}

.Content .aguionOTCharactersPage #ReadableEquips .equipped-items table {
  width: 100% !important;
  max-width: 100% !important;
  table-layout: fixed !important;
  border: 0 !important;
  background: transparent !important;
}

.Content .aguionOTCharactersPage #ReadableEquips .equipped-items td {
  width: 33.333% !important;
  height: 56px !important;
  padding: 5px !important;
  border: 1px solid rgba(126, 195, 255, .16) !important;
  background:
    radial-gradient(circle at 50% 35%, rgba(147, 114, 255, .18), rgba(10, 22, 57, .82) 58%, rgba(3, 9, 27, .96)) !important;
  color: #f2f7ff !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  vertical-align: middle !important;
  box-sizing: border-box !important;
}

.Content .aguionOTCharactersPage #ReadableEquips .equipped-items img {
  width: 50px !important;
  max-width: 42px !important;
  height: auto !important;
  filter: drop-shadow(0 0 8px rgba(116, 209, 255, .25));
}

.Content .aguionOTCharactersPage #ReadableEquips .character-right-panels {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
  min-width: 0;
}

.Content .aguionOTCharactersPage #ReadableEquips .character-panel {
  min-width: 0;
  padding: 14px;
  border: 1px solid rgba(126, 195, 255, .36);
  border-radius: 15px;
  background:
    radial-gradient(circle at 100% 0%, rgba(139, 92, 246, .15), transparent 34%),
    linear-gradient(180deg, rgba(13, 31, 74, .92), rgba(5, 14, 39, .98));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.04), 0 6px 16px rgba(0,0,0,.28);
}

.Content .aguionOTCharactersPage #ReadableEquips .character-panel-title {
  margin-bottom: 11px;
  color: var(--lc-gold);
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 14px;
  font-weight: 900;
  letter-spacing: .55px;
  text-shadow: 0 0 9px rgba(116, 209, 255, .35);
}

.Content .aguionOTCharactersPage #ReadableEquips .character-skills-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(72px, 1fr));
  gap: 8px;
}

.Content .aguionOTCharactersPage #ReadableEquips .character-skill-card {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  grid-template-areas:
    "icon label"
    "icon value";
  align-items: center;
  min-height: 46px;
  padding: 7px 8px;
  border: 1px solid rgba(126, 195, 255, .28);
  border-radius: 10px;
  background: linear-gradient(135deg, rgba(20, 52, 108, .76), rgba(16, 22, 66, .88));
  color: #e9f4ff !important;
  text-decoration: none !important;
  box-sizing: border-box;
}

.Content .aguionOTCharactersPage #ReadableEquips .character-skill-card:hover {
  border-color: rgba(255, 226, 128, .55);
  box-shadow: 0 0 12px rgba(116, 209, 255, .18);
}

.Content .aguionOTCharactersPage #ReadableEquips .character-skill-card img {
  grid-area: icon;
  width: 26px !important;
  height: 26px !important;
  object-fit: contain;
}

.Content .aguionOTCharactersPage #ReadableEquips .character-skill-card span {
  grid-area: label;
  color: #9fdfff;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .35px;
  text-transform: uppercase;
}

.Content .aguionOTCharactersPage #ReadableEquips .character-skill-card strong {
  grid-area: value;
  color: #fff6bf;
  font-size: 15px;
  line-height: 1;
}

.Content .aguionOTCharactersPage #ReadableEquips .character-vitals-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.Content .aguionOTCharactersPage #ReadableEquips .character-vital-card {
  min-width: 0;
  padding: 10px;
  overflow: hidden;
  border: 1px solid rgba(126, 195, 255, .24);
  border-radius: 10px;
  background: rgba(7, 18, 48, .66);
  box-sizing: border-box;
}

.Content .aguionOTCharactersPage #ReadableEquips .character-vital-wide {
  grid-column: span 2;
}

.Content .aguionOTCharactersPage #ReadableEquips .character-vital-card span {
  display: block;
  margin-bottom: 5px;
  color: var(--lc-gold);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .35px;
  text-transform: uppercase;
}

.Content .aguionOTCharactersPage #ReadableEquips .character-vital-card strong {
  display: block;
  min-width: 0;
  overflow: hidden;
  color: #f3f8ff;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.Content .aguionOTCharactersPage #ReadableEquips .character-vital-card i {
  display: block;
  height: 6px;
  margin-top: 7px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(1, 5, 20, .78);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.08);
}

.Content .aguionOTCharactersPage #ReadableEquips .character-vital-card i em {
  display: block;
  height: 100%;
  border-radius: inherit;
}

.Content .aguionOTCharactersPage #ReadableEquips .vital-health i em {
  background: linear-gradient(90deg, #ff315f, #ff8ba6);
  box-shadow: 0 0 10px rgba(255, 49, 95, .38);
}

.Content .aguionOTCharactersPage #ReadableEquips .vital-mana i em {
  background: linear-gradient(90deg, #36b7ff, #7557ff);
  box-shadow: 0 0 10px rgba(54, 183, 255, .38);
}

.Content .aguionOTCharactersPage #ReadableEquips + tr .TableContent td[colspan='2'] > center {
  min-height: 0 !important;
  padding: 14px 16px !important;
}

.Content .aguionOTCharactersPage #ReadableEquips + tr .left-side {
  display: grid !important;
  grid-template-columns: 78px minmax(0, 1fr) !important;
  grid-template-areas:
    "badge title"
    "badge rank"
    "badge button" !important;
  align-items: center !important;
  justify-items: start !important;
  max-width: 420px !important;
  margin: 0 auto !important;
  text-align: left !important;
  gap: 2px 14px !important;
}

.Content .aguionOTCharactersPage #ReadableEquips + tr .left-side::before {
  grid-area: title;
  content: 'Aliança';
  font-size: 15px;
}

.Content .aguionOTCharactersPage #ReadableEquips + tr .left-side img {
  grid-area: badge;
  width: 70px !important;
  height: 70px !important;
}

.Content .aguionOTCharactersPage #ReadableEquips + tr .left-side small {
  grid-area: rank;
  margin: 0 0 5px;
}

.Content .aguionOTCharactersPage #ReadableEquips + tr .left-side a {
  grid-area: button;
}

@media (max-width: 760px) {
  .Content .aguionOTCharactersPage #ReadableEquips .parent-container {
    grid-template-columns: 1fr !important;
  }
  .Content .aguionOTCharactersPage #ReadableEquips .parent-container > table:first-child,
  .Content .aguionOTCharactersPage #ReadableEquips .equipped-items {
    width: 100% !important;
    max-width: 100% !important;
  }
  .Content .aguionOTCharactersPage #ReadableEquips .character-vitals-grid {
    grid-template-columns: 1fr;
  }
  .Content .aguionOTCharactersPage #ReadableEquips .character-vital-wide {
    grid-column: auto;
  }
}
/* === aguionOT CHARACTER PROFILE PROPORTION PASS END === */

/* === aguionOT GUILDS REFORGE START === */
.Content .aguionOTGuildsPage {
  color: #edf6ff;
}

.Content .aguionOTGuildsPage .guild-forge-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 220px;
  gap: 16px;
  align-items: center;
  margin: 0 0 16px;
  padding: 20px;
  overflow: hidden;
  border: 1px solid rgba(184, 226, 255, .48);
  border-radius: 18px;
  background:
    radial-gradient(circle at 10% 12%, rgba(145, 82, 255, .24), transparent 34%),
    radial-gradient(circle at 86% 24%, rgba(60, 188, 255, .18), transparent 34%),
    linear-gradient(135deg, rgba(8, 20, 55, .97), rgba(18, 45, 104, .90) 52%, rgba(31, 18, 79, .94));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.055), 0 10px 24px rgba(0,0,0,.34), 0 0 22px rgba(74,185,255,.12);
}

.Content .aguionOTGuildsPage .guild-forge-hero::before {
  content: '';
  position: absolute;
  inset: 10px;
  pointer-events: none;
  border-radius: 14px;
  border: 1px solid rgba(126, 222, 255, .22);
}

.Content .aguionOTGuildsPage .guild-forge-kicker {
  display: inline-flex;
  width: fit-content;
  margin-bottom: 8px;
  padding: 4px 10px;
  border: 1px solid rgba(151, 226, 255, .38);
  border-radius: 999px;
  background: rgba(5, 14, 39, .58);
  color: var(--lc-cyan);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.Content .aguionOTGuildsPage .guild-forge-copy h2 {
  margin: 0 0 8px;
  color: var(--lc-gold);
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 27px;
  font-weight: 900;
  letter-spacing: .35px;
  text-shadow: 0 1px 0 #020714, 0 0 12px rgba(116,209,255,.45);
}

.Content .aguionOTGuildsPage .guild-forge-copy p {
  max-width: 620px;
  margin: 0;
  color: #dce9ff !important;
  font-size: 13px;
  line-height: 1.45;
}

.Content .aguionOTGuildsPage .guild-forge-actions {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 8px;
}

.Content .aguionOTGuildsPage .guild-forge-actions a {
  display: block;
  padding: 9px 12px;
  border: 1px solid rgba(126, 195, 255, .38);
  border-radius: 10px;
  background: linear-gradient(180deg, rgba(37, 87, 164, .88), rgba(20, 42, 105, .92));
  color: #ffffff !important;
  font-weight: 900;
  text-align: center;
  text-decoration: none !important;
  text-shadow: 0 1px 0 #00162e;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 0 12px rgba(74,185,255,.12);
}

.Content .aguionOTGuildsPage .guild-forge-actions a:hover {
  border-color: rgba(255, 226, 128, .65);
  color: var(--lc-gold) !important;
}

.Content .aguionOTGuildsPage > p,
.Content .aguionOTGuildsPage .TableContent p {
  color: #eaf4ff !important;
  line-height: 1.45;
}

.Content .aguionOTGuildsPage a {
  color: #7edfff;
}

.Content .aguionOTGuildsPage .TableContainer {
  margin: 14px 0 18px;
  border: 1px solid rgba(126, 195, 255, .34);
  border-radius: 17px;
  overflow: hidden;
  background:
    radial-gradient(circle at 100% 0%, rgba(139, 92, 246, .12), transparent 34%),
    linear-gradient(180deg, rgba(10, 28, 72, .92), rgba(3, 10, 31, .98));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.035), 0 8px 20px rgba(0,0,0,.28);
}

.Content .aguionOTGuildsPage .CaptionContainer,
.Content .aguionOTGuildsPage .CaptionInnerContainer {
  background: transparent !important;
}

.Content .aguionOTGuildsPage .CaptionContainer span {
  opacity: .45;
}

.Content .aguionOTGuildsPage .CaptionInnerContainer .Text {
  padding: 10px 16px !important;
  background:
    linear-gradient(90deg, rgba(17, 61, 127, .92), rgba(53, 35, 133, .78), rgba(8, 20, 55, .92)) !important;
  color: #fff4b5 !important;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 16px !important;
  font-weight: 900 !important;
  letter-spacing: .35px;
  text-shadow: 0 1px 0 #020714, 0 0 10px rgba(116, 209, 255, .38);
}

.Content .aguionOTGuildsPage .Table3,
.Content .aguionOTGuildsPage .Table5,
.Content .aguionOTGuildsPage .InnerTableContainer,
.Content .aguionOTGuildsPage .TableContentContainer,
.Content .aguionOTGuildsPage .TableContent {
  border-color: rgba(126, 195, 255, .24) !important;
  background: transparent !important;
}

.Content .aguionOTGuildsPage .TableContent {
  color: #edf6ff !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

.Content .aguionOTGuildsPage .TableContent tr {
  background: rgba(11, 28, 68, .72) !important;
}

.Content .aguionOTGuildsPage .TableContent tr:nth-child(even) {
  background: rgba(18, 40, 88, .70) !important;
}

.Content .aguionOTGuildsPage .TableContent td,
.Content .aguionOTGuildsPage .TableContent th,
.Content .aguionOTGuildsPage .LabelV200,
.Content .aguionOTGuildsPage .LabelV175 {
  border-color: rgba(126, 195, 255, .18) !important;
  color: #edf6ff !important;
  background: transparent !important;
}

.Content .aguionOTGuildsPage .LabelV200,
.Content .aguionOTGuildsPage .LabelV175,
.Content .aguionOTGuildsPage .TableContent b {
  color: var(--lc-gold) !important;
  text-shadow: 0 0 8px rgba(116, 209, 255, .24);
}

.Content .aguionOTGuildsPage select,
.Content .aguionOTGuildsPage input[type='text'],
.Content .aguionOTGuildsPage input[type='password'],
.Content .aguionOTGuildsPage textarea {
  min-height: 34px;
  border: 1px solid rgba(126, 195, 255, .45) !important;
  border-radius: 9px;
  background: rgba(5, 14, 39, .88) !important;
  color: #f3f8ff !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.04), 0 0 10px rgba(74,185,255,.08);
}

.Content .aguionOTGuildsPage textarea {
  min-height: 110px;
  padding: 9px;
}

.Content .aguionOTGuildsPage .PageNavigation {
  padding: 9px 12px !important;
  color: #dce9ff !important;
  background: rgba(3, 10, 31, .50) !important;
}

.Content .aguionOTGuildsPage .PageLink a,
.Content .aguionOTGuildsPage .CurrentPageLink {
  display: inline-flex;
  min-width: 22px;
  height: 22px;
  align-items: center;
  justify-content: center;
  margin: 0 2px;
  border-radius: 7px;
  border: 1px solid rgba(126, 195, 255, .28);
  background: rgba(15, 43, 100, .72);
  color: #ffffff !important;
  text-decoration: none !important;
}

.Content .aguionOTGuildsPage .CurrentPageLink {
  border-color: rgba(255, 226, 128, .62);
  color: var(--lc-gold) !important;
}

.Content .aguionOTGuildsPage .guild-list-row td {
  padding: 13px 12px !important;
  vertical-align: middle;
}

.Content .aguionOTGuildsPage .guild-list-row td:first-child {
  width: 82px !important;
  text-align: center;
}

.Content .aguionOTGuildsPage .guild-list-row img {
  border-radius: 10px;
  background: rgba(5, 14, 39, .62);
  box-shadow: 0 0 14px rgba(116, 209, 255, .20);
}

.Content .aguionOTGuildsPage .guild-list-name {
  display: inline-block;
  margin-bottom: 5px;
  color: #fff6bf !important;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 16px;
}

.Content .aguionOTGuildsPage .BigButton,
.Content .aguionOTGuildsPage .BigButtonRed {
  filter: drop-shadow(0 0 8px rgba(74, 185, 255, .16));
}

.Content .aguionOTGuildsPage .BigButtonText,
.Content .aguionOTGuildsPage button.BigButtonText,
.Content .aguionOTGuildsPage input.BigButtonText {
  color: #ffffff !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 0 #00162e !important;
}

@media (max-width: 760px) {
  .Content .aguionOTGuildsPage .guild-forge-hero {
    grid-template-columns: 1fr;
  }
  .Content .aguionOTGuildsPage .guild-list-row td {
    display: block;
    width: 100% !important;
    text-align: left !important;
  }
}
/* === aguionOT GUILDS REFORGE END === */

/* === aguionOT WAR + RANKING + DEATHS REFORGE START === */
.Content .aguionOTGuildwarsPage,
.Content .aguionOTHighscoresPage,
.Content .aguionOTLastDeathsPage {
  color: #edf6ff;
}

.Content .aguionOTGuildwarsPage .war-chronicle-hero,
.Content .aguionOTLastDeathsPage .death-board-hero,
.Content .aguionOTHighscoresPage .highscores-header {
  position: relative;
  margin: 0 0 16px !important;
  padding: 21px !important;
  overflow: hidden;
  border: 1px solid rgba(184, 226, 255, .50) !important;
  border-radius: 18px !important;
  background:
    radial-gradient(circle at 12% 8%, rgba(145, 82, 255, .24), transparent 34%),
    radial-gradient(circle at 86% 22%, rgba(60, 188, 255, .18), transparent 34%),
    linear-gradient(135deg, rgba(8, 20, 55, .97), rgba(18, 45, 104, .90) 52%, rgba(31, 18, 79, .94)) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.055), 0 10px 24px rgba(0,0,0,.34), 0 0 22px rgba(74,185,255,.12) !important;
  text-align: left !important;
}

.Content .aguionOTGuildwarsPage .war-chronicle-hero::before,
.Content .aguionOTLastDeathsPage .death-board-hero::before,
.Content .aguionOTHighscoresPage .highscores-header::before {
  content: '';
  position: absolute;
  inset: 10px;
  pointer-events: none;
  border: 1px solid rgba(126, 222, 255, .22);
  border-radius: 14px;
}

.Content .aguionOTGuildwarsPage .war-kicker,
.Content .aguionOTLastDeathsPage .death-kicker,
.Content .aguionOTHighscoresPage .ranking-kicker {
  display: inline-flex;
  width: fit-content;
  margin-bottom: 8px;
  padding: 4px 10px;
  border: 1px solid rgba(151, 226, 255, .38);
  border-radius: 999px;
  background: rgba(5, 14, 39, .58);
  color: var(--lc-cyan);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.Content .aguionOTGuildwarsPage .war-chronicle-hero h2,
.Content .aguionOTLastDeathsPage .death-board-hero h2,
.Content .aguionOTHighscoresPage .highscores-header h1 {
  margin: 0 0 8px !important;
  color: var(--lc-gold) !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: 28px !important;
  font-weight: 900 !important;
  letter-spacing: .35px;
  text-shadow: 0 1px 0 #020714, 0 0 12px rgba(116,209,255,.45) !important;
}

.Content .aguionOTGuildwarsPage .war-chronicle-hero p,
.Content .aguionOTLastDeathsPage .death-board-hero p,
.Content .aguionOTHighscoresPage .highscores-header p {
  max-width: 720px;
  margin: 0 !important;
  color: #dce9ff !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
}

.Content .aguionOTGuildwarsPage .war-quicklinks {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}

.Content .aguionOTGuildwarsPage .war-quicklinks a {
  padding: 8px 12px;
  border: 1px solid rgba(126, 195, 255, .38);
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(37, 87, 164, .84), rgba(20, 42, 105, .92));
  color: #ffffff !important;
  font-weight: 900;
  text-decoration: none !important;
  text-shadow: 0 1px 0 #00162e;
}

.Content .aguionOTGuildwarsPage .TableContainer,
.Content .aguionOTLastDeathsPage .TableContainer,
.Content .aguionOTHighscoresPage .TableContainer {
  margin: 14px 0 18px !important;
  overflow: hidden !important;
  border: 1px solid rgba(126, 195, 255, .34) !important;
  border-radius: 17px !important;
  background:
    radial-gradient(circle at 100% 0%, rgba(139, 92, 246, .12), transparent 34%),
    linear-gradient(180deg, rgba(10, 28, 72, .92), rgba(3, 10, 31, .98)) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.035), 0 8px 20px rgba(0,0,0,.28) !important;
}

.Content .aguionOTGuildwarsPage .CaptionContainer,
.Content .aguionOTGuildwarsPage .CaptionInnerContainer,
.Content .aguionOTLastDeathsPage .CaptionContainer,
.Content .aguionOTLastDeathsPage .CaptionInnerContainer,
.Content .aguionOTHighscoresPage .CaptionContainer,
.Content .aguionOTHighscoresPage .CaptionInnerContainer {
  background: transparent !important;
}

.Content .aguionOTGuildwarsPage .CaptionContainer span,
.Content .aguionOTLastDeathsPage .CaptionContainer span,
.Content .aguionOTHighscoresPage .CaptionContainer span {
  opacity: .42;
}

.Content .aguionOTGuildwarsPage .CaptionInnerContainer .Text,
.Content .aguionOTLastDeathsPage .CaptionInnerContainer .Text,
.Content .aguionOTHighscoresPage .CaptionInnerContainer .Text {
  padding: 10px 16px !important;
  background: linear-gradient(90deg, rgba(17, 61, 127, .94), rgba(53, 35, 133, .78), rgba(8, 20, 55, .92)) !important;
  color: #fff4b5 !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: 16px !important;
  font-weight: 900 !important;
  letter-spacing: .35px;
  text-shadow: 0 1px 0 #020714, 0 0 10px rgba(116, 209, 255, .38) !important;
}

.Content .aguionOTGuildwarsPage .Table3,
.Content .aguionOTGuildwarsPage .Table5,
.Content .aguionOTGuildwarsPage .InnerTableContainer,
.Content .aguionOTGuildwarsPage .TableContentContainer,
.Content .aguionOTGuildwarsPage .TableContent,
.Content .aguionOTLastDeathsPage .Table3,
.Content .aguionOTLastDeathsPage .Table5,
.Content .aguionOTLastDeathsPage .InnerTableContainer,
.Content .aguionOTLastDeathsPage .TableContentContainer,
.Content .aguionOTLastDeathsPage .TableContent,
.Content .aguionOTHighscoresPage .Table3,
.Content .aguionOTHighscoresPage .Table5,
.Content .aguionOTHighscoresPage .InnerTableContainer,
.Content .aguionOTHighscoresPage .TableContentContainer,
.Content .aguionOTHighscoresPage .TableContent {
  border-color: rgba(126, 195, 255, .22) !important;
  background: transparent !important;
}

.Content .aguionOTGuildwarsPage .TableContent tr,
.Content .aguionOTLastDeathsPage .TableContent tr {
  background: rgba(11, 28, 68, .72) !important;
}

.Content .aguionOTGuildwarsPage .TableContent tr:nth-child(even),
.Content .aguionOTLastDeathsPage .TableContent tr:nth-child(even) {
  background: rgba(18, 40, 88, .70) !important;
}

.Content .aguionOTGuildwarsPage .TableContent td,
.Content .aguionOTGuildwarsPage .TableContent th,
.Content .aguionOTLastDeathsPage .TableContent td,
.Content .aguionOTLastDeathsPage .TableContent th,
.Content .aguionOTHighscoresPage .TableContent td,
.Content .aguionOTHighscoresPage .TableContent th {
  border-color: rgba(126, 195, 255, .18) !important;
  color: #edf6ff !important;
}

.Content .aguionOTGuildwarsPage .TableContent b,
.Content .aguionOTLastDeathsPage .TableContent b {
  color: var(--lc-gold) !important;
}

.Content .aguionOTGuildwarsPage input,
.Content .aguionOTGuildwarsPage select,
.Content .aguionOTGuildwarsPage textarea,
.Content .aguionOTLastDeathsPage input,
.Content .aguionOTLastDeathsPage select,
.Content .aguionOTLastDeathsPage textarea,
.Content .aguionOTHighscoresPage input,
.Content .aguionOTHighscoresPage select,
.Content .aguionOTHighscoresPage textarea {
  border: 1px solid rgba(126, 195, 255, .45) !important;
  border-radius: 9px !important;
  background: rgba(5, 14, 39, .88) !important;
  color: #f3f8ff !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.04), 0 0 10px rgba(74,185,255,.08) !important;
}

.Content .aguionOTHighscoresPage .highscores-container {
  max-width: 100% !important;
  padding: 0 !important;
}

.Content .aguionOTHighscoresPage .highscores-stats {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
  margin: 0 0 16px !important;
}

.Content .aguionOTHighscoresPage .stat-card {
  min-height: 88px !important;
  padding: 14px !important;
  border: 1px solid rgba(126, 195, 255, .34) !important;
  border-left: 0 !important;
  border-radius: 15px !important;
  background:
    radial-gradient(circle at 94% 0%, rgba(139, 92, 246, .14), transparent 34%),
    linear-gradient(180deg, rgba(13, 31, 74, .92), rgba(5, 14, 39, .98)) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.04), 0 6px 16px rgba(0,0,0,.30) !important;
}

.Content .aguionOTHighscoresPage .stat-icon {
  flex: 0 0 44px !important;
  width: 44px !important;
  height: 44px !important;
  border: 1px solid rgba(255, 226, 128, .32) !important;
  background: radial-gradient(circle at 35% 25%, #fff1a9, #c08b1a 46%, #3a265e 100%) !important;
  color: #07112d !important;
  font-size: 20px !important;
  box-shadow: 0 0 14px rgba(255,226,128,.22) !important;
}

.Content .aguionOTHighscoresPage .stat-info h3 {
  color: #9fdfff !important;
  font-size: 10px !important;
  font-weight: 900 !important;
}

.Content .aguionOTHighscoresPage .stat-info p {
  color: #fff4b5 !important;
  font-size: 20px !important;
  font-weight: 900 !important;
  text-shadow: 0 0 8px rgba(116, 209, 255, .20);
}

.Content .aguionOTHighscoresPage .filter-table,
.Content .aguionOTHighscoresPage .highscores-table {
  overflow: hidden !important;
  border: 1px solid rgba(126, 195, 255, .22) !important;
  border-radius: 0 0 15px 15px !important;
  background: rgba(5, 14, 39, .88) !important;
  box-shadow: none !important;
}

.Content .aguionOTHighscoresPage .filter-table td {
  border-color: rgba(126, 195, 255, .14) !important;
  background: transparent !important;
  color: #edf6ff !important;
}

.Content .aguionOTHighscoresPage .filter-table td[style*='color: #1e3c72'] {
  color: var(--lc-gold) !important;
}

.Content .aguionOTHighscoresPage .btn-confirm {
  min-height: 42px !important;
  padding: 9px 12px !important;
  border: 1px solid rgba(255, 226, 128, .42) !important;
  border-radius: 11px !important;
  background: linear-gradient(180deg, rgba(48, 116, 196, .95), rgba(53, 35, 133, .96)) !important;
  color: #ffffff !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 0 #00162e !important;
}

.Content .aguionOTHighscoresPage .info-text,
.Content .aguionOTHighscoresPage .pagination {
  border: 1px solid rgba(126, 195, 255, .28) !important;
  border-radius: 14px !important;
  background: rgba(5, 14, 39, .72) !important;
  color: #dce9ff !important;
}

.Content .aguionOTHighscoresPage .pagination-link {
  border: 1px solid rgba(126, 195, 255, .28) !important;
  border-radius: 8px !important;
  background: rgba(15, 43, 100, .76) !important;
  color: #ffffff !important;
}

.Content .aguionOTHighscoresPage .pagination-link.current {
  border-color: rgba(255, 226, 128, .62) !important;
  color: var(--lc-gold) !important;
}

.Content .aguionOTHighscoresPage .highscores-table th {
  background: linear-gradient(90deg, rgba(17, 61, 127, .94), rgba(53, 35, 133, .84)) !important;
  color: #fff4b5 !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-weight: 900 !important;
}

.Content .aguionOTHighscoresPage .highscores-table tr {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  background: rgba(11, 28, 68, .72) !important;
}

.Content .aguionOTHighscoresPage .highscores-table tr:nth-child(even) {
  background: rgba(18, 40, 88, .70) !important;
}

.Content .aguionOTHighscoresPage .highscores-table tr:hover {
  background: rgba(33, 72, 139, .82) !important;
}

.Content .aguionOTHighscoresPage .highscores-table td {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  padding: 8px 10px !important;
  border-color: rgba(126, 195, 255, .14) !important;
  color: #edf6ff !important;
}

.Content .aguionOTHighscoresPage .highscores-table td:first-child {
  color: var(--lc-gold) !important;
  font-size: 15px !important;
}

.Content .aguionOTHighscoresPage .player-name {
  color: #80e5ff !important;
  font-weight: 900 !important;
  text-decoration: none !important;
}

.Content .aguionOTHighscoresPage .player-details {
  color: #b8c9ee !important;
}

.Content .aguionOTHighscoresPage .world-badge {
  border-color: rgba(126, 195, 255, .28) !important;
  background: rgba(8, 24, 63, .86) !important;
  color: #f1f7ff !important;
}

.Content .aguionOTHighscoresPage .outfit-wrapper {
  border-color: rgba(126, 195, 255, .26) !important;
  background: radial-gradient(circle at 50% 30%, rgba(116,209,255,.14), rgba(4,12,36,.96) 64%) !important;
}

.Content .aguionOTLastDeathsPage .death-board-hero {
  background:
    radial-gradient(circle at 10% 10%, rgba(255, 70, 110, .18), transparent 32%),
    radial-gradient(circle at 88% 12%, rgba(116, 209, 255, .17), transparent 34%),
    linear-gradient(135deg, rgba(9, 20, 55, .97), rgba(46, 25, 83, .92) 52%, rgba(5, 14, 39, .97)) !important;
}

.Content .aguionOTLastDeathsPage .LabelH td {
  color: #fff4b5 !important;
  background: linear-gradient(90deg, rgba(96, 24, 62, .86), rgba(20, 52, 112, .86)) !important;
  font-family: Georgia, 'Times New Roman', serif;
  font-weight: 900;
}

.Content .aguionOTLastDeathsPage .TableContent tr:not(.LabelH):hover td {
  background: rgba(92, 35, 89, .42) !important;
}

.Content .aguionOTLastDeathsPage .TableContent a {
  color: #7edfff !important;
  font-weight: 900;
  text-decoration: none !important;
}

.Content .aguionOTLastDeathsPage .TableContent a:hover {
  color: #fff4b5 !important;
}

.Content .aguionOTLastDeathsPage .PageNavigation {
  background: rgba(3, 10, 31, .56) !important;
}

@media (max-width: 820px) {
  .Content .aguionOTHighscoresPage .highscores-stats {
    grid-template-columns: 1fr !important;
  }
  .Content .aguionOTHighscoresPage .highscores-table {
    display: block;
    overflow-x: auto;
  }
}
/* === aguionOT WAR + RANKING + DEATHS REFORGE END === */

/* === aguionOT GENERATED PAGE TITLE HEADER START === */
.Content .Box > .Border_2 > .Border_3 > .BoxContent::before {
  display: none !important;
}

.HeaderPagesText {
  top: -30px !important;
  left: 36px !important;
  width: auto !important;
  min-width: 0 !important;
  height: 28px !important;
  max-width: calc(100% - 72px) !important;
  padding: 0 18px !important;
  border: 1px solid rgba(126, 222, 255, .42) !important;
  border-radius: 999px !important;
  background:
    radial-gradient(circle at 8% 50%, rgba(139, 92, 246, .28), transparent 34%),
    linear-gradient(90deg, rgba(7, 17, 45, .96), rgba(18, 44, 92, .92) 48%, rgba(34, 24, 78, .90)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, .06),
    inset 0 0 14px rgba(74, 185, 255, .12),
    0 0 12px rgba(74, 185, 255, .16) !important;
  color: #fff3bd !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: 17px !important;
  font-weight: 900 !important;
  line-height: 28px !important;
  letter-spacing: .55px !important;
  text-transform: uppercase;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  transform: translateX(-28px) !important;
  text-shadow:
    0 2px 0 #020714,
    0 0 10px rgba(116, 209, 255, .78),
    -1px -1px 0 rgba(0, 0, 0, .92),
    1px 1px 0 rgba(0, 0, 0, .92) !important;
  z-index: 4 !important;
}

.HeaderPagesText::before,
.HeaderPagesText::after {
  content: '' !important;
  display: inline-block !important;
  width: 9px !important;
  height: 9px !important;
  margin: 0 10px 1px 0 !important;
  transform: rotate(45deg);
  border: 1px solid rgba(205, 183, 255, .88) !important;
  border-radius: 2px !important;
  background: radial-gradient(circle, #f4efff 0%, #8d54ff 42%, #31166d 100%) !important;
  box-shadow: 0 0 8px rgba(144, 92, 255, .62), 0 0 12px rgba(74, 185, 255, .20) !important;
  vertical-align: middle !important;
}

.HeaderPagesText::after {
  margin: 0 0 1px 10px !important;
}

@media (max-width: 760px) {
  .Content .Box > .Border_2 > .Border_3 > .BoxContent::before {
    display: none !important;
  }
  .HeaderPagesText {
    top: -29px !important;
    left: 22px !important;
    width: auto !important;
    max-width: calc(100% - 44px) !important;
    height: 27px !important;
    line-height: 27px !important;
    font-size: 13px !important;
    letter-spacing: .35px !important;
    padding: 0 12px !important;
  }
}
/* === aguionOT GENERATED PAGE TITLE HEADER END === */

/* === aguionOT PAGE TITLE CLEAN INTEGRATION START === */
.Content .Box > .BorderTitleText {
  height: 31px !important;
  overflow: visible !important;
  border-top: 1px solid rgba(126, 222, 255, .24) !important;
  border-bottom: 1px solid rgba(126, 222, 255, .36) !important;
  background:
    radial-gradient(circle at 6% 50%, rgba(139, 92, 246, .18), transparent 18%),
    radial-gradient(circle at 94% 50%, rgba(139, 92, 246, .14), transparent 18%),
    linear-gradient(90deg, rgba(3, 9, 28, .98), rgba(8, 25, 62, .96) 48%, rgba(22, 15, 54, .96), rgba(3, 9, 28, .98)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.045),
    inset 0 -1px 0 rgba(74,185,255,.20),
    0 0 10px rgba(0,0,0,.30) !important;
}

.Content .Box > .BorderTitleText::before,
.Content .Box > .BorderTitleText::after {
  content: '' !important;
  position: absolute;
  top: 50%;
  width: 8px;
  height: 8px;
  transform: translateY(-50%) rotate(45deg);
  border: 1px solid rgba(205, 183, 255, .82);
  border-radius: 2px;
  background: radial-gradient(circle, #f4efff 0%, #8d54ff 42%, #31166d 100%);
  box-shadow: 0 0 8px rgba(144, 92, 255, .58), 0 0 12px rgba(74, 185, 255, .18);
}

.Content .Box > .BorderTitleText::before {
  left: 28px;
}

.Content .Box > .BorderTitleText::after {
  right: 28px;
}

.HeaderPagesText {
  top: -29px !important;
  left: 54px !important;
  height: 27px !important;
  line-height: 27px !important;
  padding: 0 14px !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.HeaderPagesText::before,
.HeaderPagesText::after {
  display: none !important;
}

@media (max-width: 760px) {
  .Content .Box > .BorderTitleText::before {
    left: 18px;
  }
  .Content .Box > .BorderTitleText::after {
    right: 18px;
  }
  .HeaderPagesText {
    top: -28px !important;
    left: 38px !important;
    max-width: calc(100% - 76px) !important;
    height: 26px !important;
    line-height: 26px !important;
    padding: 0 8px !important;
  }
}
/* === aguionOT PAGE TITLE CLEAN INTEGRATION END === */

/* === aguionOT PAGE TITLE IMAGE INTEGRATED START === */
.Content .Box > .BorderTitleText {
  height: 208px !important;
  overflow: visible !important;
  border: 0 !important;
  background: url('../images/ui/page-title-header-integrated-v11.png') center top / 100% auto no-repeat !important;
  box-shadow: none !important;
}

.Content .Box > .BorderTitleText::before,
.Content .Box > .BorderTitleText::after {
  display: none !important;
}

.HeaderPagesText {
  top: 18px !important;
  left: 145px !important;
  right: 76px !important;
  width: auto !important;
  max-width: none !important;
  height: 70px !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #fff3bd !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: 18px !important;
  font-weight: 900 !important;
  line-height: 1.15 !important;
  letter-spacing: .65px !important;
  text-align: center !important;
  text-transform: uppercase;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  transform: translateX(-28px) !important;
  text-shadow:
    0 2px 0 #020714,
    0 0 10px rgba(116, 209, 255, .78),
    -1px -1px 0 rgba(0, 0, 0, .92),
    1px 1px 0 rgba(0, 0, 0, .92) !important;
  z-index: 5 !important;
}

.HeaderPagesText::before,
.HeaderPagesText::after {
  display: none !important;
}

@media (max-width: 760px) {
  .Content .Box > .BorderTitleText {
    height: 162px !important;
    margin-left: 0 !important;
    width: 100% !important;
    background-size: 100% auto !important;
  }
  .HeaderPagesText {
    top: 10px !important;
    left: 108px !important;
    right: 46px !important;
    height: 64px !important;
    line-height: 1.15 !important;
    font-size: 13px !important;
    letter-spacing: .35px !important;
    transform: translateX(-18px) !important;
  }
}
/* === aguionOT PAGE TITLE IMAGE INTEGRATED END === */

/* === aguionOT PAGE TITLE REMOVE OLD BACKING START === */
.Content .Box {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.Content .Box > .Border_1,
.Content .Box > .Corner-tl,
.Content .Box > .Corner-tr {
  display: none !important;
}

.Content .Box > .BorderTitleText {
  margin: 0 0 -1px 0 !important;
  width: 100% !important;
  background-color: transparent !important;
  isolation: isolate;
  z-index: 3;
}

.Content .Box > .Border_2 {
  margin: -94px 0 0 !important;
  position: relative !important;
  z-index: 10 !important;
}

.Content .Box > .Border_2 > .Border_3 {
  border: 0 !important;
  margin-top: 0 !important;
}

/* The original wolf header remains untouched.  This transparent layer is only
   its forged continuation, tucked behind the title and the page panel. */
.Content .Box {
  position: relative !important;
  overflow: visible !important;
}

.Content .Box::after {
  display: none !important;
  content: '' !important;
  position: absolute !important;
  top: 42px !important;
  left: 0 !important;
  width: 100% !important;
  height: 86px !important;
  background: url('../images/ui/page-title-supports.png') center -70px / 118% auto no-repeat !important;
  pointer-events: none !important;
  z-index: 8 !important;
}

.Content .Box > .BorderTitleText {
  position: relative !important;
  z-index: 8 !important;
}

@media (max-width: 760px) {
  .Content .Box > .BorderTitleText {
    margin-left: 0 !important;
    width: 100% !important;
    background-size: 100% auto !important;
  }
  .Content .Box > .Border_2 {
    margin-top: -68px !important;
  }
  .Content .Box::after {
    top: 34px !important;
    height: 68px !important;
    background-position: center -48px !important;
    background-size: 118% auto !important;
  }
}

/* A small hanging chain visually joins the wolf crest to the page panel. */
.Content .Box > .BorderTitleText {
  position: relative !important;
  overflow: visible !important;
}

.Content .Box > .BorderTitleText::before {
  display: none !important;
  position: absolute !important;
  left: 78px !important;
  bottom: -15px !important;
  width: 28px !important;
  height: 29px !important;
  border-left: 2px solid rgba(224, 231, 255, .9) !important;
  border-right: 2px solid rgba(139, 92, 246, .9) !important;
  border-bottom: 2px solid rgba(129, 202, 255, .82) !important;
  border-radius: 0 0 14px 14px !important;
  background:
    radial-gradient(ellipse at 50% 28%, rgba(197, 167, 255, .95) 0 3px, transparent 4px),
    radial-gradient(ellipse at 50% 68%, rgba(109, 196, 255, .85) 0 3px, transparent 4px) !important;
  box-shadow: 0 0 8px rgba(91, 183, 255, .55), inset 0 -3px 5px rgba(95, 43, 177, .35) !important;
  z-index: 7 !important;
  pointer-events: none !important;
}

.Content .Box > .BorderTitleText::after {
  display: none !important;
  position: absolute !important;
  left: 87px !important;
  bottom: -23px !important;
  width: 10px !important;
  height: 10px !important;
  border: 1px solid rgba(236, 229, 255, .95) !important;
  border-radius: 2px !important;
  transform: rotate(45deg) !important;
  background: radial-gradient(circle at 35% 30%, #fff 0 8%, #b07cff 35%, #35116e 78%) !important;
  box-shadow: 0 0 10px rgba(153, 94, 255, .85) !important;
  z-index: 8 !important;
  pointer-events: none !important;
}

@media (max-width: 760px) {
  .Content .Box > .BorderTitleText::before {
    left: 56px !important;
  }
  .Content .Box > .BorderTitleText::after {
    left: 65px !important;
  }
}
/* === aguionOT PAGE TITLE REMOVE OLD BACKING END === */

/* === aguionOT PAGE TITLE BREATHING ROOM FIX START === */
.Content .Box > .BorderTitleText {
  height: 208px !important;
  overflow: visible !important;
  background: none !important;
  z-index: 8 !important;
}

.Content .Box > .BorderTitleText::before {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  top: 0 !important;
  left: 50% !important;
  width: calc(100% + 24px) !important;
  height: 140px !important;
  transform: translateX(-50%) !important;
  background: url('../images/ui/page-title-header-v3.png') center top / 100% auto no-repeat !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

.Content .Box > .BorderTitleText::after {
  display: none !important;
}

.HeaderPagesText {
  z-index: 2 !important;
}

@media (max-width: 760px) {
  .Content .Box > .BorderTitleText {
    height: 162px !important;
  }

  .Content .Box > .BorderTitleText::before {
    width: calc(100% + 16px) !important;
    height: 116px !important;
  }
}
/* === aguionOT PAGE TITLE BREATHING ROOM FIX END === */

/* === aguionOT FULL PAGE FRAME KIT START === */
.Content .Box.PageFrameBox {
  position: relative !important;
  overflow: visible !important;
  isolation: isolate !important;
  padding-bottom: 126px !important;
}

.Content .Box.PageFrameBox > .CornerWrapper-b,
.Content .Box.PageFrameBox > .CornerWrapper-b .Corner-bl,
.Content .Box.PageFrameBox > .CornerWrapper-b .Corner-br {
  display: none !important;
}

.Content .Box.PageFrameBox > .BorderTitleText {
  height: 255px !important;
  margin: 0 0 -1px 0 !important;
  overflow: visible !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
  z-index: 24 !important;
  pointer-events: none !important;
}

.Content .Box.PageFrameBox > .BorderTitleText::before {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  top: 0 !important;
  left: 50% !important;
  width: calc(100% + 120px) !important;
  height: 430px !important;
  transform: translateX(-50%) !important;
  background: url('../images/ui/page-frame-kit/page-frame-top-connected-wide-v2.png') center top / 100% auto no-repeat !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

.Content .Box.PageFrameBox > .BorderTitleText::after {
  display: none !important;
}

.Content .Box.PageFrameBox .HeaderPagesText {
  top: 49px !important;
  left: 134px !important;
  right: 76px !important;
  height: 64px !important;
  transform: translateX(-12px) !important;
  z-index: 4 !important;
}

.Content .Box.PageFrameBox > .Border_2 {
  margin: -96px 0 0 !important;
  position: relative !important;
  z-index: 10 !important;
}

.Content .Box.PageFrameBox > .Border_2 > .Border_3 {
  position: relative !important;
  z-index: 10 !important;
}

.Content .Box.PageFrameBox > .Border_2 > .Border_3 > .BoxContent {
  box-sizing: border-box !important;
  padding: 42px 24px 34px !important;
  isolation: isolate !important;
  z-index: 0 !important;
}

.Content .Box.PageFrameBox > .Border_2 > .Border_3 > .BoxContent::before {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  top: -66px !important;
  right: -6px !important;
  bottom: -96px !important;
  left: -6px !important;
  width: auto !important;
  height: auto !important;
  border: 0 !important;
  border-radius: 0 !important;
  background:
    radial-gradient(circle at 8% 0%, rgba(138, 91, 246, .12), transparent 32%),
    radial-gradient(circle at 94% 12%, rgba(64, 188, 255, .10), transparent 34%),
    linear-gradient(180deg, rgba(8, 18, 48, .96), rgba(4, 10, 30, .98)) !important;
  box-shadow: none !important;
  pointer-events: none !important;
  z-index: -1 !important;
}

.Content .Box.PageFrameBox::before,
.Content .Box.PageFrameBox::after {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  top: 390px !important;
  bottom: 48px !important;
  height: auto !important;
  width: 50px !important;
  background: url('../images/ui/page-frame-kit/page-frame-pillar-mid-v1.png') center top / 100% 100% no-repeat !important;
  pointer-events: none !important;
  z-index: 5 !important;
}

.Content .Box.PageFrameBox::before {
  left: -46px !important;
  right: auto !important;
}

.Content .Box.PageFrameBox::after {
  left: auto !important;
  right: -46px !important;
  transform: scaleX(-1) !important;
}

.Content .Box.PageFrameBox > .Border_2::after {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  left: 50% !important;
  bottom: -122px !important;
  width: calc(100% + 96px) !important;
  height: 151px !important;
  transform: translateX(-50%) !important;
  background: url('../images/ui/page-frame-kit/page-frame-bottom-wide-v2.png') center bottom / 100% auto no-repeat !important;
  pointer-events: none !important;
  z-index: 24 !important;
}

@media (max-width: 760px) {
  .Content .Box.PageFrameBox {
    padding-bottom: 92px !important;
  }

  .Content .Box.PageFrameBox > .BorderTitleText {
    height: 190px !important;
  }

  .Content .Box.PageFrameBox > .BorderTitleText::before {
    width: calc(100% + 70px) !important;
    height: 300px !important;
  }

  .Content .Box.PageFrameBox .HeaderPagesText {
    top: 38px !important;
    left: 106px !important;
    right: 58px !important;
    height: 52px !important;
    transform: translateX(-8px) !important;
  }

  .Content .Box.PageFrameBox > .Border_2 {
    margin-top: -70px !important;
  }

  .Content .Box.PageFrameBox > .Border_2 > .Border_3 > .BoxContent::before {
    top: -46px !important;
    right: -6px !important;
    bottom: -70px !important;
    left: -6px !important;
  }

  .Content .Box.PageFrameBox::before,
  .Content .Box.PageFrameBox::after {
    top: 266px !important;
    bottom: 26px !important;
    width: 32px !important;
  }

  .Content .Box.PageFrameBox::before {
    left: -38px !important;
    right: auto !important;
  }

  .Content .Box.PageFrameBox::after {
    left: auto !important;
    right: -38px !important;
  }

  .Content .Box.PageFrameBox > .Border_2::after {
    bottom: -88px !important;
    width: calc(100% + 62px) !important;
    height: 92px !important;
  }
}
/* === aguionOT FULL PAGE FRAME KIT END === */

/* === aguionOT PAGE FRAME DESKTOP GUTTERS START === */
@media (min-width: 1180px) {
  #ArtworkHelper {
    min-width: 1540px !important;
  }

  #Bodycontainer {
    width: 1540px !important;
    min-width: 1540px !important;
    max-width: 1540px !important;
  }

  #ContentRow {
    max-width: 1540px !important;
  }

  #ContentColumn {
    margin-left: 345px !important;
    margin-right: 345px !important;
  }

  #MenuColumn {
    left: 40px !important;
  }

  #ThemeboxesColumn {
    right: 40px !important;
  }
}
/* === aguionOT PAGE FRAME DESKTOP GUTTERS END === */

/* === aguionOT LATEST NEWS ISOLATED LAYOUT START === */
.LatestNewsPage {
  position: relative;
}

.Content.LatestNewsRoot #NewsTicker,
.Content.LatestNewsRoot #FeaturedArticle {
  position: relative !important;
  box-sizing: border-box !important;
  width: 100% !important;
  margin: 22px 0 28px !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 1px solid rgba(105, 151, 225, .34) !important;
  border-radius: 16px !important;
  background:
    radial-gradient(circle at 8% 0%, rgba(125, 77, 231, .12), transparent 34%),
    linear-gradient(180deg, rgba(8, 18, 48, .97), rgba(4, 10, 30, .99)) !important;
  color: #dfe8ff !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, .025),
    0 12px 28px rgba(1, 4, 18, .48),
    0 0 18px rgba(86, 69, 193, .16) !important;
}

.Content.LatestNewsRoot #NewsTicker::before,
.Content.LatestNewsRoot #NewsTicker::after,
.Content.LatestNewsRoot #FeaturedArticle::before,
.Content.LatestNewsRoot #FeaturedArticle::after {
  display: none !important;
  content: none !important;
}

.Content.LatestNewsRoot #NewsTicker > .HeaderPagesText,
.Content.LatestNewsRoot #FeaturedArticle > .HeaderPagesText {
  position: relative !important;
  inset: auto !important;
  z-index: 6 !important;
  display: flex !important;
  width: 100% !important;
  height: 58px !important;
  box-sizing: border-box !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 0 72px !important;
  transform: none !important;
  background: url("../images/ui/aguionOT-content-title.png") center / 100% 58px no-repeat !important;
  color: #fff2bd !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: .7px !important;
  text-align: center !important;
  text-shadow: 0 2px 2px #02040e, 0 0 9px rgba(113, 207, 255, .45) !important;
  pointer-events: none !important;
  -webkit-user-select: none !important;
  user-select: none !important;
}

.Content.LatestNewsRoot #NewsTicker > .Border_2,
.Content.LatestNewsRoot #NewsTicker > .Border_2 > .Border_3,
.Content.LatestNewsRoot #FeaturedArticle > .Border_2,
.Content.LatestNewsRoot #FeaturedArticle > .Border_2 > .Border_3 {
  position: relative !important;
  z-index: 3 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

.Content.LatestNewsRoot #NewsTicker .BoxContent,
.Content.LatestNewsRoot #FeaturedArticle .BoxContent {
  position: relative !important;
  z-index: 4 !important;
  box-sizing: border-box !important;
  height: auto !important;
  margin: 0 !important;
  border: 0 !important;
  border-top: 1px solid rgba(111, 160, 229, .22) !important;
  border-radius: 0 !important;
  background:
    linear-gradient(180deg, rgba(11, 24, 58, .82), rgba(5, 12, 32, .95)) !important;
  color: #dfe8ff !important;
  box-shadow: inset 0 12px 25px rgba(49, 65, 139, .08) !important;
}

.Content.LatestNewsRoot #NewsTicker .BoxContent {
  min-height: 0 !important;
  padding: 14px 16px 16px !important;
}

.Content.LatestNewsRoot #NewsTicker .BoxContent .Row {
  margin-bottom: 8px !important;
}

.Content.LatestNewsRoot #NewsTicker .BoxContent .Odd,
.Content.LatestNewsRoot #NewsTicker .BoxContent .Even {
  min-height: 38px !important;
  padding: 10px 40px 10px 38px !important;
}

.Content.LatestNewsRoot #NewsTicker .NewsTickerText {
  font-size: 12px !important;
  line-height: 17px !important;
}

.Content.LatestNewsRoot #NewsTicker .NewsTickerShortText {
  height: 17px !important;
}

.Content.LatestNewsRoot #FeaturedArticle .BoxContent {
  min-height: 0 !important;
  padding: 22px 24px 24px !important;
  overflow: hidden !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
}

.Content.LatestNewsRoot #FeaturedArticle #TeaserThumbnail {
  position: relative !important;
  inset: auto !important;
  float: right !important;
  width: 190px !important;
  height: 126px !important;
  margin: 0 0 16px 22px !important;
}

.Content.LatestNewsRoot #FeaturedArticle .BoxContent > div:not(#TeaserThumbnail) {
  position: static !important;
  top: auto !important;
}

.Content.LatestNewsRoot #latestnews.PageFrameBox {
  position: relative !important;
  width: 100% !important;
  box-sizing: border-box !important;
  margin: 62px 0 34px !important;
  padding: 0 0 126px !important;
  overflow: visible !important;
  isolation: isolate !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #dfe8ff !important;
  box-shadow: none !important;
}

.Content.LatestNewsRoot #latestnews.PageFrameBox > .Corner-tl,
.Content.LatestNewsRoot #latestnews.PageFrameBox > .Corner-tr,
.Content.LatestNewsRoot #latestnews.PageFrameBox > .CornerWrapper-b,
.Content.LatestNewsRoot #latestnews.PageFrameBox > .Border_1 {
  display: none !important;
}

.Content.LatestNewsRoot #latestnews.PageFrameBox > .BorderTitleText {
  position: relative !important;
  z-index: 24 !important;
  display: block !important;
  width: 100% !important;
  height: 255px !important;
  margin: 0 0 -1px !important;
  overflow: visible !important;
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
  pointer-events: none !important;
}

.Content.LatestNewsRoot #latestnews.PageFrameBox > .BorderTitleText::before {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  top: 0 !important;
  left: 50% !important;
  width: calc(100% + 120px) !important;
  height: 430px !important;
  transform: translateX(-50%) !important;
  background: url("../images/ui/page-frame-kit/page-frame-top-connected-wide-v2.png") center top / 100% auto no-repeat !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

.Content.LatestNewsRoot #latestnews.PageFrameBox > .BorderTitleText::after {
  display: none !important;
  content: none !important;
}

.Content.LatestNewsRoot #latestnews.PageFrameBox > .BorderTitleText > .HeaderPagesText {
  position: absolute !important;
  z-index: 4 !important;
  top: 49px !important;
  right: 76px !important;
  left: 134px !important;
  display: flex !important;
  height: 64px !important;
  align-items: center !important;
  justify-content: center !important;
  transform: translateX(-12px) !important;
  color: #fff2bd !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 20px !important;
  line-height: 1 !important;
  text-align: center !important;
  text-shadow: 0 2px 2px #02040e, 0 0 9px rgba(113, 207, 255, .45) !important;
}

.Content.LatestNewsRoot #latestnews.PageFrameBox > .Border_2 {
  position: relative !important;
  z-index: 10 !important;
  margin: -96px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

.Content.LatestNewsRoot #latestnews.PageFrameBox > .Border_2 > .Border_3 {
  position: relative !important;
  z-index: 10 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

.Content.LatestNewsRoot #latestnews.PageFrameBox > .Border_2 > .Border_3 > .BoxContent {
  position: relative !important;
  z-index: 0 !important;
  box-sizing: border-box !important;
  min-height: 285px !important;
  height: auto !important;
  padding: 42px 24px 34px !important;
  isolation: isolate !important;
  border: 0 !important;
  border-radius: 0 !important;
  background:
    radial-gradient(circle at 8% 0%, rgba(138, 91, 246, .15), transparent 32%),
    radial-gradient(circle at 94% 12%, rgba(64, 188, 255, .12), transparent 34%),
    linear-gradient(180deg, rgba(8, 18, 48, .96), rgba(4, 10, 30, .99)) !important;
  color: #dfe8ff !important;
  box-shadow: none !important;
}

.Content.LatestNewsRoot #latestnews.PageFrameBox > .Border_2 > .Border_3 > .BoxContent::before {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  z-index: -1 !important;
  top: -66px !important;
  right: -6px !important;
  bottom: -96px !important;
  left: -6px !important;
  width: auto !important;
  height: auto !important;
  border: 0 !important;
  border-radius: 0 !important;
  background:
    radial-gradient(circle at 8% 0%, rgba(138, 91, 246, .12), transparent 32%),
    radial-gradient(circle at 94% 12%, rgba(64, 188, 255, .10), transparent 34%),
    linear-gradient(180deg, rgba(8, 18, 48, .96), rgba(4, 10, 30, .98)) !important;
  box-shadow: none !important;
  pointer-events: none !important;
}

.Content.LatestNewsRoot #latestnews.PageFrameBox::before,
.Content.LatestNewsRoot #latestnews.PageFrameBox::after {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  top: 390px !important;
  bottom: 48px !important;
  width: 50px !important;
  height: auto !important;
  background: url("../images/ui/page-frame-kit/page-frame-pillar-mid-v1.png") center top / 100% 100% no-repeat !important;
  pointer-events: none !important;
  z-index: 5 !important;
}

.Content.LatestNewsRoot #latestnews.PageFrameBox::before {
  right: auto !important;
  left: -46px !important;
  transform: none !important;
}

.Content.LatestNewsRoot #latestnews.PageFrameBox::after {
  right: -46px !important;
  left: auto !important;
  transform: scaleX(-1) !important;
}

.Content.LatestNewsRoot #latestnews.PageFrameBox > .Border_2::after {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  z-index: 24 !important;
  bottom: -122px !important;
  left: 50% !important;
  width: calc(100% + 96px) !important;
  height: 151px !important;
  transform: translateX(-50%) !important;
  background: url("../images/ui/page-frame-kit/page-frame-bottom-wide-v2.png") center bottom / 100% auto no-repeat !important;
  pointer-events: none !important;
}

.Content.LatestNewsRoot #latestnews .bg-body {
  padding: 0 !important;
  background: transparent !important;
}

.Content.LatestNewsRoot #latestnews .topic--list {
  box-sizing: border-box !important;
  margin: 0 0 22px !important;
  padding: 18px !important;
  overflow: hidden !important;
  border: 1px solid rgba(110, 148, 222, .24) !important;
  border-radius: 14px !important;
  background:
    linear-gradient(145deg, rgba(16, 31, 72, .72), rgba(7, 16, 42, .9) 58%, rgba(24, 15, 56, .72)) !important;
  color: #dfe8ff !important;
  box-shadow:
    inset 0 1px 0 rgba(229, 242, 255, .04),
    0 8px 20px rgba(1, 4, 18, .24) !important;
}

.Content.LatestNewsRoot #latestnews .NewsHeadline {
  margin: 0 0 18px !important;
}

.Content.LatestNewsRoot #latestnews #news-body {
  display: flow-root !important;
  width: 100% !important;
  box-sizing: border-box !important;
  overflow-wrap: anywhere !important;
  color: #dfe8ff !important;
  font-size: 13px !important;
  line-height: 1.55 !important;
}

.Content.LatestNewsRoot #latestnews #news-body img {
  max-width: 100% !important;
  height: auto !important;
}

.Content.LatestNewsRoot #latestnews .topic--list > .panel-body:last-of-type {
  clear: both !important;
  margin-top: 14px !important;
}

@media (max-width: 760px) {
  .Content.LatestNewsRoot #NewsTicker,
  .Content.LatestNewsRoot #FeaturedArticle {
    margin: 16px 0 22px !important;
  }

  .Content.LatestNewsRoot #NewsTicker > .HeaderPagesText,
  .Content.LatestNewsRoot #FeaturedArticle > .HeaderPagesText {
    height: 50px !important;
    padding: 0 42px !important;
    background-size: 100% 50px !important;
    font-size: 16px !important;
  }

  .Content.LatestNewsRoot #FeaturedArticle #TeaserThumbnail {
    float: none !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 9 !important;
    margin: 0 0 18px !important;
  }

  .Content.LatestNewsRoot #latestnews.PageFrameBox {
    margin-top: 46px !important;
    padding-bottom: 92px !important;
  }

  .Content.LatestNewsRoot #latestnews.PageFrameBox > .BorderTitleText {
    height: 190px !important;
  }

  .Content.LatestNewsRoot #latestnews.PageFrameBox > .BorderTitleText::before {
    width: calc(100% + 70px) !important;
    height: 300px !important;
  }

  .Content.LatestNewsRoot #latestnews.PageFrameBox > .BorderTitleText > .HeaderPagesText {
    top: 38px !important;
    right: 58px !important;
    left: 106px !important;
    height: 52px !important;
    transform: translateX(-8px) !important;
    font-size: 17px !important;
  }

  .Content.LatestNewsRoot #latestnews.PageFrameBox > .Border_2 {
    margin-top: -70px !important;
  }

  .Content.LatestNewsRoot #latestnews.PageFrameBox > .Border_2 > .Border_3 > .BoxContent::before {
    top: -46px !important;
    right: -6px !important;
    bottom: -70px !important;
    left: -6px !important;
  }

  .Content.LatestNewsRoot #latestnews.PageFrameBox::before,
  .Content.LatestNewsRoot #latestnews.PageFrameBox::after {
    top: 266px !important;
    bottom: 26px !important;
    width: 32px !important;
  }

  .Content.LatestNewsRoot #latestnews.PageFrameBox::before {
    left: -38px !important;
  }

  .Content.LatestNewsRoot #latestnews.PageFrameBox::after {
    right: -38px !important;
  }

  .Content.LatestNewsRoot #latestnews.PageFrameBox > .Border_2::after {
    bottom: -88px !important;
    width: calc(100% + 62px) !important;
    height: 92px !important;
  }

  .Content.LatestNewsRoot #latestnews.PageFrameBox > .Border_2 > .Border_3 > .BoxContent {
    padding: 34px 14px 24px !important;
  }

  .Content.LatestNewsRoot #latestnews .topic--list {
    padding: 12px !important;
  }
}
/* === aguionOT LATEST NEWS ISOLATED LAYOUT END === */

/* Refine the lower page frame and retire the legacy gold footer border. */
.Content .Box.PageFrameBox > .Border_2::after,
.Content.LatestNewsRoot #latestnews.PageFrameBox > .Border_2::after {
  width: calc(100% + 80px) !important;
}
#Footer {
  margin-top: 18px;
  padding: 10px 12px 22px;
  box-sizing: border-box;
  color: #bcc5dd;
  text-shadow: 0 1px 3px #030715;
}
@media (max-width: 760px) {
  .Content .Box.PageFrameBox > .Border_2::after,
  .Content.LatestNewsRoot #latestnews.PageFrameBox > .Border_2::after {
    width: calc(100% + 32px) !important;
  }
}