/********************************************
   AUTHOR:      ROMÁRIO LEITE
   WEBSITE:       https://muobjetiva.com.com.br/
   TEMPLATE NAME:	Mu Objetiva
   TEMPLATE CODE: 	V3
   VERSION:         3.0   	
*******************************************/
 
/********************************************
   HTML ELEMENTS
********************************************/ 
body {
	background-color: #0f0b0c;
    background-image: url(/images/bg.jpg), url(/images/bg-f.jpg);
    background-position: 53% 0, 50% 104%;
    background-repeat: no-repeat, no-repeat;
	margin: auto;
	color: #ffffff;
	font-family: Arial, sans-serif;
	font-size: 15px;
}
#events li {
	list-style-type:none;
}
#events {
	line-height:25px;
	margin: 10px
}
/* links */
a, a:visited {
	text-decoration: none;
	color: #fff;
	background: inherit;
}
a:hover {
	color: #cb1b12;
	background: inherit;
}
/* headers */
h1, h2, h3 {
	font-weight: Bold; 	
}
h1 {
	font-size: 23px;
	color: #fff;
	font-weight: bold;
	margin: 10px auto;
	padding: 0px 2px 4px 5px;
	border-bottom: solid 1px #dadada;
}
h2 {
	font-size: 20px;
	font-weight: bold;
	margin: 10px auto;
	padding: 4px 2px 4px 5px;
	border-bottom: solid 1px #dadada;
}

/* images */
img.float-right {
  margin: 5px 0px 10px 10px;  
}
img.float-left {
  margin: 5px 10px 10px 0px;
}

ul, ol {
	padding: 0 16px;
	list-style-type: none;
	margin: 6px 5px 10px 0px;
}
code {
  margin: 5px 0;
  padding: 10px;
  text-align: left;
  display: block;
  overflow: auto;  
  font: 500 1em/1.5em 'Lucida Console', 'courier new', monospace ;
  background: #FAFAFA;
  border: 1px solid #f2f2f2;  
}
.quadros {
  margin: 0px 0px 10px 0px;
  text-align: left;
  display: block;
  overflow: auto;
}
.eventos {
	width: 100%;
    display: inline-block;
}
.qdestaques {
  margin: 5px 0;
  text-align: left;
  display: block;
  overflow: auto;
}
.qdestaques2 {
  margin: 5px 0;
  text-align: left;
  display: block;
  overflow: auto;
}
.menuPainelUser {
  padding: 0px 6px 6px 6px;
  text-align: left;
}
acronym {
  cursor: help;
  border-bottom: 1px solid #777;
}
blockquote {
	margin: 10px;
 	padding: 0 0 0 28px;  
   	border: 1px solid #f2f2f2; 
  	background: #FAFAFA url(quote.gif) no-repeat 5px 5px;    
}
/* form elements */
::placeholder {
  color: #ffffff;
}
label {
	display:block;
	font-weight:bold;
	margin:5px 0;
}
input {
	background: #4f0800;
    outline: none;
    margin: 2px 0px 5px 0px;
    color: #fff;
    border: solid #fff 2px;
    padding: 8px;
}
input.button {
	margin: 0;
    font-weight: bold;
    border: 2px solid #fff;
}
textarea {
	width: 419px;
	padding:2px;
	font: normal 1em Verdana, sans-serif;
	border:1px solid #eee;
	height:100px;
	display:block;
	color:#777;
}
select {
	font: bolder 12px Arial, Sans-serif;
    border: 1px solid #CCC;
    padding: 8px;
	margin-bottom: 5px;
}
form {
	margin:10px auto;
	padding: 0 5px;
}
/* search */
form.search {
	position: absolute;
	top: 35px; right: 25px;
	background: transparent;
	border: none;	
}	
form.search input.textbox {
	margin: 0; padding: 1px 2px;
	width: 120px;
	background: #FFF;
	color: #333; 
}
form.search input.button {
	background: #CCC url(headerbg.gif) repeat-x;
	color: #333;
	border: none;	
	width: 70px; height: 21px;
}

/********************************************
   LAYOUT
********************************************/ 
#wrap {
	width: 1000px;
	margin: 0 auto;
	background: #4f0800 url(/images/Border-Repeat.png) repeat-y;
	box-shadow: 0px 0px 20px 0 rgb(18 11 11);
}
#top-border {
	background: url(/images/Border-Top.png) no-repeat;
    height: 28px;
}
#content-wrap {
	margin: 0 auto;
	background: #4f0800 url(/images/Border-Repeat.png) repeat-y;
	padding: 7px 23px;
	padding-bottom: 0px;
	border-radius: 5px;
}
#content-wrap::after {
  position: absolute;
  width: 100%;
  height: 100%;
  background-image: url('https://i.imgur.com/FU3cYfR.png'); /* Substitua pelo caminho da sua imagem granulada */
  background-blend-mode: overlay;
}
#header {
    width: 970px;
    height: 225px;
    margin: auto;
    overflow: hidden;
    display: flex;
    background: #4f0800 url(/images/Header.png) repeat-y top;
    justify-content: center;
    position: relative;
}

@keyframes Girar {
  0% {
    transform: translateY(0) rotate(0deg);
  }
  50% {
    transform: translateY(-50px) rotate(180deg); /* Altura máxima da onda, ajuste conforme necessário */
  }
  100% {
    transform: translateY(0) rotate(360deg);
  }
}

/* Aplicar a animação à imagem */
#header img {
  animation: Girar 30s linear infinite;
  position: absolute;
  visibility: hidden;
  user-select: none;
  -webkit-user-drag: none;
}

#mestre_pvp {
    width: 264px;
    height: 158px;
    background: #000000ab;
    box-shadow: 0 0 3px 2px #000;
    padding: 0px 0px 4px 4px;
    margin-top: 204px;
    position: absolute;
}
#header h1#logo-text {
	position: absolute;
	margin: 0; padding: 0;
	font: bolder 3.3em 'Trebuchet MS', Arial, Sans-serif;
	letter-spacing: -2px;
	color: #FFF;
	text-transform: none;
	top: 28px; left: 50px;	
}
#header h2#slogan {
	position: absolute;
	margin: 0; padding: 0;
	font: normal .8em 'Trebuchet MS', Arial, Sans-serif;
	text-transform: none;
	color: #FFF;
	top: 74px; left: 58px;	
}

/* Menu */
#menu {
	margin-top: -1px;
	background: url(/images/Menu-Bar.png) no-repeat;
	height: 57px;
}
#menu ul {
	list-style: none;
    padding-top: 11px;
    padding-left: 44px;
	margin: 0;
}
#menu ul li {
	display: inline;
}
#menu ul li a {
	display: block;
	float: left;
	font-size:17px;
	margin: 8px 10px 0px 10px;
	color: #FFF;
	text-decoration: none;
	text-transform: uppercase;
}
#menu ul li a:hover {
	color: #cb1b12; 
}
#menu ul li#current a {	
}
/* Main Column */
#main {
	float:right;
	width: 715px;
	line-height: 23px;
}
.titulo_painel {
	border-bottom: solid 1px #4b4f56;
	margin: 0px 0px 10px 0px;
}
.divisor {
	background-color: #4b4f56;
	width: 60px;height: 3px;
	clear: both;
}
.post-footer {
	margin: 0px 0px 10px 0px;
}
.post-footer .date {
	background: url(clock.gif) no-repeat left center;
	padding-left: 20px; margin: 0 10px 0 5px;
}
.post-footer .comments {
	background: url(comment.gif) no-repeat left center;
	padding-left: 20px; margin: 0 10px 0 5px;
}
.post-footer .readmore {
	background: url(page.gif) no-repeat left center;
	padding-left: 20px; margin: 0 10px 0 5px;
}
/* Sidebars */	
#sidebar {
	width: 23%;
	float: left;
	margin-bottom: 6px;
}	
#sidebar h2 {
	    padding: 1px 7px 2px 7px;
	    font-size: 21px;
	    margin-bottom: 5px;
}
#sidebar .left-box {
	margin-bottom: 30px;
	padding: 0 5px;
}

#sidebar .left-box:last-child {
	margin-bottom: 6px;
}

#sidebar ul.sidemenu {
	list-style: none;
	text-align: left;
	margin: 4px 0 3px 0;
	padding: 0;
	text-decoration: none;
}
#sidebar ul.sidemenu li {
	line-height: 25px;
}

/* Footer */	
#footer {
	color: #f6f7f9;
    background: #0f0b0c url("/images/Border-Foorter.png") no-repeat center top;
    text-align: center;
    font-size: 90%;
    height: 65px;
    clear: both;
    width: 1000px;
    margin: 6px auto;
}
#footer p {padding-top: 35px;margin: 0;}
#footer a { text-decoration: none; }
.float-left  { float: left; }
.float-right { float: right; }
.align-left  { text-align: left; }
.align-right { text-align: right; }
.clear { clear: both; }
.gray { color: #CCC; }
.gauge{margin:0px;padding:0px;overflow:hidden;}
.gauge .top{margin:0px 1px;overflow:hidden;height:1px;background:#b2b2b2;}
.gauge .bottom{margin:0px 1px;overflow:hidden;height:1px;background:#8d8d8d;}
.gauge .content{border-left-width:1px;border-right-width:1px;border-style:none solid;border-left-color:#aaa;border-right-color:#aaa;overflow:hidden;background:#fff;}
.gauge .content .filling{background-color:#39b3d5;}
.gauge .content .remaining{border:1px solid #efefef;overflow:hidden;background-color:#fff;}
/* Virtual vault */
.vaultBox {                
    width: 300px;
    height: 589px;
    background-image: url(vault.png); 
}

.vaultBox #vaultName {                
    position: relative;
    top: 15px;  
    font-family: Tahoma, Geneva, sans-serif;
    font-size: 11px;
    text-align: center;
    color: #fff;
}

.vaultBox ul#itemsVaultGame, ul#itemsVaultVirtual {                   
    position: relative;
    top: 66px;
    left: 25px;               
    list-style: none;
    padding: 0;
    margin: 0;
    overflow: auto;                 
    width: 251px;
    height: 474px;    
}
.vaultBox ul#itemsVaultGame li, ul#itemsVaultVirtual li {                
    width: 96%;
    height: 17px;    
    margin: 0;
    padding-left: 8px;
    color: #fff;
    overflow: hidden;
    list-style: none; 
    background: none;
}
.vaultBox ul#itemsVaultGame li:hover, ul#itemsVaultVirtual li:hover {                
    width: 96%;
    height: 17px;    
    margin: 0;    
    padding-left: 8px;
    color: #000;
    background-color: #FFF;
    overflow: hidden; 
}
.vaultBox ul#itemsVaultGame li:hover, ul#itemsVaultVirtual li:hover {                
    cursor: pointer; 
}
.staffOffline { color:#000000; font-weight:normal; }
.staffOnline { color:#008000; }

/* interface game */
.goldenArcherBox {                
    width: 491px;
    height: 589px;
    background-image: url(goldenarcher/interface.jpg); 
    font: 11px Tahoma,Geneva,sans-serif !important;
}
.goldenArcherBox #goldenArcherName {                
    position: relative;
    top: 15px;  
    font-family: Tahoma, Geneva, sans-serif;
    font-size: 11px;
    text-align: center;
    color: #96FFF0;
    width: 300px;
}
.goldenArcherBox #serialText {                
    height: 300px;
    left: 30px;
    position: relative;
    top: 65px;
    width: 240px;
    text-align: justify;
}
.goldenArcherBox #serialText p {                
    color: #fff;
    font-size: 11px;
    padding: 0px;
    font: Tahoma, Geneva, sans-serif !important;
}
.goldenArcherBox #serialText p.goldText {                
    color: #EAE25B;
    font-size: 11px;
    text-align: center;
}
.goldenArcherBox #serialText p.bold { 
    font-weight: bold;
}
.goldenArcherBox #serialInput {                
    position: relative;
    top: 106px;
    left: 62px;
    width: 174px;
}
.goldenArcherBox #serialInput input {
    background: none repeat scroll 0 0 transparent;
    border: medium none;
    color: #FFFFFF;
    font-size: 12px;
    height: 17px;
    text-align: center;
    width: 168px;
}
.goldenArcherBox #serialCheck {                
    position: relative;
    top: 131px;
    left: 53px;
    width: 193px;
}  
.goldenArcherBox #serialCheck input {
    background: none repeat scroll 0 0 transparent;
    border: medium none;
    color: yellow;
    font-size: 12px;
    height: 31px;
    text-align: center;
    width: 190px;
}
.goldenArcherBox #serialResponse {                
    position: relative;
    top: 151px;
    left: 53px;
    width: 193px;
    text-align: center;  
}
.goldenArcherBox #serialResponse p.yellow{                
    color: yellow;
    font-weight: bold;
}
.goldenArcherBox #serialResponse p.white{                
    color: white; 
    font-weight: bold;
}
table.style
{
	width: 100%;
	margin: 0 auto;
}

table.style *
{
	vertical-align: middle;
}

table.style tr
{
	height: 25px;
}

table.style th
{
	line-height: 25px;
	padding-left: 10px;
}

table.style td
{
	line-height: 25px;
	background: none;
	padding-left: 10px;
}
#Clas {
	background: url(../images/clas.png) no-repeat;
	width: 717px;
	height: 252px;
	overflow: hidden;
	margin-bottom: 20px;
}
#KingS {
	float: left;
	width: 94px;
	height: 20px;
	font-size: 12px;
	text-align: center;
	color: #f5f6f7;
	margin: 145px 0px 0px 87px;
}
#LegendS {
	float: right;
	width: 94px;
	height: 20px;
	font-size: 12px;
	text-align: center;
	color: #f5f6f7;
	margin: 145px 102px 0px 0px;
}
#KingS_Kill {
	width: 95px;
	height: 116px;
	color: #fff;
	font-size: 6px;
	margin: 50px 0px 0px 16px;
	overflow: hidden;
	line-height: 19px;
	float: left;
}
#LegendS_Kill {
	width: 95px;
	height: 116px;
	color: #fff;
	font-size: 6px;
	margin: 50px 21px 0px 0px;
	overflow: hidden;
	line-height: 19px;
	float: right;
}
#KingS_Wins {
	font-size: 12px;
	text-align: center;
	color: #1c1e21;
	width: 46px;
	height: 16px;
	margin-top: -16px;
	margin-left: 456px;
	overflow: hidden;
}
#LegendS_Wins {
	font-size: 12px;
	text-align: center;
	color: #1c1e21;
	width: 46px;
	height: 16px;
	margin-top: 225px;
	margin-left: 195px;
	clear: both;
	overflow: hidden;
}
.rankings_info {
	float: left;
	font-size: 14px;
	width: 168px;
	margin: 0px 5px;
}
#description_server {
	text-align: center;
	padding: 0px 13px;
	font-size: 13px;
	border: solid 2px #838070;
	border-radius: 0.28571429rem;
	box-shadow: 0 1px 11px 4px rgb(73 71 48);
	margin-bottom: 10px;
}
#moneymatch {
	width: 100%;
    height: 300px;
    display: table;
    margin-bottom: 10px;
}
#moneymatch h2 {
	margin: 0;
}
#moneymatch .player {
	width: 200px;
    height: 270px;
    margin: 10px;
    margin-right: 20px;
    float: left;
    border: solid 3px #020202;
    background: #6b6b6b url(/eventos/PVP-Match.jpg) no-repeat;
    box-shadow: 0 1px 10px 0 rgb(18 11 11);
}
#moneymatch .info {
	margin: 6px;
}
.trailer {
   display: table;
   background: #e00000;
   border-radius: 0.6rem;
   margin: 20px auto;
   overflow: hidden;
}
.trailer .title {
   background: rgb(179 0 0);
   padding: 5px 25px;
   color: #fff;
   font-size: 1.25rem;
   font-weight: 700;
   text-transform: uppercase;
   text-align: left;
}
.trailer .video {
   padding: 10px;
}
.quadros table {
	border-spacing: 0;
	width: 100%;
	border: 1px solid #7f0000;
	border-collapse: separate;
	margin-bottom: 1.5em;
}

.quadros table tr:nth-child(even) {
	background: #6d0101;
}

.quadros table td,
.quadros table th {
	padding: .4em;
	text-align: left;
	border-right: 1px solid #7f0000;
}

.quadros table thead th {
	background: #F4F4F4;
	border-right: 1px solid #eee;
	border-bottom: 1px solid #eee;
	text-transform: uppercase;
	padding: 0.7em .4em;
	vertical-align: middle;
}

.quadros table tbody th {
	border-bottom: 1px solid #eee;
}

.quadros table tbody td {
	border-bottom: 1px solid #7f0000;
}

.quadros table tr th:last-child,
.quadros table tr td:last-child {
	border-right: 0;
}

.quadros table tbody tr:last-child td,
.quadros table tbody tr:last-child th {
	border-bottom: 0;
}

.rank_img {
	margin-top: 6px;
	position:absolute;
	user-select: none;
	-webkit-user-drag: none;
}

#main-footer {
	display: inline-block;
	padding: 0 23px;
}

#main-footer h2 {
    margin: 10px auto;
    margin-top: 0;
    padding-top: 0;
}

#youtube-videos {
	width: 100%;
	display: inline-flex;
    flex-wrap: wrap;
    margin: auto;
    justify-content: space-between;
}

.video {
	width: 453px;
    height: 255px;
	background: url(/images/YouTube.png) center center no-repeat;	
    border: solid 7px #ab0909;
    border-radius: 6px;	   
    overflow: hidden;
	margin: 5px;
}

.tv-ao-vivo {
   display: table;
   background: #e00000;
   border-radius: 0.6rem;
   margin: 20px auto;
   overflow: hidden;
}
.tv-ao-vivo .title {
   background: rgb(179 0 0);
   padding: 5px 25px;
   color: #fff;
   font-size: 1.25rem;
   font-weight: 700;
   text-transform: uppercase;
   text-align: left;
}
.tv-ao-vivo .video {
    padding: 5px;
    padding-bottom: 0;
    border: 0;
    width: 100%;
    height: auto;
}

/* Nova Animação */
.animation {
	width: 950px;
    height: 200px;
    position: absolute;
    z-index: 1;
	visibility: hidden;
}

.spark_1 {
    margin-top: 50px;
    filter: hue-rotate(200deg);
    background: url(/images/s-1.png) no-repeat;
    animation: spark_1 8s ease-in-out infinite alternate;
    z-index: 2;
}

@keyframes spark_1 { 
    50% { transform: translate(-50px,-50px) rotate(4deg);}
    100% { transform: translate(50px,-50px) rotate(-4deg) scale(.8);  filter: hue-rotate(0);}
}

.spark_2 {
    margin-top: 50px;   
    filter: hue-rotate(200deg);	 
    background: url(/images/s-2.png) no-repeat;
    animation: spark_2 8s ease-in-out infinite alternate;
    z-index: 2;
}

@keyframes spark_2 { 
    50% { transform: translate(-10px,10px) rotate(-2deg) scale(.9);}
    100% { transform: translate(50px,-50px) rotate(2deg);  filter: hue-rotate(0);}
}

.spark_3 {
    margin-top: 50px;
    filter: hue-rotate(200deg);
    background: url(/images/s-3.png) no-repeat;
    animation: spark_3 8s ease-in-out infinite alternate;
    z-index: 2;
}

@keyframes spark_3 { 
    100% { transform: translate(50px,-50px) rotate(2deg);  filter: hue-rotate(0);}
}