@font-face{font-family:WartebraMartel;src:url('martel.ttf') format('truetype');font-display:swap}
:root{--gold:#d8b45d;--gold2:#f4db94;--green:#0f291a;--green2:#173922;--ink:#090b08;--paper:#e8d4ac;--frame:#6b5226}
*{box-sizing:border-box}
html,body{min-height:100%;margin:0;background:#030907;color:#ead8a8}
body{overflow-x:auto;background:radial-gradient(ellipse at top,#142317 0,#07100c 43%,#020504 100%) fixed}
#top{display:none}
#ArtworkHelper{position:relative;min-width:1180px;min-height:100vh!important;height:auto!important;background:#030907 url('images/modelo3/hero-modelo3.png') center top/1672px auto no-repeat!important}
#Bodycontainer{position:relative;width:min(1540px,calc(100% - 42px))!important;min-width:1140px!important;max-width:1540px!important;margin:0 auto!important;min-height:100vh!important;height:auto!important;padding-top:318px}
#ContentRow{position:relative!important;top:auto!important;left:auto!important;width:100%!important;display:grid!important;grid-template-columns:300px minmax(600px,1fr) 274px;gap:14px;align-items:start;padding:0 0 40px;background:linear-gradient(#11150f,#080b08);border:2px solid #5f4925;border-top:0;box-shadow:0 12px 30px #000,inset 0 0 0 2px #18130b}
#ContentRow:before{content:"";position:absolute;inset:0;pointer-events:none;border:8px solid transparent;border-image:linear-gradient(#8a6c31,#3a2b13,#80632c) 1;opacity:.6}
#MenuColumn,#ContentColumn,#ThemeboxesColumn{position:relative!important;left:auto!important;right:auto!important;top:auto!important;margin:0!important;width:auto!important;z-index:2}
#MenuColumn{padding:52px 14px 20px;background:linear-gradient(90deg,#10140d,#202016 50%,#0c100b);min-height:615px;border-right:1px solid #4d3b1c}
#ContentColumn{padding:0 0 8px;min-width:0}
#ThemeboxesColumn{padding:0 12px 10px 0}
#LeftArtwork,#RightArtwork,#PedestalAndOnline,#TibiaLogoArtworkTop,#TibiaLogoArtworkBottom,#LogoLink,#Loginbox,#DownloadBox{display:none!important}

/* top social bar */
#ContentColumn>.Content>.Box:first-child{margin:0 0 10px!important;filter:none!important}
#ContentColumn>.Content>.Box:first-child .Corner-tl,#ContentColumn>.Content>.Box:first-child .Corner-tr,#ContentColumn>.Content>.Box:first-child>.Border_1,#ContentColumn>.Content>.Box:first-child>.CornerWrapper-b,#ContentColumn>.Content>.Box:first-child>.Border_1:last-child{display:none!important}
#ContentColumn>.Content>.Box:first-child .BorderTitleText{height:44px!important;background:linear-gradient(#171810,#0a0d09)!important;border:2px solid #725a2b;box-shadow:inset 0 0 0 2px #21180b;margin:0!important}
.InfoBar{height:40px!important;padding:8px 13px!important;border:0!important;background:none!important;box-shadow:none!important;color:#e4cc88!important;font:700 13px Georgia,serif;text-transform:uppercase;white-space:nowrap}
.InfoBarBigLogo{vertical-align:middle;margin:0 5px 0 9px!important;filter:sepia(1) saturate(.8) brightness(1.35)}
.InfoBarLinks,.InfoBarSmallElement{color:#e7cf91!important;text-decoration:none!important}

/* menu */
#Menu{position:relative!important;left:auto!important;top:auto!important;width:100%!important;padding:0!important;margin:0!important;background:none!important;border:0!important;box-shadow:none!important;filter:none!important}
#MenuTop,#MenuBottom{display:none!important}
.menuitem{width:100%!important;margin:0 0 18px!important;border:2px solid #745826!important;background:#11170f!important;box-shadow:inset 0 0 0 2px #1c150b,0 5px 10px #000!important}
.MenuButton{height:62px!important;width:100%!important;background:linear-gradient(#1e3a25,#0a170f)!important;border:1px solid #a17a34}
.MenuButton>div{height:60px!important;position:relative!important}
.MenuButton .Button{position:absolute!important;inset:0!important;width:auto!important;height:auto!important;background:linear-gradient(rgba(72,117,72,.18),rgba(0,0,0,.1))!important}
.MenuButton .Icon{position:absolute!important;left:14px!important;top:10px!important;width:42px!important;height:42px!important;background-size:contain!important;background-repeat:no-repeat!important;filter:sepia(1) saturate(.7) brightness(1.4)}
.MenuButton .Label{position:absolute!important;left:65px!important;right:24px!important;top:0!important;width:auto!important;height:60px!important;line-height:60px!important;text-align:center;color:#efd789!important;font:700 21px Georgia,serif!important;text-transform:uppercase;text-shadow:0 2px 2px #000}
.MenuButton .Extend,.Lights{display:none!important}
.Submenu{display:none!important}

/* content */
.Content{width:100%!important;margin:0!important;padding:0!important}
#ContentHelper{width:100%!important;margin:0!important;padding:0!important}
.Box{width:100%!important;margin:0 0 12px!important;position:relative!important}
.BoxContent{min-height:130px!important;background:#ead7b1 url('images/content/scroll.gif') repeat!important;color:#251b0d!important;padding:14px 18px!important;font-size:14px!important}
.BorderTitleText{height:42px!important;background:linear-gradient(#18351f,#07130c)!important;border-top:1px solid #917238!important;border-bottom:1px solid #1a1208!important}
.Box>.Title{position:absolute!important;top:10px!important;left:21px!important;height:auto!important;max-height:25px!important;filter:sepia(1) saturate(.55) brightness(1.4)}
#newsticker>.Title{display:none!important}
#newsticker:before{content:'LATEST NEWS';position:absolute;z-index:10;top:8px;left:24px;color:#efd98e;font:700 20px Georgia,serif;letter-spacing:.5px;text-shadow:0 2px #000}
#newsticker .BoxContent{min-height:180px!important;padding-top:20px!important}
#news>.Title{display:none!important}
#news:before{content:'NEWS';position:absolute;z-index:10;top:8px;left:24px;color:#efd98e;font:700 20px Georgia,serif;letter-spacing:.5px;text-shadow:0 2px #000}
.Border_1{background-color:#2e2414!important}
#Footer{position:relative!important;left:auto!important;top:auto!important;width:100%!important;text-align:center!important;color:#bda66d!important;font:12px Georgia,serif!important;padding:8px 0 16px!important}

/* right panels */
#Themeboxes{display:none!important}
#WartebraRightPanels{display:block;padding-top:0}
.wt-sidebox{margin:0 0 10px;border:2px solid #6f5426;background:#171810;box-shadow:inset 0 0 0 2px #21170b,0 6px 11px #000}
.wt-side-title{height:43px;display:flex;align-items:center;justify-content:center;background:linear-gradient(#18351f,#08140d);border-bottom:2px solid #8a6a2f;color:#efd78a;font:700 18px Georgia,serif;text-transform:uppercase;text-shadow:0 2px #000}
.wt-side-body{background:#dec79d url('images/content/scroll.gif') repeat;color:#281c0d;padding:12px;font:14px Georgia,serif}
.wt-online-line{padding-bottom:10px;border-bottom:1px solid rgba(76,55,20,.35)}
.wt-dot{display:inline-block;width:12px;height:12px;border-radius:50%;margin-right:7px;box-shadow:0 0 7px currentColor}.wt-dot.on{background:#55df6c;color:#55df6c}.wt-dot.off{background:#c94b43;color:#c94b43}
.wt-featured-player{display:flex;gap:10px;align-items:center;padding-top:12px}.wt-medal{display:flex;width:32px;height:32px;border-radius:50%;align-items:center;justify-content:center;background:#d4a625;border:2px solid #6f4d0a;font-weight:700}
.wt-ranking{padding:0}.wt-rank-row{display:grid;grid-template-columns:36px 1fr 42px;gap:6px;align-items:center;padding:8px 9px;border-bottom:1px solid #8a7147;color:#2e210f!important;text-decoration:none!important}.wt-rank-row:last-child{border-bottom:0}.wt-rank-pos{font-weight:700;text-align:center}.wt-rank-name{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.wt-rank-value{text-align:right}
.wt-promo{display:flex;align-items:center;gap:12px;min-height:104px}.wt-chest,.wt-discord-mark{font-size:43px;line-height:1}.wt-discord-mark{color:#5865f2}.wt-green-btn{display:inline-block;margin-top:8px;padding:7px 12px;border:1px solid #ad8639;background:linear-gradient(#416422,#18350f);color:#f2dda0!important;text-decoration:none!important;font-weight:700;box-shadow:inset 0 0 0 1px #102009}

/* old decorative pieces become a clean medieval frame */
.Corner-tl,.Corner-tr,.Corner-bl,.Corner-br{filter:sepia(.55) saturate(.75) brightness(.75)}
.TableContainer,.Box,.wt-sidebox{filter:drop-shadow(0 5px 8px rgba(0,0,0,.65))}
.scrollToTop,#HelperDivContainer{display:none!important}

@media(max-width:1280px){#ArtworkHelper{background-size:1500px auto!important}#Bodycontainer{width:1180px!important}.InfoBar{font-size:11px!important}.InfoBarBigLogo{margin-left:4px!important}}

/* ===== CORRECAO DEFINITIVA GRID WARTEBRA ===== */

#ContentRow{
    display:grid!important;
    grid-template-columns:300px minmax(650px,1fr) 285px!important;
    grid-template-areas:"menu center right"!important;
    gap:14px!important;
    width:100%!important;
    min-height:600px!important;
    position:relative!important;
    top:auto!important;
    left:auto!important;
}

#MenuColumn{
    grid-area:menu!important;
    display:block!important;
    position:relative!important;
    left:auto!important;
    top:auto!important;
    right:auto!important;
    width:300px!important;
    min-width:300px!important;
    margin:0!important;
    padding:52px 14px 20px!important;
    float:none!important;
}

#ContentColumn{
    grid-area:center!important;
    display:block!important;
    position:relative!important;
    left:auto!important;
    right:auto!important;
    top:auto!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    float:none!important;
}

#ThemeboxesColumn{
    grid-area:right!important;
    display:block!important;
    position:relative!important;
    left:auto!important;
    right:auto!important;
    top:auto!important;
    width:285px!important;
    min-width:285px!important;
    margin:0!important;
    padding:0 10px 10px 0!important;
    float:none!important;
}

#Menu{
    display:block!important;
    width:100%!important;
}

#WartebraRightPanels{
    display:block!important;
    width:100%!important;
}

#ContentColumn .Content,
#ContentColumn #ContentHelper,
#ContentColumn .Box{
    width:100%!important;
    max-width:none!important;
}


/* ===== CORRECAO DEFINITIVA GRID WARTEBRA ===== */

#ContentRow{
    display:grid!important;
    grid-template-columns:300px minmax(650px,1fr) 285px!important;
    grid-template-areas:"menu center right"!important;
    gap:14px!important;
    width:100%!important;
    min-height:600px!important;
    position:relative!important;
    top:auto!important;
    left:auto!important;
}

#MenuColumn{
    grid-area:menu!important;
    display:block!important;
    position:relative!important;
    left:auto!important;
    top:auto!important;
    right:auto!important;
    width:300px!important;
    min-width:300px!important;
    margin:0!important;
    padding:52px 14px 20px!important;
    float:none!important;
}

#ContentColumn{
    grid-area:center!important;
    display:block!important;
    position:relative!important;
    left:auto!important;
    right:auto!important;
    top:auto!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    float:none!important;
}

#ThemeboxesColumn{
    grid-area:right!important;
    display:block!important;
    position:relative!important;
    left:auto!important;
    right:auto!important;
    top:auto!important;
    width:285px!important;
    min-width:285px!important;
    margin:0!important;
    padding:0 10px 10px 0!important;
    float:none!important;
}

#Menu{
    display:block!important;
    width:100%!important;
}

#WartebraRightPanels{
    display:block!important;
    width:100%!important;
}

#ContentColumn .Content,
#ContentColumn #ContentHelper,
#ContentColumn .Box{
    width:100%!important;
    max-width:none!important;
}


/* ===== WARTEBRA - MENU ESQUERDO ===== */

#MenuColumn{
    width:300px!important;
    min-width:300px!important;
    box-sizing:border-box!important;
    padding:38px 22px 20px!important;
}

/* remove a caixa antiga que envolvia o menu */
#Menu{
    width:100%!important;
    background:none!important;
}

/* esconde topo e fundo do menu antigo */
#MenuTop,
#MenuBottom{
    display:none!important;
}

/* cada categoria */
#Menu .menuitem{
    position:relative!important;
    width:100%!important;
    min-height:76px!important;
    margin:0 0 16px 0!important;
    cursor:pointer!important;
}

/* botão principal */
#Menu .MenuButton{
    position:relative!important;
    width:100%!important;
    height:72px!important;
    box-sizing:border-box!important;
    background:
        linear-gradient(180deg,#153722 0%,#092417 48%,#061a11 100%)!important;
    border:2px solid #806327!important;
    outline:1px solid #2d2110!important;
    box-shadow:
        inset 0 0 0 2px #07140d,
        inset 0 0 18px rgba(0,0,0,.75),
        0 2px 4px rgba(0,0,0,.8)!important;
}

/* tira o gráfico antigo colocado por imagem */
#Menu .MenuButton > .Button{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    background:none!important;
}

/* texto */
#Menu .Label{
    position:absolute!important;
    left:72px!important;
    right:15px!important;
    top:0!important;
    height:68px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    font-family:Georgia,"Times New Roman",serif!important;
    font-size:21px!important;
    font-weight:bold!important;
    line-height:1!important;
    text-transform:uppercase!important;
    color:#e4c777!important;
    text-shadow:
        1px 1px 1px #000,
        0 0 5px #000!important;
}

/* ícone existente */
#Menu .Icon{
    position:absolute!important;
    left:15px!important;
    top:13px!important;
    width:48px!important;
    height:48px!important;
    background-position:center!important;
    background-repeat:no-repeat!important;
    background-size:contain!important;
}

/* não mostrar luzes e sinal + do layout antigo */
#Menu .Lights,
#Menu .Extend{
    display:none!important;
}

/* submenu continua funcionando */
#Menu .Submenu{
    width:calc(100% - 12px)!important;
    margin:0 6px!important;
}

/* hover */
#Menu .MenuButton:hover{
    filter:brightness(1.18)!important;
    border-color:#b08b3d!important;
}

