@charset "utf-8";
/* ==========================================================================
   DBO FURIA  -  Template "furia"  (Modern AAC / Smarty)
   Layout fiel ao template original: wrapper 1000px | moldura 901px
   coluna esquerda 210 | centro 499 | direita 238  (cards 180x140)
   --------------------------------------------------------------------------
   Para trocar o visual do site inteiro, edite SOMENTE as variaveis abaixo.
   ========================================================================== */
:root{
	--bg:            #06040a;   /* fundo da pagina               */
	--panel:         #0f0a16;   /* paineis / caixas              */
	--panel-2:       #150d1e;   /* linhas alternadas             */
	--line:          #2b1a2c;   /* linhas e bordas discretas     */
	--text:          #e6e0ee;   /* texto principal               */
	--muted:         #9a8fa8;   /* texto secundario              */
	--ember:         #ff6a1f;   /* cor de destaque principal     */
	--crimson:       #e0162b;   /* cor de destaque secundaria    */
	--gold:          #ffc23d;   /* titulos e links               */
	--link:          #ffb23e;
	--link-hover:    #ffffff;
	--ok:            #2bff7a;   /* servidor online               */
	--bad:           #ff3b4e;   /* servidor offline              */
	--font:          Tahoma, Verdana, Helvetica, Arial, sans-serif;
}

/* ---------- base ---------- */
html{ background:var(--bg); }
body{
	background:var(--bg) url(img/bg.jpg);
	color:var(--text);
	font-family:var(--font);
	font-size:12px;
	line-height:1.45;
	margin:0; padding:0 0 30px;
}
form{ margin:0; padding:0; }
img{ border:0; }
a{ color:var(--link); text-decoration:underline; }
a:hover{ color:var(--link-hover); text-decoration:none; }
table,td,th{ font-size:12px; color:var(--text); }
h1,h2,h3,h4{ color:var(--gold); margin:0 0 8px; font-family:var(--font); }
hr{ border:0; height:1px; background:linear-gradient(90deg,transparent,var(--ember),transparent); }
legend{ color:var(--gold); font-weight:bold; }
fieldset{ border:1px solid var(--line); background:rgba(255,255,255,.02); }

/* ---------- estrutura (mesmas medidas do template original) ---------- */
#wrap{ width:1000px; margin:0 auto; position:relative; }
#header{ width:1000px; height:321px; line-height:0; overflow:hidden; }
#header img{ display:block; width:1000px; height:321px; }

#frame{
	position:relative;
	width:951px; margin:-47px 0 0 49px;            /* sobe 47px sobre o header, como o original */
	min-height:620px;
	background:
		linear-gradient(90deg,transparent 0,var(--ember) 18%,#ffd9a0 50%,var(--ember) 82%,transparent 100%) top left/901px 2px no-repeat,
		url(img/tlo_2.png) repeat-y;
}
#frame:after,.clearfix:after{ content:""; display:block; clear:both; height:0; }

.left  { float:left; width:187px; padding:30px 20px 10px 3px; }
.center{ float:left; width:499px; padding-top:20px; }
.right { float:left; width:176px; padding:30px 0 10px 62px; }
.center_long{ float:left; width:705px; padding-top:20px; }

.tekst{ font-size:12px; color:var(--text); padding:15px; }
.tekst p{ margin:0 0 10px; }

/* ---------- menu esquerdo ---------- */
.card{ display:block; width:180px; height:140px; margin-left:-52px; }
.left .card + .m1{ margin-top:8px; }
.m1{ list-style:none; margin:0 0 12px; padding:0; position:relative; left:-42px; width:161px; }
.m1 li{ margin:0 0 12px; padding:0; height:33px; }
.m1 a{ text-decoration:none; }

.myButton{
	position:relative; display:block; box-sizing:border-box;
	width:161px; height:33px; line-height:31px; margin:0; padding:0 6px;
	text-align:center; font-size:13px; font-weight:bold; color:#f1ecf7; text-decoration:none;
	background:linear-gradient(180deg,#1b1126 0%,#0d0813 100%);
	border:1px solid #4a2a2c; border-left:3px solid var(--ember);
	box-shadow:0 0 6px rgba(255,106,31,.25), inset 0 1px 0 rgba(255,255,255,.06);
	-webkit-transition:all .25s ease; transition:all .25s ease;
	white-space:nowrap; overflow:hidden;
}
.myButton:before{
	content:"\00bb"; position:absolute; left:9px; top:0; color:var(--ember); font-size:15px;
	opacity:0; -webkit-transition:all .25s ease; transition:all .25s ease;
}
.myButton:hover{
	color:#fff; border-color:var(--ember);
	background:linear-gradient(90deg,var(--crimson) 0%,var(--ember) 100%);
	box-shadow:0 0 16px rgba(255,106,31,.75);
	padding-left:16px; text-shadow:0 1px 2px rgba(0,0,0,.6);
}
.myButton:hover:before{ opacity:1; color:#fff; left:11px; }
.myButton:active{ top:1px; }

/* ---------- coluna direita ---------- */
.right .card{ margin-left:0; }
.right .card-link{ display:block; width:180px; height:140px; margin-bottom:14px;
	-webkit-transition:all .25s ease; transition:all .25s ease; position:relative; top:0; }
.right .card-link:hover{ top:-4px; -webkit-filter:drop-shadow(0 0 10px rgba(255,194,61,.8)); filter:drop-shadow(0 0 10px rgba(255,194,61,.8)); }

.mng{
	width:162px; height:40px; line-height:36px; margin:0 7px;
	background:url(img/m_bg1.png) no-repeat left top;
	text-align:center; color:#fff; font-weight:bold; font-size:12px; letter-spacing:1px; text-transform:uppercase;
}
.mng2,.mng3{ margin:0 30px; border-bottom:1px solid var(--ember); padding:8px; color:#fff; font-weight:bold; font-size:12px; }
.mngt{
	width:162px; margin:0 7px 14px; box-sizing:border-box; padding:8px 8px 10px;
	background:linear-gradient(180deg,#140c1d,#0b0710);
	border:1px solid #3a1d22; border-top:0;
	font-size:11px; color:var(--text);
}
.mngt table{ width:100%; border-collapse:collapse; }
.mngt th{ color:var(--gold); font-size:10px; text-transform:uppercase; padding:3px 2px; border-bottom:1px solid var(--line); text-align:center; }
.mngt th.num, .mngt th.name{ text-align:left; }
.mngt td{ padding:3px 2px; border-bottom:1px solid rgba(255,255,255,.04); font-size:11px; }
.mngt td.num{ width:19px; color:var(--muted); }
.mngt td.lv, .mngt td.fr{ text-align:center; font-weight:bold; color:#fff; }
.mngt a{ text-decoration:none; font-weight:bold; }
.mngt a:hover{ text-decoration:underline; }
.dot{ display:inline-block; width:7px; height:7px; border-radius:50%; margin-right:4px; background:var(--bad); box-shadow:0 0 5px var(--bad); }
.dot.on{ background:var(--ok); box-shadow:0 0 5px var(--ok); }

/* caixa de status do servidor */
.status{ margin:0 7px 14px; width:162px; box-sizing:border-box; padding:10px 8px; text-align:center;
	background:linear-gradient(180deg,#1a0d14,#0b0710); border:1px solid #4a2326; box-shadow:0 0 14px rgba(224,22,43,.25); }
.status .st-title{ color:var(--gold); font-weight:bold; font-size:12px; letter-spacing:2px; text-transform:uppercase; }
.status .st-on{ color:var(--ok); font-weight:bold; font-size:15px; margin:3px 0; text-shadow:0 0 8px rgba(43,255,122,.7); }
.status .st-off{ color:var(--bad); font-weight:bold; font-size:15px; margin:3px 0; text-shadow:0 0 8px rgba(255,59,78,.7); }
.status .st-row{ color:var(--text); font-size:11px; }
.status .st-row b{ color:var(--muted); }

.social{ margin:0 3px 12px; }
.social iframe{ display:block; margin:0 auto 10px; border:0; }
.fb-btn{ display:block; box-sizing:border-box; width:162px; margin:0 auto 10px; padding:9px 6px; text-align:center;
	font-weight:bold; font-size:12px; color:#fff; text-decoration:none; text-transform:uppercase; letter-spacing:1px;
	background:linear-gradient(180deg,#2a5db0,#173a7a); border:1px solid #5b8ae0; box-shadow:0 0 10px rgba(60,110,220,.4); }
.fb-btn:hover{ background:linear-gradient(180deg,#3a74d6,#1f4a9a); color:#fff; }

/* ---------- noticias / titulos de conteudo ---------- */
#vt_header .message .title, .news .newsTitle{
	box-sizing:border-box; width:469px; height:28px; line-height:28px; padding:0 14px 0 14px;
	background:#160810 url(img/news.gif) no-repeat left top;
	color:#fff; font-family:Arial,sans-serif; font-size:11px; font-weight:bold; border:0;
	text-shadow:0 1px 2px #000;
}
.news{ margin-bottom:14px; }
.news .newsBody, #vt_header .message .body{ padding:8px 4px; }
.contentheader{ width:535px; height:49px; background:url(img/contentheader.png) no-repeat; }
.divbox{ width:450px; min-height:59px; background:url(img/div.png) no-repeat; padding:14px 16px; box-sizing:border-box; }
.ng{ background:url(img/ng.gif) repeat-x bottom; font-size:16px; color:var(--gold); padding:8px 0; }
.ng2{ font-size:16px; color:var(--gold); }
.new{ display:inline-block; width:26px; height:12px; background:url(img/new.gif) no-repeat; vertical-align:middle; }

/* ---------- tabelas (compatibilidade Modern AAC) ---------- */
.LabelV{ font-size:12px; font-weight:bold; padding-right:10px; white-space:nowrap; vertical-align:top; color:var(--gold); }
.LabelH{ font-weight:bold; padding-right:10px; white-space:nowrap; color:#fff; background:linear-gradient(180deg,#4a1220,#2a0a14); }
.LabelH td,.LabelH th{ background:linear-gradient(180deg,#4a1220,#2a0a14); padding:4px 6px; color:#fff; }
table th{ color:var(--gold); }
th.black,td.black{ color:var(--gold); }
.highlight:hover td{ background:rgba(255,106,31,.10); }
.Content .BoxContent .Odd, .Odd{ background:var(--panel-2); padding:2px; }
.Content .BoxContent .Even, .Even{ background:var(--panel); padding:2px; }
.Content .NewsCategoryIconSmall{ position:absolute; top:1px; left:1px; width:16px; height:16px; background-repeat:no-repeat; }
.color0{ background-color:#340100; } .color1{ background-color:#5c120f; } .color2{ background-color:#000; }
.percent_bar{ background-color:#130101; height:20px; color:#fff; font-weight:bold; text-align:center; }

/* ---------- formularios e botoes ---------- */
input[type=text],input[type=password],input[type=email],input[type=number],select,textarea,.form input{
	background:#120b1a; color:#fff; border:1px solid #5a2a2e; padding:3px 5px; font-family:var(--font); font-size:12px;
	vertical-align:middle; border-radius:2px;
}
input[type=text]:focus,input[type=password]:focus,input[type=email]:focus,textarea:focus,select:focus{
	outline:0; border-color:var(--ember); box-shadow:0 0 6px rgba(255,106,31,.55); }
input[type=submit],input[type=button],input[type=reset],button{
	cursor:pointer; color:#fff; font-weight:bold; font-family:var(--font); font-size:12px; padding:4px 14px;
	background:linear-gradient(180deg,var(--ember),var(--crimson)); border:1px solid #ff9a5a; border-radius:2px;
	text-shadow:0 1px 1px rgba(0,0,0,.6); -webkit-transition:all .2s ease; transition:all .2s ease;
}
input[type=submit]:hover,input[type=button]:hover,input[type=reset]:hover,button:hover{ box-shadow:0 0 12px rgba(255,106,31,.8); filter:brightness(1.12); }
.form{ color:#fff; font-size:12px; font-weight:bold; position:absolute; left:270px; top:4px; }
.form input{ width:110px; }
.f-info{ color:var(--bad); font-size:10px; position:absolute; left:261px; top:31px; font-family:Verdana,Arial,sans-serif; width:390px; text-align:center; }
.f-info a{ color:var(--bad); text-decoration:none; } .f-info a:hover{ text-decoration:underline; }
.BigButton{ position:relative; width:135px; height:25px; z-index:10; }
.BigButtonOver{ position:absolute; top:0; left:0; width:137px; height:25px; visibility:hidden; z-index:15; }
.ButtonText{ position:absolute; top:0; left:0; height:31px; width:144px; z-index:20; }
.InnerTableButtonRow{ width:100%; padding:0 0 4px 1px; border:0; }
.InnerTableButtonRow td{ padding-right:4px; }
.TopButtonContainer{ position:relative; right:4px; top:4px; z-index:60; }
.TopButtonContainer .TopButton{ position:absolute; right:0; z-index:55; }

/* ---------- mensagens e utilidades ---------- */
#error{ position:absolute; font-family:Verdana; font-size:8pt; font-weight:bold; width:175px; min-height:70px; padding:20px 15px 20px 60px;
	margin:100px 0 0 240px; cursor:pointer; color:#fff; background:#2a0a12; border:1px solid var(--crimson); box-shadow:0 0 14px rgba(224,22,43,.6); }
#captcha-image{ margin-top:5px; }
#account-image{ width:300px; height:200px; float:right; }
#choose-skill{ float:left; margin-right:20px; }
#form #iobox{ z-index:10; position:fixed; background:var(--panel); border:1px outset #6f1713; cursor:move; color:var(--text); font-size:11px; }
#form #iobox fieldset{ cursor:default; }
.task-menu{ cursor:pointer; }
.task-menu li{ list-style:none; height:16px; background-repeat:no-repeat; padding:0 0 5px 20px; }
.task-menu li:hover{ background-color:rgba(255,255,255,.08); }
.imagem-shadow{ opacity:.5; filter:alpha(opacity=50); }
.imagem-shadow:hover{ opacity:1; filter:alpha(opacity=100); }
font.details_wars{ text-decoration:none; font-weight:bold; color:var(--gold); }
font.details_wars:hover{ color:#fff; }
font.details_perso{ text-decoration:none; font-weight:bold; color:#7aa2ff; }
font.details_perso:hover{ color:#ff6a6a; }
#overview{ display:none; }

/* sombras de tabela (legado) */
.TableShadowContainerRightTop{ position:relative; top:0; right:3px; margin-right:0; font-size:1px; float:right; z-index:99; }
.TableShadowRightTop{ position:absolute; top:0; right:0; width:4px; height:5px; z-index:99; }
.TableContentAndRightShadow{ position:relative; background-repeat:repeat-y; background-position:top right; margin-right:3px; font-size:1px; }
.TableShadowContainer{ position:relative; width:100%; margin-right:5px; }
.TableBottomShadow{ position:relative; font-size:1px; height:5px; width:100%; padding:0; margin:0; }
.TableBottomLeftShadow{ position:relative; height:5px; width:4px; float:left; padding:0; margin:0; }
.TableBottomRightShadow{ position:relative; float:right; right:-2px; top:0; height:5px; width:4px; }

/* ---------- castle / guilda dominante (castle.php) ---------- */
#CastleWarBox{ width:166px; height:213px; margin-bottom:20px; text-align:center; box-sizing:border-box;
	background:linear-gradient(180deg,#1a0d14,#0b0710); border:1px solid #4a2326; }
#CastleWarBox .inner{ padding-top:70px; }
#CastleWarBox a{ font-weight:bold; }

/* ---------- galeria (gallery.php) ---------- */
.svw{ width:50px; height:20px; background:var(--panel); }
.svw ul{ position:relative; left:-999em; }
.stripViewer{ position:relative; overflow:hidden; border:1px groove #3a2a3c; padding:1px; margin:0 0 1px; }
.stripViewer ul{ margin:0; padding:0; position:relative; left:0; top:0; width:1%; list-style-type:none; }
.stripViewer ul li{ float:left; }
.stripTransmitter{ overflow:auto; width:1%; }
.stripTransmitter ul{ margin:0; padding:0; position:relative; list-style-type:none; }
.stripTransmitter ul li{ width:20px; float:left; margin:0 1px 1px 0; }
.stripTransmitter a{ font:bold 10px Verdana,Arial; text-align:center; line-height:22px; background-color:#3a1f2a; color:#fff; text-decoration:none; display:block; }
.stripTransmitter a:hover,a.current{ background:var(--ember); color:#fff; }
.tooltip{ padding:.5em; background:#fff; color:#000; border:5px solid #dedede; }

/* ---------- rodape ---------- */
#vt_footer{ width:901px; margin:0 0 0 49px; clear:both; text-align:center; color:#fff; font-family:Arial,sans-serif; font-size:11px; }
#vt_footer img.foot{ display:block; width:901px; height:244px; }
#vt_footer .credit{ padding:12px 0 0; color:var(--muted); font-weight:bold; }
#vt_footer .credit img{ display:block; margin:6px auto 0; width:155px; height:64px; }
#vt_footer .render{ padding:8px 0 0; color:#6d6378; font-weight:normal; font-size:10px; }
#vt_footer a{ color:var(--gold); }

.myButton.rgb-glow {
	animation: rgbGlow 4s linear infinite;
}

@keyframes rgbGlow {
	0%   { box-shadow: 0 0 6px #ff0000, 0 0 14px #ff0000; text-shadow: 0 0 6px #ff0000; }
	17%  { box-shadow: 0 0 6px #ff9900, 0 0 14px #ff9900; text-shadow: 0 0 6px #ff9900; }
	33%  { box-shadow: 0 0 6px #ffee00, 0 0 14px #ffee00; text-shadow: 0 0 6px #ffee00; }
	50%  { box-shadow: 0 0 6px #00ff44, 0 0 14px #00ff44; text-shadow: 0 0 6px #00ff44; }
	67%  { box-shadow: 0 0 6px #00ccff, 0 0 14px #00ccff; text-shadow: 0 0 6px #00ccff; }
	83%  { box-shadow: 0 0 6px #aa00ff, 0 0 14px #aa00ff; text-shadow: 0 0 6px #aa00ff; }
	100% { box-shadow: 0 0 6px #ff0000, 0 0 14px #ff0000; text-shadow: 0 0 6px #ff0000; }
}