/*!
    
 =========================================================
 * WebEngine CMS
 * https://webenginecms.org/
 =========================================================
 
 * Author Lautaro Angelico (https://lautaroangelico.com/)
 * Copyright (c) 2013-2022 Lautaro Angelico, All Rights Reserved
 
 * Licensed under the MIT license
 * http://opensource.org/licenses/MIT
 
 =========================================================
 
*/
html {
	min-width: 1040px;
	height: 100%;
}

body {
	background: #000000 url('../img/background2.jpg') no-repeat top center;
	color: #6c8989;
	font-family: 'PT Sans', sans-serif;
	font-size: 14px;
	margin: 0;
	height: 100%;
}

@media only screen and (min-width: 2000px) {
	body {
		background: #000000 url('../img/background.jpg') no-repeat top center !important;
	}
}

a {
	color: #97b7b7;
	text-decoration: none;
	-moz-transition: all .2s ease-in;
	-o-transition: all .2s ease-in;
	-webkit-transition: all .2s ease-in;
	transition: all .2s ease-in;
}

a:hover {
	color: #ffda8a;
}

img {
	border: 0px;
}

input[type=text], input[type=password], input[type=number] {
	background: #323232;
	border: 0.5px solid #c48f12;
	color: #FFF;
}
input[type=text]:focus, input[type=password]:focus, input[type=number]:focus {
	border: 1px solid #ccc;
}

#container {
	background: #162020;
	width: 1040px;
	height: auto;
	margin: 0px auto;
	padding: 20px 0px;
	-webkit-border-radius: 5px 5px 0px 0px;
	-moz-border-radius: 5px 5px 0px 0px;
	border-radius: 5px 5px 0px 0px;
	-khtml-border-radius: 5px 5px 0px 0px;
}

#content {
	width: 100%;
	overflow: auto;
	min-height: 500px;
	padding: 10px 20px 0px 20px;
}

.footer {
	background: #1d2a2a;
	font-family: 'Segoe UI', 'Lucida Sans Unicode', 'Lucida Grande', 'Tahoma', 'Arial', 'sans-serif';
	width: 1040px;
	font-size: 12px;
	color: #6c8989;
	padding: 40px;
	overflow: auto;
	margin: 0px auto 100px auto;
	-webkit-border-radius: 0px 0px 5px 5px;
	-moz-border-radius: 0px 0px 5px 5px;
	border-radius: 0px 0px 5px 5px;
	-khtml-border-radius: 0px 0px 5px 5px;
}
	.footer > .footer-container {
		width: 100%;
		margin: 0px auto;
	}
		.footer > .footer-container a:hover {
			text-decoration: underline !important;
		}
	.footer hr {
		border-top: 1px solid #ffffff14;
	}
	.footer .footer-social-link {
		opacity: 0.5;
		transition: all .3s ease;
	}
	.footer .footer-social-link:hover {
		opacity: 1;
	}


#navbar {
    display: flex;
    justify-content: center; /* centra ambos lados del menú */
    align-items: center;
    flex-wrap: nowrap; 
    gap: 30px;
    width: 100%;
    padding: 4px 10px; 
    background: #00000066;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(5px);
    overflow: hidden; 
}


/* --- LISTA --- */
#navbar ul {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap; 
    margin: 0;
    padding: 0;
    list-style: none;
}


.navbar-logo img {
    height: 75px; 
    width: auto;
    margin-top: -6px; 
}

/* --- ÍTEMS --- */
#navbar ul li {
    font-size: 16px;
}

/* --- ENLACES --- */
#navbar ul li a {
    display: block;
    color: #ffffff8f !important;
    text-decoration: none;
    padding: 10px 14px;
    transition: all .3s ease;
    text-transform: uppercase;
    white-space: nowrap; /* evita que el texto del enlace se parta */
}

#navbar ul li a:active, #navbar ul li a:focus, #navbar ul li a:hover {
	color: #ffffff !important;
	text-decoration: none;
}


.navbar-left ul,
.navbar-right ul {
  display: flex;
  gap: 25px;
  list-style: none;
  margin: 0;
  padding: 0;
}


#navbar a {
  color: #ffffff8f !important;
  text-decoration: none;
  text-transform: uppercase;
  transition: all .3s ease;
  font-weight: 500; /* más fuerte */
  letter-spacing: 0.5px;
}

#navbar a:hover {
  color: #ffffff !important;
}

.navbar-social {
  position: fixed;          /* siempre visibles al hacer scroll */
  left: 15px;               /* margen desde el borde izquierdo */
  top: 45%;                 /* los centra verticalmente */
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;   /* íconos uno debajo del otro */
  align-items: center;
  gap: 12px;                /* espacio entre íconos */
  z-index: 1000;            /* encima del fondo */
}

.navbar-social .footer-social-link img {
  width: 48px;
  height: auto;
  opacity: 0.85;
  transition: all 0.3s ease;
}

.navbar-social .footer-social-link:hover img {
  transform: scale(1.15);
  opacity: 1;
  filter: drop-shadow(0 0 6px rgba(255,255,255,0.4));
}


/* --- RESPONSIVE --- */
@media (max-width: 768px) {
    #navbar ul li a {
        padding: 10px 12px;
        font-size: 14px;
    }
}


/* Barra flotante de redes */

.social-bar {
  position: fixed;
  top: 30%;                        
  left: 0;                         
  transform: translateY(-50%);     
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;                       /* espacio entre íconos */
  background: #202020;
  backdrop-filter: blur(8px);      /* efecto vidrio */
  border: 1px solid rgba(196, 143, 18, 0.25);
  box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.3);
  padding: 14px 10px;
  border-radius: 0 16px 16px 0;
  z-index: 9999;
  transition: background 0.3s ease, transform 0.3s ease;
}

.social-bar:hover {
  background: rgba(255, 255, 255, 0.25);
}

/* Íconos dentro de la barra */
.social-bar img {
  width: 40px;
  height: auto;
  transition: transform 0.3s ease, opacity 0.3s ease;
  cursor: pointer;
  opacity: 0.9;
}

.social-bar img:hover {
  transform: scale(1.1);
  opacity: 1;
}

@media (max-width: 768px) {
  .social-bar {
    top: 5% !important;
    transform: translateY(-30%) !important;
  }

  .social-bar a img {
    width: 30px;
    height: 30px;
  }
}

.admincp-button {
	position: absolute;
	top: 10px;
	right: 10px;
	background: #ffffff !important;
	border: 2px solid #000000 !important;
	color: #000000 !important;
	font-weight: bold !important;
}

.page-title {
	color: #1c919d;
	font-family: 'PT Sans', sans-serif;
	font-size: 32px;
	margin-bottom: 10px;
	font-weight: bold;
}

/* NEWS MODULE */
.panel-news {
	margin-bottom: 30px;
	color: #6c8989;
	border: 1px solid #20393a;
	-moz-border-radius: 0px;
	border-radius: 0px;
	-moz-box-shadow: 0 0 0px #e3e3e3;
	-webkit-box-shadow: 0 0 0px #e3e3e3;
	box-shadow: 0 0 0px #000000;
	background: #142526;
	transition: all 0.2s ease-in-out;
}
.panel-news:hover {
	box-shadow: 0px 0px 10px #ffb40038;
}
.panel-news .panel-heading {
	padding: 15px;
}
.panel-news .panel-title {
	color: #ddd;
	font-size: 24px;
	font-weight: bold;
}
.panel-news .panel-body {
	padding: 15px;
}
.panel-news .panel-footer {
	border-top: 0px solid #000000;
	background: #151515;
	font-style: italic;
	font-size: 11px;
	height: 40px;
	color: #FFF;
}

/* RANKINGS MODULE */
.rankings-table {
	width: 100%;
	border-spacing: 0;
	border-collapse: collapse;
}

.rankings-class-image {
	width: 30px;
	height: auto;
	-moz-box-shadow: 0 0 5px #666;
	-webkit-box-shadow: 0 0 5px #666;
	box-shadow: 0 0 5px #0000003b;
	-moz-border-radius: 0px;
	border-radius: 50%;
}
.rankings-table tr td {
	border-bottom: 1px solid #1c919d38;
	padding: 10px;
	font-size: 18px;
	vertical-align: middle !important;
	text-align: center;
}
.rankings-table-place {
	font-weight: bold;
	font-size: 24px;
	text-align: center;
}
.rankings-table tr:first-child td {
	color: #fff;
	border-bottom: 3px solid #c48f12;
}
.rankings-update-time {
	text-align: right;
	font-size: 11px;
	color: #ccc;
	padding: 10px 0px;
}
.rankings_menu {
	width: 100%;
	overflow: auto;
	text-align: center;
	margin-bottom: 10px;
}
.rankings_menu span {
	width: 100%;
	display: inline-block;
	padding: 10px 0px;
	color: #ccc;
	font-size: 24px;
}
.rankings_menu a {
	display: inline-block;
	width: 150px;
	border: 1px solid #c48f12;
	text-align: center;
	padding: 2px 0px;
	margin: 2px;
	background: #282828;
	-moz-border-radius: 2px;
	border-radius: 2px;
	color: var(--text-main);
}
.rankings_menu a.active {
	color: var(--text-main);
	border-color: #c48f12;
}
.rankings_guild_logo tr td {
	border: 0px !important;
	padding: 0px !important;
	margin: 0px !important;
}
.rankings-gens-img {
	width: auto !important;
	height: 30px !important;
	border: 0 !important;
	-moz-box-shadow: 0 0 0px #000 !important;
	-webkit-box-shadow: 0 0 0px #000 !important;
	box-shadow: 0 0 0px #000 !important;
	-moz-border-radius: 0px !important;
	border-radius: 0px !important;
}

/* MY ACCOUNT MODULE */
.myaccount-table {
	width: 100%;
	background: #142526;
	border: 1px solid #20393a;
}
.myaccount-table tr td:first-child {
	color: #ffffff;
	font-weight: bold;
}
.myaccount-table tr td {
	border-bottom: 1px solid #20393a;
	padding: 15px !important;
}
.myaccount-table tr:last-child td {
	border: 0px;
}

/* GENERAL TABLE UI */
.general-table-ui {
	width: 100%;
	table-layout: fixed;
	background: #142526;
	border: 1px solid #20393a;
	padding: 10px;
	margin: 10px 0px;
}
.general-table-ui tr td {
	padding: 5px;
	vertical-align: middle !important;
}
.general-table-ui tr:first-child td {
	color: #1c919d;
}
.general-table-ui tr:nth-child(2n+2) td {
	background: #1d3334;
}
.general-table-ui tr td {
	text-align: center;
}
.general-table-ui img {
	width: 50px;
	height: auto;
	-moz-box-shadow: 0 0 5px #666;
	-webkit-box-shadow: 0 0 5px #666;
	box-shadow: 0 0 5px #00000078;
	-moz-border-radius: 0px;
	border-radius: 50%;
}

.eventos-titulo {
  font-size: 2rem;
  font-weight: normal;
  color: rgba(255, 255, 255, 0.75);
  padding-left: 8px;
  margin: 10px 0 6px 0;
}

/* TERMS OF SERVICE PAGE */
.tos_list li {
	color: #aa0000;
	font-weight: bold;
	font-size: 18px;
	margin-bottom: 40px;
}
.tos_list li p {
	color: #444;
	text-align: justify;
	text-justify: inter-word;
	text-transform: none;
	padding-right: 35px;
	font-size: 14px;
	font-weight: normal;
}

/* PAYPAL */
.paypal-gateway-container {
	width: 100%;
}

.paypal-gateway-content {
	background: #fef2da;
	border: 3px solid #f79433;
	padding: 15px;
	overflow: auto;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	font-weight: bold;
}

.paypal-gateway-logo {
	width: 100%;
	height: 100px;
	background: #fff9ec url('../img/paypal-logo-200-68.png') no-repeat center;
	background-size: contain;
	margin-bottom: 15px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}

.paypal-gateway-conversion-rate {
	margin: 0px auto;
	text-align: center;
	color: #000;
	font-size: 18px;
	padding: 10px 0px;
}

.paypal-gateway-form {
	width: 100%;
	margin: 20px auto;
	text-align: center;
}

.paypal-gateway-form div {
	display: inline-block;
	padding: 0px 10px;
	color: #000;
	font-size: 24px;
}

.paypal-gateway-form input[type=text] {
	width: 60px;
	font-size: 24px;
	border: 3px solid #f79433;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	color: #f79433;
}

.paypal-gateway-continue {
	margin: 0px auto;
	text-align: center;
}

.paypal-gateway-continue input[type=submit] {
	background: url('../img/paypal-submit.jpg') no-repeat;
	width: 200px;
	height: 40px;
	border: 0px;
}

.module-requirements {
	font-size: 12px;
	margin-top: 20px;
}

/* SIDEBAR */
.panel-sidebar {
	background: #142526;
	border: 0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
	-moz-box-shadow: 0 0 10px #e3e3e3;
	-webkit-box-shadow: 0 0 10px #e3e3e3;
	box-shadow: 0 0 10px #00000014;
}

.panel-sidebar > .panel-heading {
	background: #151515;
	color: #1c919d;
	font-family: 'PT Sans', sans-serif;
	border: 0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
	border-bottom: 3px solid #c48f12;
}

.panel-usercp {
}

.panel-usercp ul {
	list-style-type: none;
	padding: 0px;
	margin: 0px;
}

.panel-usercp ul li {
	display: table;
	width: 100%;
	vertical-align: middle;
	line-height: 30px;
}

.panel-usercp ul li a {
	color: #97b7b7 !important;
	font-weight: bold;
}
.panel-usercp ul li a:active, .panel-usercp ul li a:hover {
	color: #1c919d !important;
}

.panel-usercp ul li img {
	position: relative;
	top: -2px;
	width: 25px;
	height: 25px;
	margin-right: 5px;
}

.sidebar-banner {
	margin: 20px 0px;
	border: 0px;
}

.sidebar-banner img {
	-moz-box-shadow: 0 0 10px #e3e3e3;
	-webkit-box-shadow: 0 0 10px #e3e3e3;
	box-shadow: 0 0 10px #00000029;
	border: 0px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	-khtml-border-radius: 5px;
}

/* GENERAL PANEL STYLING */
.panel-general {
	margin-bottom: 30px;
	background: #142526;
	border: 1px solid #20393a;
	-moz-border-radius: 0px;
	border-radius: 0px;
}

.panel-body .panel-title {
	color: #FFF;
	font-family: 'PT Sans', sans-serif;
	font-size: 14px;
	border-bottom: 1px solid #8a6d3b;
	margin-bottom: 20px !important;
	font-weight: bold;
	padding: 0px 0px 10px 0px;
}

/* ADD STATS MODULE */
.panel-addstats {
	margin-bottom: 30px;
	background: #142526;
	border: 1px solid #20393a;
	-moz-border-radius: 0px;
	border-radius: 0px;
}
.panel-addstats .character-avatar img {
	width: 100px;
	height: auto;
	-moz-box-shadow: 0 0 5px #666;
	-webkit-box-shadow: 0 0 5px #666;
	box-shadow: 0 0 20px #00000036;
	-moz-border-radius: 0px;
	border-radius: 50%;
}
.panel-addstats .character-name {
	color: #ffffff;
	font-family: 'PT Sans', sans-serif;
	font-size: 18px;
	border-bottom: 1px solid #ffffff1c;
	padding: 20px 0px;
	margin-bottom: 20px !important;
	font-weight: bold;
}

/* DOWNLOADS */
.panel-downloads {
	margin-bottom: 30px;
	background: #142526;
	border: 1px solid #20393a;
	-moz-border-radius: 0px;
	border-radius: 0px;
}
	.download-description {
		font-size: 11px;
		position: relative;
		top: -7px;
	}

.online-status-indicator {
	margin-left: 5px;
}

/* WEBENGINE CMS */
.webengine-powered { color: #97b7b7 !important; }
.webengine-powered:active, .webengine-powered:hover { color: #bae2e2 !important; }

/* GLOBAL TOP BAR */
.global-top-bar {
	width: 100%;
	background: #101010;
	color: #777777;
	padding: 7px 0px 2px 0px;
	text-transform: uppercase;
	font-size: 12px;
}
	.global-top-bar .global-top-bar-content {
		width: 1040px;
		margin: 0px auto;
	}
		.global-top-bar .global-top-bar-content .row {
			margin: 0px;
			padding: 0px;
		}
	.global-top-bar a.logout {
		color: #ff0000 !important;
	}
	.global-top-bar a {
		color: #999999 !important;
	}
	.global-top-bar a:hover {
		color: #ffffff !important;
	}
.global-top-bar-nopadding {
	padding: 0px !important;
}
.global-top-bar-separator {
	padding: 0px 5px;
}

/* LANGUAGE PICKER */
.webengine-language-switcher {
	display: inline-block;
	list-style: none;
	padding: 0px !important;
	margin: 0px !important;
	width: 46px;
	height: 19px;
	overflow: hidden;
	transition: all .3s ease;
}
.webengine-language-switcher:hover {
	width: 400px;
}
	.webengine-language-switcher li {
		display: inline-block;
		list-style-type: none;
		background: #333333;
		padding: 0px 5px 2px 5px;
		-webkit-border-radius: 3px;
		-moz-border-radius: 3px;
		border-radius: 3px;
		-khtml-border-radius: 3px;
		transition: all .3s ease;
	}
	.webengine-language-switcher li:hover {
		-webkit-filter: brightness(120%);
		filter: brightness(120%);
	}
	.webengine-language-switcher li a {
		color: #999999;
	}
	.webengine-language-switcher li a:hover {
		color: #ffffff !important;
	}

/* WEBSITE LOGO */
.webengine-mu-logo {
	transition: all .3s ease;
}
	.webengine-mu-logo:hover {
		-webkit-filter: brightness(120%);
		filter: brightness(120%);
	}

/* HEADER INFO */

#header {
  width: 100%;
  height: 400px;
  background: url('../img/header-bg.png') center top no-repeat;
  background-size: cover;
}

.header-info-container {
	width: 1040px;
	margin: 0px auto;
	text-align: right;
}
	.header-info-container .header-info {
		display: inline-block;
		width: 350px;
		background: rgba(0, 0, 0, 0.3);
		backdrop-filter: blur(5px);
		margin: 0px;
		padding: 20px;
		overflow: auto;
		-moz-box-shadow: 0 0 15px rgba(0,0,0,0.7);
		-webkit-box-shadow: 0 0 15px rgba(0,0,0,0.7);
		box-shadow: 0 0 15px rgba(0,0,0,0.7);
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
		-khtml-border-radius: 5px;
		text-shadow: 1px 1px 3px #000000;
		color: #ffffff;
		border: 1px solid rgba(255,255,255,0.1);
		font-size: 12px;
	}
		.header-info-container .header-info .header-info-block {
			padding: 0px;
			color: #aaaaaa;
		}
		.header-info-container .header-info .header-info-block #tServerTime, .header-info-container .header-info .header-info-block #tLocalTime {
			color: #ffffff;
		}
		.header-info-container .header-info .header-info-block #tServerDate, .header-info-container .header-info .header-info-block #tLocalDate {
			color: #cccccc;
		}
		.header-info-container .header-info .header-info-block .online-count {
			color: #00ff00;
		}
	
/* ONLINE BAR */
.webengine-online-bar {
	width: 100%;
	background: #000000;
	border: 1px solid #555555;
	height: 8px;
	margin-top: 10px;
	margin-bottom: 10px;
	padding: 0px;
	-webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -khtml-border-radius: 4px;
	overflow: hidden;
	transition: all .3s ease;
}
	.webengine-online-bar .webengine-online-bar-progress {
		height: 8px;
		background: #00ff00 url('../img/online_progress_bar.jpg') no-repeat left center;
		-webkit-border-radius: 0px 1px 1px 0px;
		-moz-border-radius: 0px 1px 1px 0px;
		-khtml-border-radius: 0px 1px 1px 0px;
		border-radius: 0px 1px 1px 0px;
	}
	.webengine-online-bar:hover {
		-webkit-filter: brightness(120%);
		filter: brightness(120%);
	}

/* MY ACCOUNT CHARACTER LIST */
.myaccount-character-block {
	background: #333;
	border: 1px solid #666;
	padding: 5px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	display: inline-block;
	margin: 0px auto;
	-moz-box-shadow: 0 0 10px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0 0 10px rgba(0,0,0,0.5);
	box-shadow: 0 0 10px rgba(0,0,0,0.5);
}
	.myaccount-character-block img {
		width: 100px;
		height: auto;
		-moz-border-radius: 3px;
		-webkit-border-radius: 3px;
		border-radius: 3px;
		-moz-box-shadow: 0 0 5px #000;
		-webkit-box-shadow: 0 0 5px #000;
		box-shadow: 0 0 5px #000;
		-moz-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		-webkit-transition: all 0.3s ease;
		transition: all 0.3s ease;
	}
		.myaccount-character-block img:hover {
			-webkit-filter: brightness(120%);
			filter: brightness(120%);
		}
.myaccount-character-block-location {
	font-size: 12px;
	margin-bottom: 20px;
	margin-top: 2px;
	line-height: 1.2;
}
.myaccount-character-block-level {
	position: relative;
	top: -77px;
	display: inline-block;
	background: rgba(0,0,0,0.5);
	padding: 0px 5px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	color: #fff;
	font-size: 10px;
}
.myaccount-character-name a {
	font-weight: bold;
	font-size: 16px;
}

/* RANKINGS FILTER BY CLASS */

.rankings-class-filter {
	display: inline-block;
	list-style-type: none;
	margin: 20px auto;
	padding: 10px 20px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	-khtml-border-radius: 10px;
}

	.rankings-class-filter li {
		display: inline-block;
		-moz-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		-webkit-transition: all 0.3s ease;
		transition: all 0.3s ease;
		margin-bottom: 10px;
	}
	
	.rankings-class-filter li:hover {
		-webkit-filter: grayscale(0%);
		filter: grayscale(0%);
	}

.rankings-class-filter-selection {
	display: inline-block;
	width: 75px;
	text-align: center;
	color: #6c8989;
	font-size: 11px;
	cursor: pointer;
}

	.rankings-class-filter-selection:hover {
		color: #6c8989 !important;
		opacity: 1;
	}

	.rankings-class-filter-selection:hover img {
		-webkit-filter: brightness(120%);
		filter: brightness(120%);
	}

.rankings-class-filter-selection img {
	width: 40px;
	height: auto;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	-khtml-border-radius: 50%;
	margin-bottom: 5px;
	-moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
	-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.45);
	-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.45);
	box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.45);
}

.rankings-class-filter-grayscale {opacity: 0.4;}

/* Home - News List */

.home-news-block {
	
}

.home-news-block .home-news-block-header h2 {
	padding: 0px !important;
	margin: 0px 0px 20px 0px !important;
	font-style: italic;
}

.home-news-block .home-news-block-header a {
	display: inline-block;
	padding-top: 5px;
	font-style: italic;
	font-size: 16px;
}

.home-news-block-article {
	margin-top: 10px;
}

.home-news-block-article .home-news-block-article-type {
	display: block;
	border: 1px solid #694c07;
	padding: 5px;
	text-align: center;
	color: #FFF;
	font-weight: bold;
}

.home-news-block-article .home-news-block-article-title-container {
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.home-news-block-article .home-news-block-article-title, .home-news-block-article .home-news-block-article-date {
	line-height: 30px;
}

/* Event Timer Block */

.event-schedule-open {
	color: green;
}

.event-schedule-inprogress {
	color: orange;
}

.panel-sidebar-events .smalltext {
	font-size: 11px;
	position: relative;
	top: -5px;
}

/* === BREAKMU THEME ADAPTADO A LA WIKI === */

:root {
  --color-primary: #ddd; /* Textos y titulos en blanco */
  --bg-panel: rgba(30, 30, 30, 0.6);
  --bg-panel-dark: rgba(20, 20, 20, 0.65);
  --bg-highlight: rgba(255, 255, 255, 0.05);
  --text-main: #ddd;
  --text-muted: #aaa;
}

/* CONTENEDOR PRINCIPAL */
#container {
  background: var(--bg-panel);
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.45);
  border-radius: 10px 10px 0 0;
  color: var(--text-main);
}

/* TEXTOS GENERALES */
body, p, td {
  color: var(--text-main);
  line-height: 1.6;
}
.page-title, h1, h2, h3, h4, h5 {
  color: var(--color-primary);
  text-shadow: 0 0 8px rgba(255, 180, 0, 0.3);
  letter-spacing: 0.5px;
}

/* LINKS */
a {
  color: var(--color-primary);
  transition: all 0.2s ease-in-out;
}
a:hover {
  color: #fff;
  text-shadow: 0 0 8px rgba(255, 180, 0, 0.5);
}

/* NAVBAR */
#navbar {
  background: rgba(15, 15, 15, 0.65);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
#navbar ul li a {
  color: #ddd !important;
  transition: color 0.2s ease;
}
#navbar ul li a:hover {
  color: var(--color-primary) !important;
  text-shadow: 0 0 8px rgba(255, 180, 0, 0.4);
}

/* PANELS */
.panel-news,
.panel-general,
.panel-sidebar,
.panel-addstats,
.panel-downloads {
  background: rgba(0,0,0,.5);
  border: 1px solid rgba(255, 255, 255, 0.05);
  border-radius: 8px;
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.4);
  color: var(--text-main);
}

.panel-heading, .panel-title {
  color: #FFF;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

/* TABLAS */
table {
  border-collapse: collapse;
  width: 100%;
}
table thead th {
  background: rgba(15, 15, 15, 0.75);
  color: #fff;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
table tbody tr {
  transition: background 0.25s ease;
}
table tbody tr:hover {
  background: #694c07;
}

.eventos-table {
  width: 80%;              
  max-width: 700px;        
  margin: 20px 0;         
  table-layout: fixed;     
  word-wrap: break-word;   
  margin-left: 0px; 
}

/* BOTONES 
button,
input[type=submit],
input[type=button],
.btn {
  background: linear-gradient(145deg, #ffb400, #d4a300);
  border: none;
  color: #000;
  font-weight: bold;
  padding: 10px 20px;
  border-radius: 6px;
  transition: all 0.25s ease-in-out;
}
button:hover,
input[type=submit]:hover,
input[type=button]:hover,
.btn:hover {
  background: linear-gradient(145deg, #ffd866, #ffb400);
  transform: translateY(-2px);
  box-shadow: 0 0 10px rgba(255, 180, 0, 0.4);
}

*/

/* FOOTER */
.footer {
  background: rgba(25, 25, 25, 0.7);
  color: var(--text-muted);
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.6);
}


/* ELEMENTOS DESTACADOS */
.highlight-box {
  background: rgba(255, 255, 255, 0.05);
  border-left: 3px solid var(--color-primary);
  padding: 1rem;
  border-radius: 8px;
  margin: 1rem 0;
  color: var(--text-main);
}

/* ANIMACIÓN SUAVE */
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}
.panel-news, .panel-general, .highlight-box {
  animation: fadeInUp 0.6s ease both;
}




/* GUIAS, EVENTOS, INVASIONES, Y REGLAS DESDE ACA HACIA ABAJO */

/* === BLOQUE DESCRIPTIVO (TEXTO INTRODUCTORIO) === */
.descripcion {
  background: rgba(25, 25, 25, 0.55);
  border-left: 3px solid #d4af37;
  border-radius: 8px;
  padding: 20px;
  color: #ddd;
  margin-bottom: 30px;
  line-height: 1.5em;
}


/* --- Estilos específicos para la página de Reglas --- */

.reglas-container {
  max-width: 900px;
  margin: 2rem auto;
  padding: 2rem;
  background: rgba(30, 30, 30, 0.6);
  border-radius: 10px;
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.4);
  color: #ddd;
  font-size: 1rem;
  line-height: 1.6;
}

.titulo-reglas {
  color: var(--color-primary, #ffb400);
  font-size: 2rem;
  letter-spacing: 1px;
}

.bloque-reglas {
  margin-bottom: 2rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.titulo-seccion {
  font-size: 1.4rem;
  color: #ffb400;
  margin-bottom: 1rem;
}

.lista-reglas {
  list-style: none;
  padding-left: 1.2rem;
}

.lista-reglas li {
  position: relative;
  margin-bottom: 0.8rem;
  padding-left: 1.5rem;
}

.lista-reglas li::before {
  content: "•";
  color: var(--color-primary, #ffb400);
  position: absolute;
  left: 0;
  font-weight: bold;
}

.lista-reglas li strong {
  color: #fff;
}

.lista-reglas .nota {
  background: rgba(255, 180, 0, 0.1);
  border-left: 3px solid #ffb400;
  padding: 0.6rem 1rem;
  border-radius: 5px;
}

.aclaracion {
  margin-top: 2rem;
  text-align: center;
  background: rgba(255, 255, 255, 0.05);
  padding: 1rem;
  border-radius: 8px;
  font-size: 0.95rem;
}

.aclaracion h4 {
  color: #ffb400;
  margin-bottom: 0.5rem;
}



/* --- BLOOD CASTLE STYLES (Break MU Wiki) --- */

.titulo-evento {
  color: var(--color-primary, #ffb400);
  font-size: 2rem;
  text-transform: uppercase;
  letter-spacing: 1px;
  text-shadow: 0 0 8px rgba(255, 180, 0, 0.4);
}

.evento-container {
  max-width: 950px;
  margin: 2rem auto;
  padding: 2rem;
  background: rgba(25, 25, 25, 0.6);
  border-radius: 12px;
  box-shadow: 0 0 25px rgba(0, 0, 0, 0.4);
  color: #ddd;
  font-size: 1rem;
  line-height: 1.6;
}

/* --- Intro --- */
.intro-evento {
  text-align: center;
  margin-bottom: 2rem;
}

.evento-npc {
  width: 15%;
}

.evento-imagen {
  width: 100%;
  max-width: 650px;
  border-radius: 10px;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.evento-imagenchaos {
  width: 10%;
  max-width: 650px;
  border-radius: 10px;
  box-shadow: 0 0 15px rgba(255, 180, 0, 0.1);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.evento-imagen3 {
  width: 50%;
  max-width: 650px;
  border-radius: 10px;
  box-shadow: 0 0 15px rgba(255, 180, 0, 0.1);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}


.evento-imagen:hover {
  transform: scale(1.03);
/*  box-shadow: 0 0 25px rgba(255, 180, 0, 0.25); */
}

.evento-imagen3:hover {
  transform: scale(1.03);
/*  box-shadow: 0 0 25px rgba(255, 180, 0, 0.25); */
}


.evento-info h4 {
  color: #ffb400;
  font-size: 2rem;
  margin-top: 1rem;
}

.evento-info span {
  color: #fff;
}

/* --- Requisitos --- */

.evento-acceso h4 {
  color: #ffb400;
  font-size: 1.1rem;
  margin: 1.5rem 0;
  text-align: center;
}

.evento-acceso .subtitulo {
  color: #FFF;
  font-size: 2rem;
  margin-bottom: 1rem;
}

.lista-acceso {
  list-style: none;
  margin: 1rem 0;
  padding-left: 1.2rem;
}

.lista-acceso li::before {
  content: "•";
  color: #ffb400;
  font-weight: bold;
  margin-right: 6px;
}

/* --- Recompensas --- */
.evento-recompensas {
  margin-top: 2rem;
}

.evento-recompensas .titulo {
  text-align: center;
  color: #FFF;
  font-size: 3rem;
  margin-bottom: 2rem;
}

.evento-recompensas .premio {
  color: #FFF;
  font-size: 1.6rem;
  margin-bottom: 0.7rem;
  margin-top: 2rem;
  font-weight: 600;
}

.evento-recompensas .horario {
  text-align: center;
  color: #ffb400;
  font-size: 1.7rem;
  margin-bottom: 1.5rem;
  margin-top: 1rem;
}

/* solo para skeleton, ww, rd, y blessings */
.evento-recompensas-boss {
  max-width: 600px; 
  margin-left: auto;
  margin-right: auto;
}




.evento-recompensas-boss .recompensa-card img {
  padding-top: 3rem; 
}

/* --- layout a 3 por fila y centrado del último --- */
.evento-recompensas-tier-centered .recompensa-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center; 
  gap: 1.5rem;             
  padding: 0;              
  box-sizing: border-box
}

/* cada tarjeta ocupa (creo) 1/3 del ancho disponible */
.evento-recompensas-tier-centered .recompensa-card {
  flex: 0 0 calc((100% - (2 * 1.5rem)) / 3);
  max-width: calc((100% - (2 * 1.5rem)) / 3);
  box-sizing: border-box;
}

/* responsive cuando el ancho baja, pasar a 2 por fila */
@media (max-width: 900px) {
  .evento-recompensas-tier-centered .recompensa-card {
    flex: 0 0 calc((100% - 1.5rem) / 2);
    max-width: calc((100% - 1.5rem) / 2);
  }
}


/* Contenedor de imágenes dentro del bloque de acceso */
.illusion-imagenes {
  display: flex;
  justify-content: center;  /* centra las dos imágenes horizontalmente */
  align-items: flex-start;
  gap: 1.5rem;              /* separación entre ellas */
  flex-wrap: wrap;          /* permite que bajen una debajo de otra en pantallas chicas */
  margin-top: 1rem;
}

/* Imágenes iguales y más pequeñas */
.illusion-imagen {
  max-width: 44%;   /* cada una ocupa menos de la mitad del ancho */
  height: auto;     /* mantiene proporciones */
  border-radius: 8px;
  object-fit: cover;
}

/* celus 1 por fila */
@media (max-width: 520px) {
  .evento-recompensas-tier-centered .recompensa-card {
    flex: 0 0 100%;
    max-width: 100%;
  }
}

.recompensa-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 1.5rem;
  justify-content: center;
}

.recompensa-card {
  background: #101010;
  border-radius: 10px;
  box-shadow: 0 0 12px rgba(0, 0, 0, 0.5);
  padding: 1rem;
  text-align: center;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.recompensa-card .subtitulo {
  text-align: center;
  color: #FFF;
  font-size: 2rem;
  margin-bottom: 2rem;
}

.recompensa-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 0 20px rgba(255, 180, 0, 0.1);
}

.recompensa-card img {
  width: 50%;
  max-width: 180px;
  border-radius: 6px;
  margin-bottom: 0.6rem;
  padding-top: 2rem;
}

.recompensa-card h4 {
  color: #ffb400;
  font-size: 2rem;
  margin: 0.3rem 0;
  text-shadow: none;
}

.recompensa-card ul {
  list-style: none;
  padding: 0;
  margin: 0.5rem 0;
}

.recompensa-card ul li {
  font-size: 1.6rem;
}

.requisito {
  color: #aaa;
  font-size: 1.3rem;
  margin-top: 0.4rem;
  font-style: italic;
}

hr.divider {
  border: none;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  margin: 1.5rem 0;
}

/* Sutil animación al entrar los bloques */
.recompensa-card,
.evento-acceso,
.intro-evento {
  animation: fadeIn 0.8s ease both;
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

/* --- Estilo general para eventos e invasiones --- */
.titulo-evento {
  color: #ffb400;
  font-size: 2.2rem;
  font-weight: 700;
  text-shadow: 0 0 15px rgba(255, 180, 0, 0.4);
  margin-top: 1rem;
}

/*
.titulo-seccion {
  color: #ffb400;
  font-size: 1.5rem;
  margin: 1rem 0;
  text-transform: uppercase;
  letter-spacing: 1px;
  text-shadow: 0 0 10px rgba(255, 180, 0, 0.3);
}
*/


.contenido-evento {
  color: #ddd;
  max-width: 900px;
  margin: 0 auto;
  text-align: justify;
  line-height: 1.6;
}

.grid-mobs {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 1.2rem;
  padding: 1rem 0;
  justify-items: center;
}

.mob-card {
  overflow: hidden;
  background: rgba(20, 20, 20, 0.65);
  border: 1px solid rgba(255, 180, 0, 0.15);
  border-radius: 10px;
  box-shadow: 0 0 10px rgba(255, 180, 0, 0.1);
  text-align: center;
  padding: 1rem;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  width: 220px;
}

.mob-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 0 20px rgba(255, 180, 0, 0.25);
}

.mob-card img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover; /* ajusta la imagen sin deformarla */
  border-radius: 8px;
  margin: 0 auto 0.6rem auto;
  max-height: 180px; /* opcional: limita la altura si son imágenes muy grandes */
}

.mob-card h5 {
  color: #ffb400;
  font-weight: bold;
  margin: 0.3rem 0;
}

.mob-card p {
  color: #ccc;
  font-size: 0.9rem;
  line-height: 1.4;
}

.evento-imagen, .recompensa-card img {
  max-width: 100%;
  height: auto;
}

/* --- INDEX --- */
.redes-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
  margin-top: 20px;
}

.social-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  color: #fff;
  background: rgba(36, 36, 36, 0.7);
  border-radius: 10px;
  padding: 20px 25px;
  width: 150px;
  transition: all 0.3s ease;
  font-weight: 600;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
}

.social-card i {
  font-size: 30px;
  margin-bottom: 10px;
}

.social-card:hover {
  transform: translateY(-5px);
  background: rgba(80, 80, 80, 0.8);
}

/* Colores de cada red */
.social-card.discord { color: #7289da; }
.social-card.youtube { color: #ff4444; }
.social-card.whatsapp { color: #25d366; }
.social-card.twitch { color: #9146ff; }
.social-card.facebook { color: #1877f2; }

.titulo-evento {
  font-size: 1.8em;
  margin-bottom: 10px;
  color: #eee;
}

.intro-evento p {
  font-size: 1.05em;
  line-height: 1.6;
  color: #ddd;
  text-align: center;
  max-width: 800px;
  margin: auto;
}

/* Opcionales: límites razonables para imágenes de cabecera y tarjetas */
.evento-imagen {
  max-width: 700px !important;  /* ajustar si querés más/menos */
  width: 100% !important;
}

.recompensa-card img,
.boss img,
.boss2 img,
.boss3 img {
  max-width: 260px !important;  /* tamaño de miniaturas / mobs */
  width: 100% !important;
  height: auto !important;
}


/* === CONTENEDOR PRINCIPAL DE LA SECCIÓN === */
.caracteristicas-container {
  background: rgba(36, 36, 36, 0.55);
  border-radius: 12px;
  padding: 30px 40px;
  margin: 40px auto;
  width: 90%;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.45);
}

/* === SECCION CARACTERISTICAS === */

/* === TÍTULO PRINCIPAL === */
.caracteristicas-container h2 {
  color: #fff;
  text-align: center;
  font-size: 1.6rem;
  text-shadow: 0 0 10px rgba(255, 255, 255, 0.15);
  letter-spacing: 0.5px;
  margin-bottom: 25px;
}

/* === BLOQUE DESCRIPTIVO (TEXTO INTRODUCTORIO) === */
.descripcion {
  background: rgba(25, 25, 25, 0.55);
  border-left: 3px solid #d4af37; /* dorado */
  border-radius: 8px;
  padding: 20px;
  color: #ddd;
  margin-bottom: 30px;
  line-height: 1.5em;
}

/* === TABLAS === */

/* Hover dorado */
table tbody tr:hover {
  background: rgba(212, 175, 55, 0.15);
  transition: background 0.25s ease-in-out;
}

/* Encabezados coherentes */
table thead th {
  color: #fff;
  background: rgba(70, 70, 70, 0.75);
  font-weight: 600;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

/* Título sobre las tablas */
.titulo-tabla,
.titulo-tabla2 {
  color: #fff;
  text-align: center;
  font-size: 1.3rem;
  margin-bottom: 15px;
  border-bottom: 2px solid rgba(255, 255, 255, 0.15);
  padding-bottom: 5px;
}

/* Pequeño detalle de sombra dorada al pasar el mouse sobre títulos */
.titulo-tabla:hover,
.titulo-tabla2:hover {
  text-shadow: 0 0 8px rgba(212, 175, 55, 0.5);
}

/* TERMS OF SERVICE */
.license-container h1 {
    font-size: 2.2rem;
    margin: 30px 0 15px;
    font-weight: 600;
    color: #dedede;
    text-align: center;
}

/* Subtítulos */
.license-container h2 {
    font-size: 1.7rem;
    margin-top: 25px;
    margin-bottom: 10px;
    font-weight: 500;
    color: #cfcfcf;
}