@font-face
{
  font-family: 'Amaranth';
  font-style: normal;
  font-weight: 400;
  src: url('/core/fonts/amaranth-v18-latin-regular.woff2') format('woff2');
}

@font-face
{
  font-family: 'Amaranth';
  font-style: normal;
  font-weight: 700;
  src: url('/core/fonts/amaranth-v18-latin-700.woff2') format('woff2');
}


:root
{

	--text-color-primary-bright:    #d7c26f;;
	--text-color-primary-dark:      #000000;
	--text-color-secondary-bright:  #e2aa60;

	--color-primary-dark:           #000000;
	--color-secondary-dark:         #555555;
	--color-tertiary-dark:          #999999;
	--color-primary-bright:         #d0b31d;

	--border-radius-small:          5px;
	--border-radius-medium:         10px;
	--border-radius-large:          15px;
	--border-radius-xxlarge:        25px;

	--font-game-secondary:          'Amaranth', sans-serif;;
}

html
{
	/*font-family: var(--font-game-primary);*/
}

body
{
    user-select: none;
}


.uk-button-game
{
	padding: 3px 0 2px 0;
	background-color: transparent;
    color: var(--text-color-primary-bright);
    border: 1px solid var(--text-color-primary-bright);
	font-family: var(--font-primary);
	font-weight: normal;
	font-size: .9rem;
    line-height: normal;
	border-radius: 8px;
}

.uk-button-game:not(:disabled):hover, .uk-button-game.uk-active:not(:disabled), .uk-button-game:active:not(:disabled)
{
	background-color: #4f472a;
}

.uk-button-game:disabled
{
	color: #666666;
	border-color: #666666;
}

#explorer-wrapper .explorer
{
	width: 150px;
	height: 150px;
	background-repeat: no-repeat;
	background-size: cover;
	border: 2px solid var(--color-primary-dark);
	border-radius: var(--border-radius-small);
	color: var(--text-color-primary-dark);
	font-size: 1rem;
}

#explorer-wrapper .explorer .skill
{
	position: absolute;
	left: 3px;
	top: 0;
	background: var(--color-primary-bright) no-repeat center;
	border: 2px solid var(--color-primary-dark);
	border-top: 0 none;
	border-bottom-left-radius: var(--border-radius-small);
	border-bottom-right-radius: var(--border-radius-small);
}

#explorer-wrapper .explorer .name
{
	position: absolute;
	left: calc(50% - 50px);
	bottom: 5px;
	width: 100px;
	padding-top: 2px;
	background-color: var(--color-primary-bright);
	border: 2px solid var(--color-primary-dark);
	border-radius: var(--border-radius-small);
	line-height: 1.2;
	text-align: center;
	text-transform: uppercase;
	text-shadow: none;
}

/*****************************************************************************/
/* MODAL DIALOG
/****************************************************************************/

.uk-modal-body .message-title
{
	color: var(--color-primary-bright);
}

.uk-modal-body .fa
{
	color: #a99110;
}

.uk-modal-footer .uk-button
{
	padding-top: 5px;
	line-height: 1.9;
}

.uk-modal-footer .uk-button-primary
{
	background-color: #a99110;
}


.uk-modal-footer .uk-button-primary:not(:disabled):hover, .uk-modal-footer .uk-button-primary.uk-active:not(:disabled), .uk-modal-footer .uk-button-primary:active:not(:disabled)
{
    background-color: var(--color-primary-bright);
}

/*****************************************************************************/
/* TABELLEN
/****************************************************************************/

.uk-table th
{
    padding: 5px 8px 10px 8px;
	line-height: 1;
    text-align: center;
    font-size: .8rem;
    font-weight: normal;
    color: #ffffff;
	border-bottom: 1px solid rgba(255, 255, 255, .1);
}

.uk-table thead .sortable
{
	cursor: pointer;
	white-space: nowrap;
}

.uk-table tbody tr:first-of-type td
{
	padding-top: 15px;
}


.uk-table tbody tr.last-game td
{
	background-color: rgba(255, 255, 255, .1);
}

.uk-table td
{
    padding: 8px;
	line-height: 2;
    vertical-align: middle;
	font-size: 1.15rem;
	color: var(--color-link-light);
}

.uk-table .avatar
{
    display: inline-block;
	float: left;
    width: 30px;
    height: 30px;
	margin-right: 10px;
    border-radius: 50%;
    background-color: transparent;
    border-style: solid;
    border-width: 1px;
    border-color: var(--color-disabled);
    background: url(/core/images/user-dummy.jpg) no-repeat center;
    background-size: cover;
    box-shadow: var(--shadow-box);
}

/*****************************************************************************/
/* PAGINATION
/****************************************************************************/
.pagination-wrapper
{
    position: relative;
    min-height: 20px;
    margin-top: -38px;
    font-size: .8rem;
    overflow: hidden;
    padding: 5px 10px;
    text-align: center;
}

.pagination-wrapper .data-count
{
    position: absolute;
    right: 5px;
    top: 0;
    color: #969696;
    font-style: italic;
}

.paging
{
	margin: 10px 0;
}

.paging .uk-select
{
	height: auto !important;
	width: 100px;
	padding-top: 3px;
	font-size: .8rem;
	border: 1px solid #666666;
	background-color: var(--color-bg-dark);
}

.paging .uk-select:focus, .paging .uk-select:hover
{
    border-color: #888888 !important;
	background-color: #444444;
	cursor: pointer;
}

.paging .uk-select option
{
	height: 50px !important;
	font-size: .8rem;
	background-color: var(--color-bg-dark) !important;
	color: #ffffff !important;
}

.paging .uk-button
{
    width: 100px;
	padding-top: 3px;
	text-transform: none;
    font-size: .8rem;
	font-weight: normal;
	border: 1px solid #666666;
	background-color: var(--color-bg-dark);
}

.paging .uk-button:disabled
{
	color: rgba(255, 255, 255, .3);
}

.paging .uk-button:first-child
{
	border-top-left-radius: 10px;
	border-bottom-left-radius: 10px;
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
	margin-right: -1px;
	box-shadow: none;
}

.paging .uk-button:last-child
{
	border-top-right-radius: 10px;
	border-bottom-right-radius: 10px;
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
	box-shadow: none;
}

.paging .uk-button:not(:disabled):hover
{
	background-color: #444444;
}