@charset "utf-8";
/* CSS Document */

.label-success {
    background-color: #5cb85c
}
.label-success[href]:hover,
.label-success[href]:focus {
    background-color: #449d44
}

body
{
    background: #191919 url('../../images/rewar/background.png') no-repeat fixed center;
    background-size: 100% 100%;
    min-height: 100vh; 
	margin: 0px;
	padding: 0px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #7E7E7E;	
}

#message {
    font-size: 32px;
    margin-bottom: 30px;
}

#countdown {
    font-size: 40px;
    font-weight: bold;
}

a
{
	font-weight: bold;
	color: #D5D5D5;
	text-decoration: none;
}

a:hover
{
	color: #FFFFFF;
}

#online
{
	font-size: 11px;
	width: auto;
	height: 20px;
	padding-top: 0;
	padding-left: 0;
	flex: 0 0 auto;
}

#page
{
	width: 1500px;
	margin: auto;
}

#header
{
	width: 1500px;
	height: auto;
	min-height: 241px;
	position: relative;
	margin: 0 auto;
	background: url('../../images/rewar/stopka.png') no-repeat center top;
	background-size: contain;
	overflow: hidden;
}

#header::after
{
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 80px;
	pointer-events: none;
}

.header-ornament
{
	position: absolute;
	bottom: 0;
}

.header-ornament-left
{
	left: -10px;
	transform: scaleX(-1);
}

.header-ornament-right
{
	right: 10px;
}

#logo
{
    margin: auto;	
	width: 900px;
	height: 240px;
	position: relative;
	background: url('images/ariva.gif') no-repeat;
}

#logo-link
{
	display: block;
	width: 100%;
	height: 100%;
	cursor: pointer;
}

#panel
{
	width: 1200px;
	height: 175px;
	position: relative;
	background: url('images/panell.png') no-repeat;
	background-size: 100% auto;
	background-position: center top;
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
}

#panel-inner
{
	width: 100%;
	max-width: 1200px;
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
}

.panel-info
{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 60px;
	width: 100%;
	margin-top: 15px;
}

.panel-item
{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
}

.panel-label
{
	color: #8B7355;
	font-size: 11px;
	font-weight: bold;
	letter-spacing: 1px;
	text-transform: uppercase;
	font-family: 'Martel Sans', Arial, sans-serif;
}

.panel-value
{
	color: #D4AF37;
	font-size: 18px;
	font-weight: bold;
	font-family: 'Martel Sans', Arial, sans-serif;
	text-shadow: 0 0 5px rgba(212, 175, 55, 0.5);
}

.status-on
{
	color: #4CAF50;
	text-shadow: 0 0 8px rgba(76, 175, 80, 0.6);
}

.status-off
{
	color: #F44336;
	text-shadow: 0 0 8px rgba(244, 67, 54, 0.6);
}

.panel-divider
{
	width: 2px;
	height: 50px;
	background: linear-gradient(to bottom, transparent, #8B7355, transparent);
	opacity: 0.5;
}

.panel-search-form
{
	display: flex;
	gap: 5px;
	align-items: center;
}

.panel-search-input
{
	width: 150px;
	height: 28px;
	background: rgba(20, 20, 20, 0.8);
	border: 1px solid #8B7355;
	border-radius: 3px;
	color: #D4AF37;
	font-size: 12px;
	padding: 0 10px;
	font-family: 'Martel Sans', Arial, sans-serif;
	outline: none;
	transition: all 0.3s;
}

.panel-search-input::placeholder
{
	color: #6B5345;
}

.panel-search-input:focus
{
	border-color: #D4AF37;
	box-shadow: 0 0 8px rgba(212, 175, 55, 0.3);
}

.panel-search-button
{
	height: 28px;
	padding: 0 15px;
	background: linear-gradient(to bottom, #8B7355, #6B5345);
	border: 1px solid #5B4335;
	border-radius: 3px;
	color: #D4AF37;
	font-size: 11px;
	font-weight: bold;
	cursor: pointer;
	font-family: 'Martel Sans', Arial, sans-serif;
	transition: all 0.3s;
}

.panel-search-button:hover
{
	background: linear-gradient(to bottom, #9B8365, #7B6355);
	box-shadow: 0 0 10px rgba(212, 175, 55, 0.4);
}

#container-main
{
	width: 1500px;
	margin: 0 auto;
	position: relative;
	display: flex;
	justify-content: center;
	align-items: flex-start;
}

#menu
{
	width: 193px;
	position: relative;
	flex: 0 0 auto;
	padding: 10px 0;
	background: rgba(10, 10, 10, 0.75);
	border: 1px solid rgba(130, 95, 60, 0.5);
	box-shadow: 0 0 18px rgba(0, 0, 0, 0.7), inset 0 0 10px rgba(0, 0, 0, 0.6);
}

#menuu {
  position: fixed;
  right: 0;
  top: 50%;
  width: 8em;
  margin-top: -2.5em;
}

#content
{
	width: 963px;
	position: relative;
	flex: 0 0 auto;
	left: 3px;
}

#panels
{
	width: 190px;
	position: relative;
	flex: 0 0 auto;
}

.content-box-top
{
	width: 963px;
	height: 100px;
	position: relative;
	background: url('images/content-box-toppr.png') no-repeat;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	font-family: 'Martel Sans', Arial, sans-serif;
	font-size: 18px;
	font-weight: 700;
	letter-spacing: 0.6px;
	text-transform: uppercase;
	color: #d8c29a;
	text-shadow: 0 1px 0 #000, 0 0 8px rgba(0, 0, 0, 0.75);
}

.content-box-top img
{
	display: block;
	max-height: 34px;
}

.content-box-toper
{
	width: 963px;
}

.content-box-toper img
{
	display: block;
	width: 963px;
	height: auto;
}

.content-box-mid
{
	width: 963px;
	position: relative;
	background: url('images/content-box-middr.png') repeat-y;
}

	.content-box-mid .separator-big
	{
		width: 963px;
		height: 9px;
		background: url('images/separator.jpg') no-repeat center;
	}

	.content-box-mid .header
	{
		width: 943px;
		padding: 10px;
		background: url('images/content-separator.jpg') no-repeat center bottom;
	}

	.content-box-mid .header h2
	{
		margin: 0px;
		padding: 0px;
	}

	.content-box-mid .padding
	{
		width: 923px;
		padding: 20px;
	}

.content-box-bot
{
	width: 963px;
    height: 50px;
    left: -1px;
	position: relative;
	background: url('images/bottom.png') no-repeat;
}

.content-box-footer
{
	width: 923px;
	position: relative;
	padding: 20px;
	text-align: center;
}

.top5-row .top5-cell
{
	padding: 0;
	background: url('images/high_scroe.png') no-repeat left center;
	background-size: 185px 85px;
	height: 85px;
}

.top5-entry
{
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 8px 10px;
}

.top5-outfit
{
	display: block;
	width: 64px;
	height: 64px;
}

.top5-text
{
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.top5-name
{
	font-size: 15px;
	font-weight: bold;
	color: #e7e0cf;
	text-shadow: 0 1px 0 #000, 0 0 6px rgba(0, 0, 0, 0.7);
}

.top5-level
{
	font-size: 13px;
	color: #c8b79a;
	text-shadow: 0 1px 0 #000, 0 0 6px rgba(0, 0, 0, 0.6);
}

#menu .button
{
	width: 193px;
	height: 75px;
	position: relative;
	background: url('images/menu-button.png') no-repeat;
	overflow: hidden;
	margin-bottom: 6px;
}

#menu .submenu
{
	width: 193px;
	position: relative;
}

#menu .submenu ul
{
	list-style: none;
	padding: 0px;
	margin: 0px;
}

#menu .submenu .menu-item,
#menu .submenu .menu-item-active,
#menu .submenu .menu-item-last,
#menu .submenu .menu-item-last-active
{
	display: block;
	width: 193px;
	height: 29px;
	line-height: 29px;
	padding: 0 0 0 38px;
	box-sizing: border-box;
}

#menu .submenu .menu-item
{
	background: url('images/menu-link.png') no-repeat;
}

#menu .submenu .menu-item:hover
{
	background: url('images/menu-link-hovered.png') no-repeat;
	box-shadow: inset 0 0 12px rgba(46, 255, 126, 0.35), 0 0 8px rgba(46, 255, 126, 0.45);
}

#menu .submenu .menu-item-active
{
	background: url('images/menu-link-active.jpg') no-repeat;
}

#menu .submenu .menu-item-active:hover
{
	background: url('images/menu-link-active-hovered.jpg') no-repeat;
	box-shadow: inset 0 0 12px rgba(46, 255, 126, 0.35), 0 0 8px rgba(46, 255, 126, 0.45);
}

#menu .submenu .menu-item-last-active
{
	background: url('images/menu-link-last-active.jpg') no-repeat;
}

#menu .submenu .menu-item-last-active:hover
{
	background: url('images/menu-link-last-active-hovered.jpg') no-repeat;
	box-shadow: inset 0 0 12px rgba(46, 255, 126, 0.35), 0 0 8px rgba(46, 255, 126, 0.45);
}

#menu .submenu .menu-item-last
{
	background: url('images/menu-link.png') no-repeat;
}

#menu .submenu .menu-item-last:hover
{
	background: url('images/menu-link-hovered.png') no-repeat;
	box-shadow: inset 0 0 12px rgba(46, 255, 126, 0.35), 0 0 8px rgba(46, 255, 126, 0.45);
}

.menu-item a, .menu-item-active a, .menu-item-last a, .menu-item-last-active a
{
	display: block;
	line-height: 29px;
	color: #a49d9d;
	text-decoration: none;
	font-weight: bold;
}

#menu .button .status
{
	width: 16px;
	height: 34px;
	background-repeat: no-repeat;
	position: absolute;
	left: 6px;
	top: 8px;
	pointer-events: none;
}

#menu .button .icon
{
	width: 37px;
	height: 34px;
	background-repeat: no-repeat;
	position: absolute;
	left: 24px;
	top: 28px;
	pointer-events: none;
}

#menu .button .name
{
	width: 140px;
	height: 34px;
	background-image: url(images/menu/community.png);
	background-repeat: no-repeat;
	background-position: center center;
	position: absolute;
	left: 55px;
	top: 60%;
	transform: translateY(-50%);
	pointer-events: none;
}

.lampa-left
{
	width: 1000px;
	height: 150px;
	position: center;
	background: url('images/logo.jpg') no-repeat;
        background-size: cover;
        border-radius: 10px;
}


#panel-padding-left
{
	width: auto;
	padding-left: 0;
	padding-top: 0;
	float: none;
	flex: 1 1 auto;
}


#caly_blok 
{
  position:right;
  width:300px;
  height:200px;
  margin:0 auto;
  border:1px solid #000;
  background-color:#AAA;
}

#panel-padding-right
{
	width: auto;
	padding-right: 0;
	padding-top: 0;
	float: none;
	flex: 0 0 auto;

}

.column {
  float: left;
  width: 50%;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

#events
{
	border: 1px solid green;
}

.search_character
{
	width: 152px;
	height: 36px;
	float: left;
	background: url('images/search_character.png') no-repeat;
}

.events
{
	border: 1px solid orange;
}

.search_char_input
{
	width: 183px;
	height: 26px;
	float: left;
	background: url('images/search_field.png') no-repeat;
	border: 0px;
	color: #565353;
	font-weight: bold;
	padding-left: 20px;
	padding-top: 10px;
	padding-right: 20px;
}

.search_char_button
{
	width: 38px;
	height: 36px;
	float: left;
	background: url('images/search_button.png') no-repeat;
	border: 0px;
}

.server_status
{
	width: 120px;
	height: 36px;
	float: right;
	background: url('images/server_status.png') no-repeat;
}

.status-online
{
	width: 76px;
	height: 36px;
	float: right;
	background: url('images/online.png') no-repeat;
}

.status-offline
{
	width: 76px;
	height: 36px;
	float: right;
	background: url('images/offline.png') no-repeat;
}

.uptime
{
	width: 88px;
	padding-left: 35px;
	padding-top: 10px;
	height: 26px;
	float: right;
	text-align: right;
	background: url('images/uptime.png') no-repeat left;
}

.newcomer
{
	width: 190px;
	height: 142px;
	position: relative;
	background: url('images/newcomer-box.jpg') no-repeat;
}

.premium
{
	width: 190px;
	height: 142px;
	margin-top: 10px;
	position: relative;
	background: url('images/premium-box.jpg') no-repeat;
}

.polls
{
	width: 190px;
	height: 142px;
	margin-top: 10px;
	position: relative;
	background: url('images/poll-box.jpg') no-repeat;
}

input[type=submit] {
	background-color: #444444;
	color: black;
	padding: 6px;
	font-weight: bold;
	cursor:pointer;
}

input[type=submit]:hover {
	background-color: #343434;
}

/* Chat containers */
.container {
  border: 2px solid #dedede;
  background-color: #f1f1f1;
  border-radius: 5px;
  padding: 10px;
  margin: 10px 0;
}

/* Darker chat container */
.darker {
  border-color: #ccc;
  background-color: #ddd;
}

/* Clear floats */
.container::after {
  content: "";
  clear: both;
  display: table;
}

/* Style images */
.container img {
  float: left;
  max-width: 60px;
  width: 100%;
  margin-right: 20px;
  border-radius: 50%;
}

/* Style the right image */
.container img.right {
  float: right;
  margin-left: 20px;
  margin-right:0;
}

/* Style time text */
.time-right {
  float: right;
  color: #aaa;
}

/* Style time text */
.time-left {
  float: left;
  color: #999;
}

@media (max-width: 768px) {
    #message, #countdown {
        font-size: 24px;
    }

    .text {
        font-size: 18px;
    }
}

@media (max-width: 480px) {
    #message, #countdown {
        font-size: 20px;
    }

    .text {
        font-size: 16px;
    }
}

/* Boosted Monster */
.boosted-monster-box {
    background: rgba(10, 10, 10, 0.8);
    border: 1px solid rgba(130, 95, 60, 0.6);
    border-radius: 4px;
    margin-bottom: 8px;
    overflow: hidden;
    box-shadow: 0 0 6px rgba(0, 0, 0, 0.5);
}

.boosted-monster-header {
    background: rgba(50, 40, 25, 0.9);
    color: #d4a843;
    font-family: 'Martel Sans', sans-serif;
    font-size: 14px;
    font-weight: bold;
    text-align: center;
    padding: 6px 0;
    letter-spacing: 1px;
    border-bottom: 1px solid rgba(130, 95, 60, 0.4);
}

.boosted-monster-content {
    display: flex;
    align-items: center;
    padding: 10px 12px;
    gap: 12px;
}

.boosted-monster-img {
    width: 64px;
    height: 64px;
    object-fit: contain;
    flex-shrink: 0;
    filter: drop-shadow(0 0 4px rgba(50, 205, 50, 0.4));
}

.boosted-monster-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.boosted-monster-name {
    color: #55dd55;
    font-family: 'Martel Sans', sans-serif;
    font-size: 15px;
    font-weight: bold;
    text-shadow: 0 0 6px rgba(50, 205, 50, 0.3);
}

.boosted-monster-bonus {
    color: #ccccaa;
    font-family: 'Martel Sans', sans-serif;
    font-size: 12px;
}
}