/*
    Colors
    ------
    Suecalandia: #EC1747

    BG Gray 1: #141518 (header buttons, login buttons, ...)
    BG Gray 2: #191B1F (header, ...)
    BG Gray 3: #1C1D20 (game select text bg, ...)
    BG Gray 4: #202226 (form bg, ...)
    BG Gray 5: #2D2F33 (body bg)
    BG Gray 6: #3E4146 (game/tournment list bg, ...)
    BG Blue 1: #165C73 (leave table, normal toast, ...)
    BG Blue 2: #3A5058 (system toast)
    BG Blue 3: #73ADC0 (dealer chip)
    BG Green 1: #16735C (tournment game running, toast tournment win, game action buttons, game action labels)
    BG Green 2: #1B3620 (player bottom bg)
    BG Red 1: #FF9C9C (player timer)
    BG Orange 1: #CF4332 (remove ads)

    Text Green 1: #99FF99 (position, win)
    Text Yellow 1: #FFFF99 (ELO)
    Text Red 1: #FF9999 (loss)
    Text Orange 1: #FF9922 (versus)
    Text Blue 1: #77CAE6 (game name, team number)
    Text Gray 1: #999999 (lost player name)

    Facebook: #425F9C
    Google: #CF4332
*/

/*#region general */
html {
    padding: 0;
    margin: 0;
}

body {
    position: relative;
    background-color: #000;
    color: #FFFFFF;
    margin: 0;
    padding: 0;
    height: 100%;
    font-family: slContent;
    font-size: 12px;
}

P, FORM {
    margin: 0;
}

IMG {
    border: 0;
    margin: 0;
    padding: 0;
    position: relative;
}

span, sl-lang {
    position: relative;
}

.clickable {
    cursor: pointer;
}

.block {
    display: block;
}

.pad5 {
    padding: 5px;
}

.pad10 {
    padding: 10px;
}

.black {
    color: #000;
}

.centeralign {
    text-align: center;
}

.rightalign {
    text-align: right;
}

.sltable {
    display: table;
}

.sltable100 {
    display: table;
    width: 100%;
}

.slinlinetable {
    display: inline-table;
}

.slrow {
    display: table-row;
}

.slcell {
    display: table-cell;
    vertical-align: middle;
    position: relative;
}

.slcell0 {
    display: table-cell;
    vertical-align: middle;
    position: relative;
    width: 1px;
    white-space: nowrap;
}

.debugred {
    border: 1px solid red;
}

.debuggreen {
    border: 1px solid green;
}

.debugyellow {
    border: 1px solid yellow;
}

.smiley {
    vertical-align: middle;
}

.firstposition {
    background-image: url(data:image/svg+xml;base64,PHN2ZyBpZD0iQ2FwYV8xIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCA1MTIgNTEyIiBoZWlnaHQ9IjUxMiIgdmlld0JveD0iMCAwIDUxMiA1MTIiIHdpZHRoPSI1MTIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGc+PGc+PHBhdGggZD0ibTE1NS4wMjggMzU1LjExNC0yMC4yOTguOTktMzkuMzU0IDExMy4wNjZjLTEuMjU0IDMuNjAxIDEuNjY0IDcuMjg0IDUuNDU3IDYuODg2bDU1LjE2My01Ljc3NmMxLjU0MS0uMTYxIDMuMDczLjM3MiA0LjE4MSAxLjQ1NWwzOS42NTUgMzguNzc5YzIuNzI2IDIuNjY2IDcuMyAxLjU5MSA4LjU1My0yLjAxbDM5LjYxMS0xMTMuODA1LTExLjY4LTExLjMzNnoiIGZpbGw9IiNmZjQ3NTUiLz48cGF0aCBkPSJtMjQ3Ljk5NiAzOTQuNjk5IDguMDA0LTIyLjk5NS0xMTMuMjktMzguNTI2LTcuOTggMjIuOTI3YzMyLjE3IDIyLjk1NSA3MS4xMjIgMzcuMDA3IDExMy4yNjYgMzguNTk0eiIgZmlsbD0iI2ZjMmIzYSIvPjxwYXRoIGQ9Im0zNTYuOTcyIDM1NS4xMTQgMjAuMjk4Ljk5IDM5LjM1NCAxMTMuMDY2YzEuMjU0IDMuNjAxLTEuNjY0IDcuMjg0LTUuNDU3IDYuODg2bC01NS4xNjMtNS43NzZjLTEuNTQxLS4xNjEtMy4wNzMuMzcyLTQuMTggMS40NTVsLTM5LjY1NSAzOC43NzljLTIuNzI2IDIuNjY2LTcuMyAxLjU5MS04LjU1My0yLjAxbC0zOS42MTEtMTEzLjgwNSAxMS42OC0xMS4zMzZ6IiBmaWxsPSIjZmY0NzU1Ii8+PHBhdGggZD0ibTI2NC4wMDQgMzk0LjY5OS04LjAwNC0yMi45OTUgMTEzLjI5LTM4LjUyNiA3Ljk4IDIyLjkyN2MtMzIuMTcgMjIuOTU1LTcxLjEyMiAzNy4wMDctMTEzLjI2NiAzOC41OTR6IiBmaWxsPSIjZmMyYjNhIi8+PHBhdGggZD0ibTI1NiAzNjAuMTE2Yy0xODUuODUyIDAtMTg1Ljc3NC0xODAuNTI5LTE4NS42Mi0xODMuNjMyIDQuODc5LTk4LjI5IDg2LjExOC0xNzYuNDg0IDE4NS42Mi0xNzYuNDg0czE4MC43NDEgNzguMTk0IDE4NS42MiAxNzYuNDg1Yy4xNTQgMy4xMDMuMjMyIDE4My42MzEtMTg1LjYyIDE4My42MzF6IiBmaWxsPSIjZmZlMjdhIi8+PHBhdGggZD0ibTI1NiAzNTIuOTY5Yy05OS41MDIgMC0xODAuNzM4LTc4LjE5NC0xODUuNjE4LTE3Ni40ODUtLjE1NCAzLjEwMy0uMjM0IDYuMjI2LS4yMzQgOS4zNjcgMCAxMDIuNjQzIDgzLjIwOSAxODUuODUyIDE4NS44NTIgMTg1Ljg1MnMxODUuODUyLTgzLjIwOSAxODUuODUyLTE4NS44NTJjMC0zLjE0Mi0uMDgtNi4yNjQtLjIzNC05LjM2Ny00Ljg4IDk4LjI5MS04Ni4xMTYgMTc2LjQ4NS0xODUuNjE4IDE3Ni40ODV6IiBmaWxsPSIjZjljZjU4Ii8+PHBhdGggZD0ibTI1NiAzMjAuMTI2Yy0xNDYuMTE3IDAtMTQ2LjMxMy0xNDMuNjgyLTE0Ni4xMTctMTQ2Ljc4IDQuODMxLTc2LjQ5NiA2OC40MDMtMTM3LjA0NCAxNDYuMTE3LTEzNy4wNDRzMTQxLjI4NiA2MC41NDggMTQ2LjExNyAxMzcuMDQ0Yy4xOTYgMy4wOTcgMCAxNDYuNzgtMTQ2LjExNyAxNDYuNzh6IiBmaWxsPSIjZmZiYTU3Ii8+PHBhdGggZD0ibTI1NiAzMTMuNTI5Yy03Ny43MTMgMC0xNDEuMjc0LTYwLjU1LTE0Ni4xMDUtMTM3LjA0NS0uMTk2IDMuMDk4LS4zMDcgNi4yMi0uMzA3IDkuMzY3IDAgODAuODYxIDY1LjU1MSAxNDYuNDEyIDE0Ni40MTIgMTQ2LjQxMnMxNDYuNDEyLTY1LjU1MSAxNDYuNDEyLTE0Ni40MTJjMC0zLjE0OC0uMTExLTYuMjY5LS4zMDctOS4zNjctNC44MzEgNzYuNDk1LTY4LjM5MiAxMzcuMDQ1LTE0Ni4xMDUgMTM3LjA0NXoiIGZpbGw9IiNmZmFjM2UiLz48cGF0aCBkPSJtMjY0LjM1IDI3Mi44MmMtMTAuMTY1IDAtMTguNDA2LTguMjQtMTguNDA2LTE4LjQwNnYtOS43MzUtOTMuNDE2cy0xMS4wMTMgMTEuMDQ1LTI0LjE5IDQuNDE4Yy0xMC4yNzQtNS4xNjctMTAuMjc0LTE4LjQ2Ni0xMC4yNzQtMTguNDY2bDIyLjY5My0zOC4zMDZjMy4zMTQtNS41OTQgOS4zMzQtOS4wMjUgMTUuODM2LTkuMDI1aDE0LjM0MWMxMC4xNjUgMCAxOC40MDYgOC4yNCAxOC40MDYgMTguNDA2djEzNi4zODkgOS43MzVjMCAxMC4xNjYtOC4yNDEgMTguNDA2LTE4LjQwNiAxOC40MDZ6IiBmaWxsPSIjZmZlMjdhIi8+PGcgZmlsbD0iI2Y5Y2Y1OCI+PHBhdGggZD0ibTI0My40MTUgMTM2LjhjLTQuODg1IDguMjQ3LTE1LjI3MiAxMS44MjMtMjMuOTM1IDcuNzE4LTMuNTA2LTEuNjYxLTYuMjA5LTQuMjQyLTguMDA2LTcuMjktNS4xMTEgOC42NDYtMi4zNDQgMTkuNzY5IDYuMTY2IDI1LjAyNCA4Ljc3NiA1LjQyIDIwLjUwMyAyLjE4NCAyNS43NTktNi42OTFsMi41NDYtNC4yOTl2LTEzLjc3MWMwLTEuMzgyLTEuODI1LTEuODgxLTIuNTMtLjY5MXoiLz48cGF0aCBkPSJtMjY0LjM1IDI2My4wODVjLTEwLjE2NSAwLTE4LjQwNi04LjI0LTE4LjQwNi0xOC40MDZ2MTguNzM1YzAgMTAuMTY2IDguMjQxIDE4LjQwNiAxOC40MDYgMTguNDA2czE4LjQwNi04LjI0IDE4LjQwNi0xOC40MDZ2LTE4LjczNWMwIDEwLjE2Ni04LjI0MSAxOC40MDYtMTguNDA2IDE4LjQwNnoiLz48L2c+PC9nPjwvZz48L3N2Zz4=);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 20px 20px;
    color: #fff !important;
    font-size: 12px !important;
    min-width: 12px;
}

.secondposition {
    background-image: url(data:image/svg+xml;base64,PHN2ZyBpZD0iQ2FwYV8xIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCA1MTIgNTEyIiBoZWlnaHQ9IjUxMiIgdmlld0JveD0iMCAwIDUxMiA1MTIiIHdpZHRoPSI1MTIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGc+PGc+PHBhdGggZD0ibTIzNS40NjggMzgyLjc5MS04Mi41My0yOC41NDItMTguMjA5IDEuODU1LTM5LjM1MyAxMTMuMDY2Yy0xLjI1NCAzLjYwMSAxLjY2NCA3LjI4NCA1LjQ1NyA2Ljg4Nmw1NS4xNjMtNS43NzZjMS41NDEtLjE2MSAzLjA3My4zNzIgNC4xODEgMS40NTVsMzkuNjU1IDM4Ljc3OWMyLjcyNiAyLjY2NiA3LjMgMS41OTEgOC41NTMtMi4wMWwzOS42MTEtMTEzLjgwNXoiIGZpbGw9IiM5OGRiN2MiLz48cGF0aCBkPSJtMjQ3Ljk5NiAzOTQuNjk5IDguMDA0LTIyLjk5NS0xMTMuMjktMzguNTI2LTcuOTggMjIuOTI3YzMyLjE3IDIyLjk1NSA3MS4xMjIgMzcuMDA3IDExMy4yNjYgMzguNTk0eiIgZmlsbD0iIzgyZDM2MSIvPjxwYXRoIGQ9Im0yNzYuNTMyIDM4Mi43OTEgODIuNTMtMjguNTQyIDE4LjIwOSAxLjg1NSAzOS4zNTQgMTEzLjA2NmMxLjI1MyAzLjYwMS0xLjY2NCA3LjI4NC01LjQ1NyA2Ljg4NmwtNTUuMTYzLTUuNzc2Yy0xLjU0MS0uMTYxLTMuMDczLjM3Mi00LjE4IDEuNDU1bC0zOS42NTUgMzguNzc5Yy0yLjcyNiAyLjY2Ni03LjMgMS41OTEtOC41NTMtMi4wMWwtMzkuNjExLTExMy44MDV6IiBmaWxsPSIjOThkYjdjIi8+PHBhdGggZD0ibTI2NC4wMDQgMzk0LjY5OS04LjAwNC0yMi45OTUgMTEzLjI5LTM4LjUyNiA3Ljk4IDIyLjkyN2MtMzIuMTcgMjIuOTU1LTcxLjEyMiAzNy4wMDctMTEzLjI2NiAzOC41OTR6IiBmaWxsPSIjODJkMzYxIi8+PHBhdGggZD0ibTI1NiAzNTkuNDM4Yy0xODUuNjIgMC0xODUuNzc0LTE3OS44NS0xODUuNjItMTgyLjk1MyA0Ljg3OS05OC4yOTEgODYuMTE4LTE3Ni40ODUgMTg1LjYyLTE3Ni40ODUgOTkuNDM2IDAgMTgwLjYzMyA3OC4wOSAxODUuNjEgMTc2LjI4OC4xNjEgMy4xNjggMCAxODMuMTUtMTg1LjYxIDE4My4xNXoiIGZpbGw9IiNlMGUwZTAiLz48cGF0aCBkPSJtMjU2IDM1Mi45NjljLTk5LjUwMiAwLTE4MC43MzgtNzguMTk0LTE4NS42MTgtMTc2LjQ4NS0uMTU0IDMuMTAzLS4yMzQgNi4yMjYtLjIzNCA5LjM2NyAwIDEwMi42NDMgODMuMjA5IDE4NS44NTIgMTg1Ljg1MiAxODUuODUyczE4NS44NTItODMuMjA5IDE4NS44NTItMTg1Ljg1MmMwLTMuMTQyLS4wOC02LjI2NC0uMjM0LTkuMzY3LTQuODggOTguMjkxLTg2LjExNiAxNzYuNDg1LTE4NS42MTggMTc2LjQ4NXoiIGZpbGw9IiNjZWNlY2UiLz48cGF0aCBkPSJtMjU2IDMyMC42M2MtMTQ2LjQxMiAwLTE0Ni4zMTMtMTQxLjA0OC0xNDYuMTE3LTE0NC4xNDYgNC44MzEtNzYuNDk2IDY4LjQwMy0xMzcuMDQ0IDE0Ni4xMTctMTM3LjA0NHMxNDEuMjg2IDYwLjU0OCAxNDYuMTE3IDEzNy4wNDRjLjE5NiAzLjA5OCAwIDE0NC4xNDYtMTQ2LjExNyAxNDQuMTQ2eiIgZmlsbD0iIzllOWU5ZSIvPjxwYXRoIGQ9Im0yNTYgMzEzLjUyOWMtNzcuNzEzIDAtMTQxLjI3NC02MC41NS0xNDYuMTA1LTEzNy4wNDQtLjE5NiAzLjA5OC0uMzA3IDYuMjItLjMwNyA5LjM2NyAwIDgwLjg2MSA2NS41NTEgMTQ2LjQxMiAxNDYuNDEyIDE0Ni40MTJzMTQ2LjQxMi02NS41NTEgMTQ2LjQxMi0xNDYuNDEyYzAtMy4xNDgtLjExMS02LjI2OS0uMzA3LTkuMzY3LTQuODMxIDc2LjQ5NC02OC4zOTIgMTM3LjA0NC0xNDYuMTA1IDEzNy4wNDR6IiBmaWxsPSIjODk4OTg5Ii8+PHBhdGggZD0ibTI5OC4xNDYgMjcyLjgyaC04My45MjJjLTEwLjE2NSAwLTE4LjAxNC0xNy42OTUtMTcuMjQ5LTIxLjczOSAyLjEyMy0xMS4yMyA3LjEyLTIxLjgxMiAxNC41ODEtMzAuNjMxbDU5LjA0OS02OS43ODhjNS41MjUtNi41MyAzLjA2LTEzLjU2NiAyLjE3Mi0xNS41NjgtMS4wNzktMi40MzMtNC40MzQtOC4xMjItMTIuMjUtOC4zODYtLjIyNi0uMDA4LS40NjEtLjAxMi0uNjk2LS4wMTItMTAuOTc5IDAtMTkuOTEgOC45MzItMTkuOTEgMTkuOTExIDAgMTAuMTY1LTguMjQxIDE4LjQwNi0xOC40MDYgMTguNDA2cy0xOC40MDYtOC4yNC0xOC40MDYtMTguNDA2YzAtMzEuMjc2IDI1LjQ0NS01Ni43MjMgNTYuNzIyLTU2LjcyMy42NDcgMCAxLjI5MS4wMTEgMS45MzIuMDMzIDE5LjU3LjY2IDM2LjY4MiAxMi4yNTQgNDQuNjY1IDMwLjI1NSA4LjEwMiAxOC4yNyA1LjE0MyAzOS4wNjQtNy43MjIgNTQuMjY4bC01OS4wNDggNjkuNzg4Yy0uMjE3LjI1Ny0uNDMuNTE3LS42MzguNzgxaDU5LjEyN2M2Ljc0IDAgMTIuNjM0IDMuNjIzIDE1Ljg0MSA5LjAyOCAxLjYyOCAyLjc0Ni01LjY3NyAxOC43ODMtMTUuODQyIDE4Ljc4M3oiIGZpbGw9IiNlMGUwZTAiLz48Zz48cGF0aCBkPSJtMjk4LjE0NiAyNjMuMDg1aC04My45MjJjLTcuOTEgMC0xNC42MzUtNC45OTktMTcuMjM4LTEyLjAwMi0uNzY1IDQuMDQ1LTEuMTY4IDguMTcxLTEuMTY4IDEyLjMzMSAwIDEwLjE2NiA4LjI0MSAxOC40MDYgMTguNDA2IDE4LjQwNmg4My45MjJjMTAuMTY1IDAgMTguNDA2LTguMjQgMTguNDA2LTE4LjQwNiAwLTMuNDI1LS45NTMtNi42MjEtMi41ODItOS4zNjctMy4yMDcgNS40MDQtOS4wODQgOS4wMzgtMTUuODI0IDkuMDM4eiIgZmlsbD0iI2NlY2VjZSIvPjwvZz48L2c+PC9nPjwvc3ZnPg==);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 20px 20px;
    color: #fff !important;
    font-size: 12px !important;
    min-width: 12px;
}

.thirdposition {
    background-image: url(data:image/svg+xml;base64,PHN2ZyBpZD0iQ2FwYV8xIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCA1MTIgNTEyIiBoZWlnaHQ9IjUxMiIgdmlld0JveD0iMCAwIDUxMiA1MTIiIHdpZHRoPSI1MTIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGc+PGc+PHBhdGggZD0ibTIzMy45NzMgMzgxLjgxMy03Ni43NDYtMjUuNTgyLTIyLjQ5OC0uMTI2LTM5LjM1MyAxMTMuMDY1Yy0xLjI1NCAzLjYwMSAxLjY2NCA3LjI4NCA1LjQ1NyA2Ljg4Nmw1NS4xNjMtNS43NzZjMS41NDEtLjE2MSAzLjA3My4zNzIgNC4xODEgMS40NTVsMzkuNjU1IDM4Ljc3OWMyLjcyNiAyLjY2NiA3LjMgMS41OTEgOC41NTMtMi4wMWwzOS42MTEtMTEzLjgwNXoiIGZpbGw9IiMwMDgzZmQiLz48cGF0aCBkPSJtMjQ3Ljk5NiAzOTQuNjk5IDguMDA0LTIyLjk5NS0xMTMuMjktMzguNTI2LTcuOTggMjIuOTI3YzMyLjE3IDIyLjk1NSA3MS4xMjIgMzcuMDA3IDExMy4yNjYgMzguNTk0eiIgZmlsbD0iIzAwNzJmYyIvPjxwYXRoIGQ9Im0yNzguMDI3IDM4MS44MTMgNzYuNzQ2LTI1LjU4MiAyMi40OTgtLjEyNiAzOS4zNTQgMTEzLjA2NmMxLjI1NCAzLjYwMS0xLjY2NCA3LjI4NC01LjQ1NyA2Ljg4NmwtNTUuMTYzLTUuNzc2Yy0xLjU0MS0uMTYxLTMuMDczLjM3Mi00LjE4IDEuNDU1bC0zOS42NTUgMzguNzc5Yy0yLjcyNiAyLjY2Ni03LjMgMS41OTEtOC41NTMtMi4wMWwtMzkuNjExLTExMy44MDV6IiBmaWxsPSIjMDA4M2ZkIi8+PHBhdGggZD0ibTI2NC4wMDQgMzk0LjY5OS04LjAwNC0yMi45OTUgMTEzLjI5LTM4LjUyNiA3Ljk4IDIyLjkyN2MtMzIuMTcgMjIuOTU1LTcxLjEyMiAzNy4wMDctMTEzLjI2NiAzOC41OTR6IiBmaWxsPSIjMDA3MmZjIi8+PHBhdGggZD0ibTI1NiAzNTYuMTA1Yy0xODUuNjIgMC0xODUuNzc0LTE3Ni41MTctMTg1LjYyLTE3OS42MiA0Ljg3OS05OC4yOTEgODYuMTE4LTE3Ni40ODUgMTg1LjYyLTE3Ni40ODVzMTgwLjc0MSA3OC4xOTQgMTg1LjYyIDE3Ni40ODVjLjE1NCAzLjEwMyAwIDE3OS42Mi0xODUuNjIgMTc5LjYyeiIgZmlsbD0iI2ZmOTgzOCIvPjxwYXRoIGQ9Im0yNTYgMzUyLjk2OWMtOTkuNTAyIDAtMTgwLjczOC03OC4xOTQtMTg1LjYxOC0xNzYuNDg0LS4xNTQgMy4xMDMtLjIzNCA2LjIyNi0uMjM0IDkuMzY3IDAgMTAyLjY0MyA4My4yMDkgMTg1Ljg1MiAxODUuODUyIDE4NS44NTJzMTg1Ljg1Mi04My4yMDkgMTg1Ljg1Mi0xODUuODUyYzAtMy4xNDEtLjA4LTYuMjY0LS4yMzQtOS4zNjctNC44OCA5OC4yOS04Ni4xMTYgMTc2LjQ4NC0xODUuNjE4IDE3Ni40ODR6IiBmaWxsPSIjZmY4NzA5Ii8+PHBhdGggZD0ibTQwMi40MTIgMTg1Ljg1MmMwIDYyLjY5NC02NS41NTEgMTM3LjQxMi0xNDYuNDEyIDEzNy40MTJzLTE0Ni40MTItNzguODI5LTE0Ni40MTItMTM3LjQxMmMwLTMuMTQ3LjA5OS02LjI3LjI5NS05LjM2OCA0LjgzLTc2LjQ5NiA2OC40MDMtMTM3LjA0NCAxNDYuMTE3LTEzNy4wNDRzMTQxLjI4NyA2MC41NDggMTQ2LjExNyAxMzcuMDQ0Yy4xOTYgMy4wOTguMjk1IDYuMjIxLjI5NSA5LjM2OHoiIGZpbGw9IiNjZTc0MzAiLz48cGF0aCBkPSJtMjU2IDMxMy41MjljLTc3LjcxMyAwLTE0MS4yNzQtNjAuNTUtMTQ2LjEwNS0xMzcuMDQ0LS4xOTYgMy4wOTgtLjMwNyA2LjIxOS0uMzA3IDkuMzY3IDAgODAuODYxIDY1LjU1MSAxNDYuNDEyIDE0Ni40MTIgMTQ2LjQxMnMxNDYuNDEyLTY1LjU1MSAxNDYuNDEyLTE0Ni40MTJjMC0zLjE0OC0uMTExLTYuMjY5LS4zMDctOS4zNjctNC44MzEgNzYuNDk0LTY4LjM5MiAxMzcuMDQ0LTE0Ni4xMDUgMTM3LjA0NHoiIGZpbGw9IiNiYzY3MmUiLz48cGF0aCBkPSJtMjU2LjE4NSAyNzIuODJjLTMxLjUzMyAwLTUxLjU5Ny0yMS43MzctNTUuNDU5LTQ3LjUyNy0uMzUxLTIuMzQ2LS40NjItNy4zODEtLjQ2Mi03LjM4MSAyLjY4NS02Ljg0MSA5LjM0Ny0xMS42ODUgMTcuMTQtMTEuNjg1IDEwLjE2NSAwIDE4LjQwNiA4LjI0IDE4LjQwNiAxOC40MDYgMCAxMS4yMzUgOS4xNCAyMC4zNzUgMjAuMzc1IDIwLjM3NXMyMC4zNzYtOS4xNCAyMC4zNzYtMjAuMzc1YzAtMy4zNzgtLjgyNi02LjU2Ni0yLjI4Ny05LjM3NCAwIDAtMS4zODItMTcuMzU2LTE3LjEwMy0xNy4zNTYtMTUuNzcgMC0xNi44MjYtMjEuNDI4LTE2LjgyNi0yMS40MjggMy4yMDctNS40MDUgOS4xMDEtOS4wMjggMTUuODQxLTkuMDI4IDExLjIzNSAwIDIwLjM3Ni05LjE0IDIwLjM3Ni0yMC4zNzVzLTkuMTQxLTIwLjM3NS0yMC4zNzYtMjAuMzc1LTIwLjM3NSA5LjE0LTIwLjM3NSAyMC4zNzVjMCAxMC4xNjYtOC4yNDEgMTguNDA2LTE4LjQwNiAxOC40MDZzLTE4LjQwNi04LjI0LTE4LjQwNi0xOC40MDZjMC0zMS41MzIgMjUuNjU0LTU3LjE4NiA1Ny4xODYtNTcuMTg2IDMxLjUzMyAwIDU3LjE4NyAyNS42NTQgNTcuMTg3IDU3LjE4NiAwIDE0Ljk1Mi01Ljc2NiAyOC41OC0xNS4xOTQgMzguNzgxIDcuNDE4IDguMDI2IDEyLjU2OSAxOC4xNzQgMTQuNDI5IDI5LjQxOSAwIDAgLjA1NyA2LjE3Mi0uNDc4IDkuMzE1LTQuNTYzIDI2LjgyMi0yNC40MTEgNDguMjMzLTU1Ljk0NCA0OC4yMzN6IiBmaWxsPSIjZmZhYTVjIi8+PGcgZmlsbD0iI2VhOTk1NyI+PHBhdGggZD0ibTI1Ni4xODUgMTg1LjUyM2MtNi43NCAwLTEyLjYxNy0zLjYzNC0xNS44MjMtOS4wMzgtMS42MyAyLjc0Ni0yLjU4MiA1Ljk0Mi0yLjU4MiA5LjM2NyAwIDEwLjE2NiA4LjI0IDE4LjQwNiAxOC40MDYgMTguNDA2IDcuODU3IDAgMTQuNjc3IDQuNDc4IDE4LjA3NSAxMS4wMDkgMS40NjEtMi44MDggMi4zMDEtNS45ODkgMi4zMDEtOS4zNjctLjAwMS0xMS4yMzctOS4xNDItMjAuMzc3LTIwLjM3Ny0yMC4zNzd6Ii8+PHBhdGggZD0ibTI1Ni4xODUgMjYzLjA4NWMtMjcuNDA5IDAtNTAuMzY3LTE5LjM4Ny01NS45MDUtNDUuMTY2LS44MTcgMi4wODItMS4yODIgNC4zNDItMS4yODIgNi43MTUgMCAzMS41MzMgMjUuNjU0IDU3LjE4NyA1Ny4xODcgNTcuMTg3czU3LjE4Ny0yNS42NTQgNTcuMTg3LTU3LjE4N2MwLTMuMTg5LS4yNzctNi4zMTItLjc4MS05LjM2LTQuNDg4IDI3LjA4Ni0yOC4wNjYgNDcuODExLTU2LjQwNiA0Ny44MTF6Ii8+PC9nPjwvZz48L2c+PC9zdmc+);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 20px 20px;
    color: #fff !important;
    font-size: 12px !important;
    min-width: 12px;
}

.otherposition {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI1MTIiIGhlaWdodD0iNTEyIiBzdHlsZT0iIj48cmVjdCBpZD0iYmFja2dyb3VuZHJlY3QiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHg9IjAiIHk9IjAiIGZpbGw9Im5vbmUiIHN0cm9rZT0ibm9uZSIvPiAgPGcgc3R5bGU9IiI+ICA8dGl0bGU+YmFja2dyb3VuZDwvdGl0bGU+IDwvZz4gPGcgc3R5bGU9IiIgY2xhc3M9ImN1cnJlbnRMYXllciI+ICA8dGl0bGU+TGF5ZXIgMTwvdGl0bGU+ICAgICAgICAgICAgICAgICAgICAgICA8ZyBjbGFzcz0iIj48cGF0aCBpZD0ic3ZnXzEiIGZpbGw9IiNiNmI2YjYiIGQ9Im0yNTYuMDAwMDA3NjI5Mzk0NTMsNDI5LjU4NjUxMzc5Mzk0NTMgYy0xODUuNjIsMCAtMTg1Ljc3NCwtMTc5Ljg1IC0xODUuNjIsLTE4Mi45NTMgYzQuODc5MDAwMDAwMDAwMDAwNCwtOTguMjkxIDg2LjExOCwtMTc2LjQ4NSAxODUuNjIsLTE3Ni40ODUgYzk5LjQzNiwwIDE4MC42MzMsNzguMDkgMTg1LjYxLDE3Ni4yODggYzAuMTYxMDAwMDAwMDAwMDAwMDYsMy4xNjggMCwxODMuMTUgLTE4NS42MSwxODMuMTUgeiIgY2xhc3M9IiIgZmlsbC1vcGFjaXR5PSIxIi8+PHBhdGggaWQ9InN2Z18yIiBmaWxsPSIjOTE5MTkxIiBkPSJtMjU2LjAwMDAwNzYyOTM5NDUzLDQyMy4xMTc1MTM3OTM5NDUzIGMtOTkuNTAyLDAgLTE4MC43MzgsLTc4LjE5NCAtMTg1LjYxOCwtMTc2LjQ4NSBjLTAuMTU0MDAwMDAwMDAwMDAwMDUsMy4xMDMgLTAuMjM0LDYuMjI2IC0wLjIzNCw5LjM2NyBjMCwxMDIuNjQzIDgzLjIwOSwxODUuODUyIDE4NS44NTIsMTg1Ljg1MiBzMTg1Ljg1MiwtODMuMjA5IDE4NS44NTIsLTE4NS44NTIgYzAsLTMuMTQyIC0wLjA4MDAwMDAwMDAwMDAwMDAzLC02LjI2NCAtMC4yMzQsLTkuMzY3IGMtNC44OCw5OC4yOTEgLTg2LjExNiwxNzYuNDg1IC0xODUuNjE4LDE3Ni40ODUgeiIgY2xhc3M9IiIgZmlsbC1vcGFjaXR5PSIxIi8+PHBhdGggaWQ9InN2Z18zIiBmaWxsPSIjNmQ2ZDZkIiBkPSJtMjU2LjAwMDAwNzYyOTM5NDUzLDM5MC43Nzg1MTM3OTM5NDUzIGMtMTQ2LjQxMiwwIC0xNDYuMzEzLC0xNDEuMDQ4IC0xNDYuMTE3LC0xNDQuMTQ2IGM0LjgzMSwtNzYuNDk2IDY4LjQwMywtMTM3LjA0NCAxNDYuMTE3LC0xMzcuMDQ0IHMxNDEuMjg2LDYwLjU0OCAxNDYuMTE3LDEzNy4wNDQgYzAuMTk2MDAwMDAwMDAwMDAwMDYsMy4wOTggMCwxNDQuMTQ2IC0xNDYuMTE3LDE0NC4xNDYgeiIgY2xhc3M9IiIgZmlsbC1vcGFjaXR5PSIxIi8+PHBhdGggaWQ9InN2Z180IiBmaWxsPSIjNDg0ODQ4IiBkPSJtMjU2LjAwMDAwNzYyOTM5NDUzLDM4My42Nzc1MTM3OTM5NDUzIGMtNzcuNzEzLDAgLTE0MS4yNzQsLTYwLjU1IC0xNDYuMTA1LC0xMzcuMDQ0IGMtMC4xOTYwMDAwMDAwMDAwMDAwNiwzLjA5OCAtMC4zMDcwMDAwMDAwMDAwMDAxLDYuMjIgLTAuMzA3MDAwMDAwMDAwMDAwMSw5LjM2NyBjMCw4MC44NjEgNjUuNTUxLDE0Ni40MTIgMTQ2LjQxMiwxNDYuNDEyIHMxNDYuNDEyLC02NS41NTEgMTQ2LjQxMiwtMTQ2LjQxMiBjMCwtMy4xNDggLTAuMTExMDAwMDAwMDAwMDAwMDMsLTYuMjY5IC0wLjMwNzAwMDAwMDAwMDAwMDEsLTkuMzY3IGMtNC44MzEsNzYuNDk0IC02OC4zOTIsMTM3LjA0NCAtMTQ2LjEwNSwxMzcuMDQ0IHoiIGNsYXNzPSIiIGZpbGwtb3BhY2l0eT0iMSIvPjwvZz48L2c+PC9zdmc+);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 20px 20px;
    color: #fff !important;
    font-size: 12px !important;
    min-width: 12px;
}

.icononlypremium {
    background-image: url(../images/premium.png);
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: auto 50%;
}

.icononlypremium25 {
    background-image: url(../images/premium.png);
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: auto 25%;
}

.templatecontent {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 1px;
    z-index: 0;
}

.customstatusnone {
    color: #99FF99;
}

.customstatusbusy {
    color: #FF9999;
}

.customstatusoffline {
    color: #999999;
}

*:not(input):not(textarea) {
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.selectable {
    -webkit-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text;
}

    .selectable * {
        -webkit-user-select: text;
        -moz-user-select: text;
        -ms-user-select: text;
        user-select: text;
    }

@-ms-viewport {
    width: device-width;
}

::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}

::-webkit-scrollbar-button {
    width: 0px;
    height: 0px;
}

::-webkit-scrollbar-thumb {
    background: #e1e1e1;
    border: 0px none #ffffff;
    border-radius: 0px;
}

    ::-webkit-scrollbar-thumb:hover {
        background: #ffffff;
    }

    ::-webkit-scrollbar-thumb:active {
        background: #000000;
    }

::-webkit-scrollbar-track {
    background: #666666;
    border: 0px solid #ffffff;
    border-radius: 0px;
}

    ::-webkit-scrollbar-track:hover {
        background: #666666;
    }

    ::-webkit-scrollbar-track:active {
        background: #333333;
    }

::-webkit-scrollbar-corner {
    background: transparent;
}

INPUT, TEXTAREA, SELECT, OPTION, SELECT * {
    font-family: slContent;
    font-size: 14px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: 0;
    padding: 5px;
}

textarea {
    resize: none;
}

A {
    cursor: pointer;
    color: #FFFF99;
}

input[type=checkbox] {
    -ms-transform: scale(2); /* IE */
    -moz-transform: scale(2); /* FF */
    -webkit-transform: scale(2); /* Safari and Chrome */
    -o-transform: scale(2); /* Opera */
    transform: scale(2);
    margin: 12px;
}

table {
    border-spacing: 0;
    border-collapse: collapse;
}

    table td {
        padding: 0;
    }

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type=number] {
    -moz-appearance: textfield;
}

#aipBranding {
    display: none;
}

.shepherd-element[data-popper-reference-hidden]:not(.shepherd-centered) {
    opacity: initial;
    pointer-events: initial;
    visibility: initial
}

.shepherd-modal-overlay-container.shepherd-modal-is-visible {
    opacity: 0.7;
}

.shepherd-target {
    border: 1px solid #EC1747;
}

.shepherd-button {
    background: #ffffff;
    border-top: solid 4px #141518;
    border-radius: 0;
    color: #16202D;
    display: flex;
    flex-grow: 1;
    font-family: slContent;
    font-size: 1rem;
    justify-content: center;
    margin: 0;
    padding: 1rem;
    text-align: center;
}

    .shepherd-button:not(:disabled):hover {
        background: initial;
        color: initial
    }

    .shepherd-button:hover {
        background: initial;
        color: initial;
    }

    .shepherd-button.shepherd-button-secondary {
        background: #CAD5D5;
    }

        .shepherd-button.shepherd-button-secondary:hover {
            color: initial;
            background: initial;
        }

.shepherd-element {
    border: solid 4px #141518;
}

.shepherd-element,
.shepherd-header,
.shepherd-footer {
    border-radius: 0;
}

    .shepherd-element .shepherd-arrow {
        border-width: 0;
        height: auto;
        width: auto;
    }

.shepherd-arrow::before {
    display: none;
}

.shepherd-element .shepherd-arrow:after {
    content: url('../images/arrow.svg');
    display: inline-block;
    z-index: 9999;
}

.shepherd-element[data-popper-placement^='top'] .shepherd-arrow,
.shepherd-element.shepherd-pinned-top .shepherd-arrow {
    bottom: -26px;
}

    .shepherd-element[data-popper-placement^='top'] .shepherd-arrow:after,
    .shepherd-element.shepherd-pinned-top .shepherd-arrow:after {
        transform: rotate(270deg);
    }

.shepherd-element[data-popper-placement^='bottom'] .shepherd-arrow {
    top: -26px;
}

    .shepherd-element[data-popper-placement^='bottom'] .shepherd-arrow:after {
        transform: rotate(90deg);
    }

.shepherd-element[data-popper-placement^='left'] .shepherd-arrow,
.shepherd-element.shepherd-pinned-left .shepherd-arrow {
    right: -26px;
}

    .shepherd-element[data-popper-placement^='left'] .shepherd-arrow:after,
    .shepherd-element.shepherd-pinned-left .shepherd-arrow:after {
        transform: rotate(180deg);
    }

.shepherd-element[data-popper-placement^='right'] .shepherd-arrow,
.shepherd-element.shepherd-pinned-right .shepherd-arrow {
    left: -26px;
}

.shepherd-footer {
    padding: 0;
}

    .shepherd-footer button:not(:last-of-type) {
        border-right: solid 4px #141518;
    }

.shepherd-has-title .shepherd-content .shepherd-cancel-icon {
    margin-top: -7px;
}

.shepherd-has-title .shepherd-content .shepherd-header {
    background: transparent;
    font-family: slTitle;
    padding-bottom: 0;
    padding-left: 2rem;
}

    .shepherd-has-title .shepherd-content .shepherd-header .shepherd-title {
        font-size: 1.2rem;
    }

.shepherd-text {
    font-size: 1.2rem;
    padding: 2rem;
    font-family: slContent;
}

    .shepherd-text a, .shepherd-text a:visited,
    .shepherd-text a:active {
        border-bottom: 1px dotted;
        border-bottom-color: rgba(0, 0, 0, 0.75);
        color: rgba(0, 0, 0, 0.75);
        text-decoration: none;
    }

        .shepherd-text a:hover, .shepherd-text a:visited:hover,
        .shepherd-text a:active:hover {
            border-bottom-style: solid;
        }

/*#endregion*/

/*#region debug*/
.debugholder {
    position: absolute;
    bottom: 20px;
    left: 0;
    right: 0;
    display: none;
    z-index: 9999;
}

    .debugholder * {
        font-size: 12px;
    }
/*#endregion*/

/*#region ads*/
.ads {
    display: none;
}

.ads .header {
    text-align: center;
    font-size: 16px;
    color: #999999;    
}

    .ads.top {
        position: relative;
        display: table;
        width: 100%;
        margin-bottom: 20px;
    }

    .ads.top .adsholder {
        display: table-cell;
        text-align: center;
    }

    .ads.right {
        padding: 20px 20px 0 20px;
        width: 160px;
        height: 630px;
    }

    .ads.left {
        padding: 20px 20px 0 20px;
        width: 160px;
        height: 630px;
    }
/*#endregion*/

/*#region main*/
.mainholder {
    background-color: #2D2F33;
    position: absolute;
    height: 100%;
}

    .mainholder.startup {
        width: 100%;
    }

@supports (left: var(--sal)) {
    .mainholder {
        top: var(--sat);
        bottom: var(--sab);
        left: var(--sal);
        right: var(--sar);
    }
}

#divMain {
    position: relative;
    width: 100%;
    height: 100%;
}

    #divMain .toastholder {
        position: absolute;
        width: 100%;
        top: 0;
        overflow: hidden;
        display: none;
        text-align: center;
        z-index: 9999;
    }

        #divMain .toastholder .message {
            position: relative;
            width: 100%;
            font-size: 12px;
            background-color: #165C73;
            padding: 5px;
        }

            #divMain .toastholder .message.tournmentwin {
                background-color: #16735C;
            }

            #divMain .toastholder .message.system {
                background-color: #3A5058;
            }

    #divMain > .header {
        position: absolute;
        top: 0;
        width: 100%;
        height: 76px;
        display: table;
        background-color: #191B1F;
    }

    #divMain.xmas > .header {
        background-image: url(../images/xmas.png);
        background-size: auto 20%;
        background-position: left top;
        background-repeat: repeat-x;
    }

    #divMain > .header .mainmenu {
        position: relative;
        display: table-cell;
        width: 1px;
        white-space: nowrap;
        background-color: #141518;
        vertical-align: middle;
    }

        #divMain > .header .mainmenu:hover {
            background-color: #191B1F;
        }

        #divMain > .header .mainmenu .logo {
            position: absolute;
            left: 12px;
            top: 5px;
            display: inline-block;
            vertical-align: middle;
            cursor: pointer;
            z-index: 50;
        }

            #divMain > .header .mainmenu .logo > IMG {
                width: 64px;
                height: 64px;
            }

        #divMain > .header .mainmenu .opener {
            padding: 0 12px 0 88px;
            display: table;
            vertical-align: middle;
            text-align: center;
            cursor: pointer;
            height: 76px;
            box-sizing: border-box;
        }

            #divMain > .header .mainmenu .opener .content {
                display: table-cell;
                vertical-align: middle;
            }

            #divMain > .header .mainmenu .opener .text {
                font-family: slTitle;
                font-size: 12px;
            }

            #divMain > .header .mainmenu .opener .icon {
                padding: 5px;
            }

                #divMain > .header .mainmenu .opener .icon img {
                    width: 12px;
                }

        #divMain > .header .mainmenu .menu {
            display: none;
            position: absolute;
            top: 0;
            left: 0;
            z-index: 1000;
            -webkit-box-shadow: 2px 2px 4px 4px rgba(0,0,0,0.75);
            -moz-box-shadow: 2px 2px 4px 4px rgba(0,0,0,0.75);
            box-shadow: 2px 2px 4px 4px rgba(0,0,0,0.75);
        }

            #divMain > .header .mainmenu .menu .bgclose {
                position: fixed;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                background-color: rgba(0,0,0,0.5);
            }

            #divMain > .header .mainmenu .menu .menucontent {
                position: absolute;
                top: 0;
                left: 0;
                background-color: #141518;
            }

            #divMain > .header .mainmenu .menu .logotext {
                position: absolute;
                display: inline-block;
                top: 64px;
                left: 5px;
                z-index: 10;
                cursor: pointer;
            }

                #divMain > .header .mainmenu .menu .logotext > IMG {
                    width: 163px;
                    z-index: 10;
                }

            #divMain > .header .mainmenu .menu .close {
                position: absolute;
                top: 0px;
                right: 0px;
                z-index: 10;
                padding: 25px;
                cursor: pointer;
            }

                #divMain > .header .mainmenu .menu .close img {
                    width: 12px;
                }


            #divMain > .header .mainmenu .menu .social {
                position: absolute;
                bottom: 25px;
                right: 18px;
            }

                #divMain > .header .mainmenu .menu .social .network {
                    display: inline-block;
                    margin-left: 10px;
                    cursor: pointer;
                }

                    #divMain > .header .mainmenu .menu .social .network img {
                        width: 42px;
                    }

            #divMain > .header .mainmenu .menu .zoom {
                position: relative;
                display: table;
                width: 100%;
                height: 50px;
                padding-top: 100px;
            }

                #divMain > .header .mainmenu .menu .zoom .text {
                    display: table-cell;
                    vertical-align: middle;
                    text-align: center;
                    width: 1px;
                    white-space: nowrap;
                    font-size: 14px;
                    padding-left: 8px;
                }

                #divMain > .header .mainmenu .menu .zoom .inputholder {
                    display: table-cell;
                    vertical-align: middle;
                    text-align: center;
                    box-sizing: border-box;
                    padding-left: 10px;
                    padding-right: 10px;
                }

                    #divMain > .header .mainmenu .menu .zoom .inputholder input {
                        width: 100%;
                        padding: 0;
                        margin: 0 5px;
                        height: 40px;
                    }

                #divMain > .header .mainmenu .menu .zoom .fullscreen {
                    display: table-cell;
                    vertical-align: middle;
                    text-align: center;
                    width: 60px;
                    cursor: pointer;
                }

                    #divMain > .header .mainmenu .menu .zoom .fullscreen img {
                        width: 30px;
                        padding: 0;
                        margin: 0;
                    }

                    #divMain > .header .mainmenu .menu .zoom .fullscreen.on {
                        background-color: #165C73;
                    }

            #divMain > .header .mainmenu .menu .languages {
                position: absolute;
                top: 0px;
                left: 100px;
            }

                #divMain > .header .mainmenu .menu .languages .language {
                    display: inline-block;
                    margin-right: 20px;
                    cursor: pointer;
                    position: relative;
                }

                    #divMain > .header .mainmenu .menu .languages .language img {
                        width: 70px;
                    }

            #divMain > .header .mainmenu .menu .itemstable {
                position: relative;
                padding-top: 1px;
                display: table;
            }

            #divMain > .header .mainmenu .menu .items {
                position: relative;
                display: table-cell;
                width: 300px;
                min-width: 300px;
                vertical-align: top;
            }

                #divMain > .header .mainmenu .menu .items.borderleft {
                    border-left: 1px solid #191B1F;
                }

                #divMain > .header .mainmenu .menu .items .item {
                    position: relative;
                    background-color: #202226;
                    border-top: 1px solid #191B1F;
                    font-size: 16px;
                    padding: 0 10px;
                    cursor: pointer;
                    vertical-align: middle;
                    height: 50px;
                    line-height: 50px;
                    display: block;
                    box-sizing: border-box;
                    color: white;
                    text-decoration: none;
                    width: 100%;
                }

                    #divMain > .header .mainmenu .menu .items .item:hover {
                        background-color: #2D2F33;
                    }

                    #divMain > .header .mainmenu .menu .items .item.withimage {
                        display: table;
                        width: 100%;
                    }

                        #divMain > .header .mainmenu .menu .items .item.withimage .text {
                            display: table-cell;
                            vertical-align: middle;
                            text-align: left;
                        }

                        #divMain > .header .mainmenu .menu .items .item.withimage .image {
                            display: table-cell;
                            vertical-align: middle;
                            text-align: right;
                        }

                            #divMain > .header .mainmenu .menu .items .item.withimage .image img {
                                height: 20px;
                            }

    #divMain > .header > .back {
        display: none;
        height: 50px;
        width: 76px;
        vertical-align: middle;
        text-align: center;
        background-color: #141518;
        cursor: pointer;
        border-left: 1px solid #2D2F33;
    }

    #divMain > .header > .back img {
        width: 20px;
        position: relative;
        vertical-align: middle;
    }

    #divMain > .header > .back.highlight {
        background-color: #165C73;
    }

    #divMain > .header > .title {
        display: table-cell;
        position: relative;
        text-align: center;
        vertical-align: middle;
    }

        #divMain > .header > .title h1 {
            font-family: slTitle;
            font-size: 18px;
            font-weight: normal;
            margin: 0;
            padding: 0;
        }

    #divMain > .header > .statistics {
        display: table-cell;
        width: 1px;
        white-space: nowrap;
        vertical-align: middle;
    }

        #divMain > .header > .statistics .table {
            display: table;
            height: 100%;
        }

            #divMain > .header > .statistics .table .users, #divMain > .header .statistics .table .games, #divMain > .header .statistics .table .tournments {
                display: table-row;
                height: 33%;
            }

            #divMain > .header > .statistics .table .value {
                color: white;
                padding: 0 10px;
                font-size: 12px;
                vertical-align: middle;
                text-align: right;
                display: table-cell;
            }

            #divMain > .header > .statistics .table .label {
                color: #999999;
                padding-right: 10px;
                font-size: 12px;
                vertical-align: middle;
                display: table-cell;
            }

    #divMain > .header > .links {
        position: relative;
        display: none;
        width: 1px;
        white-space: nowrap;
        text-align: center;
        vertical-align: middle;
        padding-left: 10px;
        padding-right: 10px;
        cursor: pointer;
    }

        #divMain > .header > .links .icon {
            height: 30px;
            position: relative;
        }

        #divMain > .header > .links .text {
            margin-top: 5px;
            color: #999999;
            font-size: 12px;
            position: relative;
        }

        #divMain > .header > .links .alert {
            position: absolute;
            display: none;
            margin-top: 5px;
            margin-left: 5px;
            left: 50%;
        }

            #divMain > .header > .links .alert img {
                width: 16px;
            }

    #divMain > .header > .credits {
        position: relative;
        padding: 5px 10px;
        cursor: pointer;
        display: none;
        width: 1px;
        white-space: nowrap;
        background-color: #141518;
        border-right: 1px solid #2D2F33;
        vertical-align: middle;
        text-align: center;
    }

        #divMain > .header > .credits .title {
            text-align: center;
            font-family: slTitle;
            font-size: 12px;
        }

        #divMain > .header > .credits .image {
            text-align: center;
            padding-top: 3px;
        }

            #divMain > .header > .credits .image img {
                height: 26px;
            }

        #divMain > .header > .credits .value {
            text-align: center;
            font-family: slNumeric;
            color: #99FF99;
            display: inline-block;
            vertical-align: middle;
        }

        #divMain > .header > .credits .dropdown {
            display: inline-block;
            vertical-align: middle;
        }

        #divMain > .header > .credits .dropdown img {
            width: 12px;
        }

    #divMain > .header .profile {
        position: relative;
        padding: 5px;
        cursor: pointer;
        display: none;
        width: 1px;
        white-space: nowrap;
        background-color: #141518;
    }

        #divMain > .header .profile .opener {
            text-align: center;
        }

            #divMain > .header .profile .opener .userpicture {
                text-align: center;
            }

                #divMain > .header .profile .opener .userpicture .userpictureholder {
                    position: relative;
                    display: inline-block;
                }

                    #divMain > .header .profile .opener .userpicture .userpictureholder .picture {
                        height: 46px;
                    }

                    #divMain > .header .profile .opener .userpicture .userpictureholder .status {
                        position: absolute;
                        right: 0;
                        bottom: 0;
                        width: 16px;
                        z-index: 1;
                    }

                    #divMain > .header .profile .opener .userpicture .userpictureholder .premium {
                        position: absolute;
                        display: inline-block;
                        z-index: 1;
                    }

            #divMain > .header .profile .opener .premium img {
                height: 18px;
            }


            #divMain > .header .profile .opener .nametable {
                display: table;
                font-size: 0;
            }

                #divMain > .header .profile .opener .nametable .name {
                    display: table-cell;
                    max-width: 200px;
                    white-space: nowrap;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    -o-text-overflow: ellipsis;
                    text-align: center;
                    font-size: 12px;
                    vertical-align: middle;
                }

                #divMain > .header .profile .opener .nametable .dropdown {
                    display: table-cell;
                    padding-left: 5px;
                    vertical-align: middle;
                }

                    #divMain > .header .profile .opener .nametable .dropdown IMG {
                        width: 12px;
                    }

            #divMain > .header .profile .opener .alert {
                display: none;
                position: absolute;
                margin-top: 5px;
                margin-left: 5px;
                left: 50%;
            }

                #divMain > .header .profile .opener .alert img {
                    width: 16px;
                }

        #divMain > .header .profile .menu {
            display: none;
            position: absolute;
            top: 0;
            right: 0;
            z-index: 1000;
            -webkit-box-shadow: -2px 2px 4px 4px rgba(0,0,0,0.75);
            -moz-box-shadow: -2px 2px 4px 4px rgba(0,0,0,0.75);
            box-shadow: -2px 2px 4px 4px rgba(0,0,0,0.75);
        }

            #divMain > .header .profile .menu .bgclose {
                position: fixed;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                background-color: rgba(0,0,0,0.5);
            }

            #divMain > .header .profile .menu .menucontent {
                position: absolute;
                top: 0;
                right: 0;
                background-color: #141518;
            }

            #divMain > .header .profile .menu .profilemenuheader {
                position: relative;
                padding: 5px;
                width: 100%;
                display: table;
                height: 76px;
                box-sizing: border-box;
            }

                #divMain > .header .profile .menu .profilemenuheader .userpicture {
                    position: relative;
                    text-align: center;
                    display: table-cell;
                    vertical-align: middle;
                    width: 46px;
                    padding-right: 10px;
                }

                    #divMain > .header .profile .menu .profilemenuheader .userpicture .picture {
                        height: 46px;
                    }

                    #divMain > .header .profile .menu .profilemenuheader .userpicture .premium {
                        position: absolute;
                        display: inline-block;
                    }

                        #divMain > .header .profile .menu .profilemenuheader .userpicture .premium img {
                            height: 18px;
                        }

                #divMain > .header .profile .menu .profilemenuheader .info {
                    display: table-cell;
                    vertical-align: middle;
                }

                    #divMain > .header .profile .menu .profilemenuheader .info .name {
                        white-space: pre-wrap;
                    }

                    #divMain > .header .profile .menu .profilemenuheader .info .premiumlimit {
                        margin-top: 10px;
                        color: #99FF99;
                    }

                        #divMain > .header .profile .menu .profilemenuheader .info .premiumlimit.free {
                            color: #999999;
                        }

                    #divMain > .header .profile .menu .profilemenuheader .info .teamname {
                        white-space: pre-wrap;
                        color: #999999;
                    }

                #divMain > .header .profile .menu .profilemenuheader .greenmode {
                    display: table-cell;
                    vertical-align: middle;
                    text-align: center;
                    width: 50px;
                }

                    #divMain > .header .profile .menu .profilemenuheader .greenmode img {
                        width: 36px;
                        max-height: 36px;
                    }

                #divMain > .header .profile .menu .profilemenuheader .sound {
                    display: table-cell;
                    vertical-align: middle;
                    text-align: center;
                    width: 50px;
                }

                    #divMain > .header .profile .menu .profilemenuheader .sound img {
                        width: 24px;
                        max-height: 24px;
                    }

                #divMain > .header .profile .menu .profilemenuheader .close {
                    display: table-cell;
                    width: 50px;
                    text-align: center;
                    vertical-align: middle;
                    cursor: pointer;
                }

            #divMain > .header .profile .menu .logotext {
                position: absolute;
                display: inline-block;
                top: 64px;
                left: 5px;
                z-index: 10;
                cursor: pointer;
            }

                #divMain > .header .profile .menu .logotext > IMG {
                    width: 163px;
                    z-index: 10;
                }

            #divMain > .header .profile .menu .close img {
                width: 12px;
            }

            #divMain > .header .profile .menu .itemstable {
                position: relative;
                padding-top: 1px;
                display: table;
            }

            #divMain > .header .profile .menu .items {
                position: relative;
                display: table-cell;
                width: 250px;
                min-width: 250px;
                vertical-align: top;
            }

                #divMain > .header .profile .menu .items.borderleft {
                    border-left: 1px solid #191B1F;
                }

                #divMain > .header .profile .menu .items .item {
                    position: relative;
                    background-color: #202226;
                    border-top: 1px solid #191B1F;
                    font-size: 14px;
                    padding: 0 10px;
                    cursor: pointer;
                    text-align: left;
                    height: 50px;
                    display: table;
                    box-sizing: border-box;
                    color: white;
                    text-decoration: none;
                    width: 100%;
                }

                    #divMain > .header .profile .menu .items .item:hover {
                        background-color: #2D2F33;
                    }

                    #divMain > .header .profile .menu .items .item .text {
                        display: table-cell;
                        vertical-align: middle;
                        text-align: left;
                    }

                    #divMain > .header .profile .menu .items .item .image {
                        display: table-cell;
                        vertical-align: middle;
                        text-align: right;
                    }

                        #divMain > .header .profile .menu .items .item .image img {
                            height: 20px;
                        }

                    #divMain > .header .profile .menu .items .item.logout {
                        color: #EC1747;
                    }

                    #divMain > .header .profile .menu .items .item.customstatus .none {
                        color: #99FF99;
                    }

                    #divMain > .header .profile .menu .items .item.customstatus .busy {
                        color: #FF9999;
                    }

                    #divMain > .header .profile .menu .items .item.customstatus .offline {
                        color: #999999;
                    }

                    #divMain > .header .profile .menu .items .item.support {
                        display: none;
                        background-color: #16735C;
                    }

                    #divMain > .header .profile .menu .items .item.admin {
                        display: none;
                        background-color: #EC1747;
                    }

    #divMain > .fullcontent {
        position: absolute;
        top: 76px;
        left: 0;
        right: 0;
        bottom: 0;
        overflow: hidden;
        z-index: 1;
    }

        #divMain > .fullcontent > .content {
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 42px;
            z-index: -1;
            overflow-x: hidden;
            overflow-y: auto;
            background-image: url(../images/contentbg.webp?2);
            background-size: 100% auto;
            background-repeat: repeat-y;
        }

    #divMain > .footer {
        position: absolute;
        bottom: 0;
        width: 100%;
        background-color: #202226;
    }

        #divMain > .footer .footerleft {
            display: table;
            height: 18px;
        }

            #divMain > .footer .footerleft .ndados {
                display: table-cell;
                vertical-align: middle;
                padding-left: 5px;
            }

                #divMain > .footer .footerleft .ndados img {
                    width: 12px;
                }

            #divMain > .footer .footerleft .version {
                display: table-cell;
                vertical-align: middle;
                font-size: 12px;
                color: #999999;
                padding-left: 5px;
            }

            #divMain > .footer .footerleft .sq {
                display: table-cell;
                padding-left: 5px;
                vertical-align: middle;
            }

                #divMain > .footer .footerleft .sq .table {
                    display: table;
                }

                    #divMain > .footer .footerleft .sq .table .image {
                        display: table-cell;
                        vertical-align: middle;
                    }

                        #divMain > .footer .footerleft .sq .table .image img {
                            width: 12px;
                        }

                    #divMain > .footer .footerleft .sq .table .text {
                        display: table-cell;
                        vertical-align: middle;
                        padding-left: 5px;
                        font-size: 12px;
                    }

        #divMain > .footer .slogan {
            max-width: 60%;
            font-size: 12px;
            height: 24px;
            line-height: 12px;
            overflow: hidden;
            color: #999999;
            padding-left: 5px;
        }

/*#endregion*/

/*#region firstun*/
.firstrun {
    display: none;
    width: 100%;
    height: 100%;
}

    .firstrun > .content {
        width: 100%;
        position: relative;
        display: table-cell;
        vertical-align: top;
        text-align: center;
    }

        .firstrun > .content > .selectlanguage {
            display: inline-block;
            position: relative;
        }

            .firstrun > .content > .selectlanguage .languages .language {
                display: inline-block;
                margin: 40px;
                cursor: pointer;
                position: relative;
            }

                .firstrun > .content > .selectlanguage .languages .language img {
                    width: 140px;
                }

                .firstrun > .content > .selectlanguage .languages .language a {
                    text-decoration: none;
                }

        .firstrun > .content > .selectaccount {
            display: none;
            position: relative;
            padding-top: 30px;
        }

            .firstrun > .content > .selectaccount .loginregister {
                margin-top: 5px;
                font-size: 22px;
                padding: 20px;
                background-color: #191B1F;
                width: 100%;
                color: #fff;
                text-align: center;
                cursor: pointer;
                position: relative;
            }

            .firstrun > .content > .selectaccount .playnow {
                margin-top: 15px;
                font-size: 22px;
                padding: 20px;
                background-color: #191B1F;
                width: 100%;
                color: #fff;
                text-align: center;
                cursor: pointer;
                position: relative;
            }
/*#endregion*/

/*#region login*/
.login {
    display: none;
    width: 100%;
    height: 100%;
}

    .login > .content {
        position: relative;
        display: table-cell;
        vertical-align: middle;
        text-align: center;
    }

        .login > .content .loginholder {
            display: inline-block;
            width: 600px;
            margin: 0 auto;
            position: relative;
            padding-top: 5px;
        }

    .login .formholder {
        padding: 12px 20px;
        background-color: #191B1F;
        position: relative;
    }

    .login .form {
        width: 100%;
        display: table;
        position: relative;
    }

        .login .form .email, .login .form .password {
            display: table-row;
            vertical-align: middle;
            height: 60px;
            line-height: 60px;
            white-space: nowrap;
        }

            .login .form .email .title, .login .form .password .title {
                display: table-cell;
                font-size: 18px;
                vertical-align: middle;
                text-align: left;
            }

            .login .form .email .input, .login .form .password .input {
                display: table-cell;
                width: 100%;
            }

                .login .form .email .input INPUT, .login .form .password .input INPUT {
                    width: 100%;
                    font-size: 18px;
                    font-family: Arial;
                    height: 40px;
                    vertical-align: middle;
                }

    .login .buttonlogin {
        font-size: 22px;
        line-height: 50px;
        vertical-align: middle;
        background-color: #FFFFFF;
        width: 100%;
        color: #151515;
        white-space: nowrap;
        text-align: center;
        cursor: pointer;
        position: relative;
    }

    .login .buttonloginfacebook {
        margin-top: 5px;
        font-size: 22px;
        line-height: 50px;
        vertical-align: middle;
        background-color: #425F9C;
        width: 100%;
        max-width: 100%;
        color: #fff;
        white-space: nowrap;
        text-align: center;
        cursor: pointer;
        overflow: hidden;
        text-overflow: ellipsis;
        -o-text-overflow: ellipsis;
        padding: 0 10px 0 10px;
        box-sizing: border-box;
        position: relative;
    }

        .login .buttonloginfacebook.disabled {
            opacity: 0.1;
            cursor: default;
        }

    .login .buttonloginfacebookforget {
        display: none;
        position: absolute;
        margin-top: 5px;
        margin-left: 5px;
        left: 100%;
        width: 50px;
        line-height: 50px;
        font-size: 22px;
        vertical-align: middle;
        text-align: center;
        background-color: #425F9C;
        cursor: pointer;
    }

    .login .buttonlogingoogle {
        margin-top: 5px;
        font-size: 22px;
        line-height: 50px;
        vertical-align: middle;
        background-color: #CF4332;
        width: 100%;
        max-width: 100%;
        color: #fff;
        white-space: nowrap;
        text-align: center;
        cursor: pointer;
        overflow: hidden;
        text-overflow: ellipsis;
        -o-text-overflow: ellipsis;
        padding: 0 10px 0 10px;
        box-sizing: border-box;
        position: relative;
    }

        .login .buttonlogingoogle.disabled {
            opacity: 0.1;
            cursor: default;
        }

    .login .buttonlogingoogleforget {
        display: none;
        position: absolute;
        margin-top: 5px;
        margin-left: 5px;
        left: 100%;
        width: 50px;
        line-height: 50px;
        font-size: 22px;
        vertical-align: middle;
        text-align: center;
        background-color: #CF4332;
        cursor: pointer;
    }

    .login .buttonregister {
        display: inline-block;
        margin-top: 5px;
        margin-right: 5px;
        font-size: 22px;
        line-height: 50px;
        vertical-align: middle;
        background-color: #EC1747;
        width: 50%;
        color: #000;
        white-space: nowrap;
        text-align: center;
        cursor: pointer;
        position: relative;
    }

    .login .buttonloginguest {
        display: inline-block;
        margin-top: 5px;
        font-size: 22px;
        line-height: 50px;
        vertical-align: middle;
        background-color: #191B1F;
        width: calc(50% - 5px);
        color: #fff;
        white-space: nowrap;
        text-align: center;
        cursor: pointer;
        position: relative;
    }

    .login .buttonrecover {
        display: inline-block;
        margin-top: 5px;
        font-size: 22px;
        line-height: 50px;
        vertical-align: middle;
        background-color: #191B1F;
        width: 100%;
        color: #fff;
        white-space: nowrap;
        text-align: center;
        cursor: pointer;
        position: relative;
    }

    .login .top5 {
        margin-top: 30px;
    }

        .login .top5 .title {
            background-color: #191B1F;
            padding: 20px;
            font-family: slTitle;
            font-size: 16px;
            margin: 0;
        }

        .login .top5 .content {
            position: relative;
            padding: 0 10px 10px 10px;
            display: flex;
            flex-flow: wrap;
        }

        .login .top5 .content .game {
            display: inline-block;
            width: 33.33%;
            box-sizing: border-box;
            padding-top: 10px;
        }

            .login .top5 .content .game:nth-of-type(3n+1) {
                padding-right: 10px;
            }

            .login .top5 .content .game:nth-of-type(3n+2) {
                padding-right: 10px;
            }

            .login .top5 .content .game .gametitle {
                color: white;
                font-size: 17px;
                line-height: 30px;
                padding: 5px;
                background-color: rgba(255,255,255,0.27);
                text-align: center;
            }

            .login .top5 .content .game .place {
                display: grid;
                grid-template-columns: 26px auto;
                width: 100%;
                line-height: 26px;
                padding-top: 4px;
            }

                .login .top5 .content .game .place .position {
                    border-radius: 30px;
                    background-color: rgba(255,255,255,0.17);
                    text-align: center;
                }

                .login .top5 .content .game .place .name {
                    padding-left: 5px;
                    text-align: left;
                }

                .login .top5 .content .game .place.place1 .position {
                    background-color: gold;
                    color: black;
                }

                .login .top5 .content .game .place.place2 .position {
                    background-color: silver;
                    color: black;
                }

                .login .top5 .content .game .place.place3 .position {
                    background-color: #cd7f32;
                    color: black;
                }

    .login .news {
        margin-top: 30px;
    }

        .login .news .title {
            background-color: #191B1F;
            padding: 20px;
            font-family: slTitle;
            font-size: 16px;
            margin: 0;
        }

        .login .news .content {
            position: relative;
            padding: 10px;
            text-align: justify;
        }

            .login .news .content.collapsed {
                max-height: 400px;
                overflow: hidden;
            }

            .login .news .content .readmore {
                position: absolute;
                bottom: 0;
                left: 0;
                width: 100%;
                text-align: center;
                margin: 0;
                padding: 30px 0 0 0;
                text-align: center;
                background-image: linear-gradient(to bottom, transparent, #2D2F33);
            }

                .login .news .content .readmore .button {
                    display: inline-block;
                    background-color: #165C73;
                    padding: 20px 50px;
                    cursor: pointer;
                    position: relative;
                }

                .login .news .content .date {
                    color: #99FF99;
                    font-family: slTitle;
                    font-size: 16px;
                }

            .login .news .content .group {
                font-family: slTitle;
                color: #77CAE6;
            }

            .login .news .content .xmas2020 {
                position: relative;
                width: 100%;
                text-align: center;
            }

                .login .news .content .xmas2020 .image {
                    position: relative;
                    display: inline-block;
                    width: 500px;
                }

                    .login .news .content .xmas2020 .image img {
                        width: 100%;
                    }

                .login .news .content .xmas2020 .text {
                    position: absolute;
                    bottom: 10px;
                    width: 480px;
                    text-align: center;
                    color: #000;
                    font-size: 16px;
                    left: 50%;
                    margin-left: -240px;
                }

    .login .info {
        background-color: #191B1F;
        padding: 20px;
        font-size: 14px;
    }

        .login .info .footerlinks {
            margin-bottom: 20px;
        }
/*#endregion*/

/*#region register*/
.register {
    display: table;
    width: 50%;
    height: 100%;
    margin: 0 auto;
}

    .register .content {
        display: table-cell;
        vertical-align: middle;
    }

    .register .formholder {
        padding: 20px;
        background-color: #191B1F;
        position: relative;
    }

    .register .form {
        width: 100%;
        display: table;
        position: relative;
    }

        .register .form .email, .register .form .password, .register .form .name, .register .form .username, .register .form .captcha {
            display: table-row;
            vertical-align: middle;
            height: 40px;
            white-space: nowrap;
        }

            .register .form .email .title, .register .form .password .title, .register .form .name .title, .register .form .username .title, .register .form .captcha .title {
                display: table-cell;
                font-size: 18px;
                vertical-align: middle;
                padding-top: 5px;
                padding-bottom: 5px;
            }

            .register .form .email .input, .register .form .password .input, .register .form .name .input, .register .form .username .input, .register .form .captcha .input {
                display: table-cell;
                width: 100%;
                padding-top: 5px;
                padding-bottom: 5px;
            }

                .register .form .email .input INPUT, .register .form .password .input INPUT, .register .form .name .input INPUT, .register .form .username .input INPUT, .register .form .captcha .input INPUT {
                    width: 100%;
                    font-size: 18px;
                    font-family: Arial;
                }

    .register .buttonregister {
        font-size: 22px;
        line-height: 50px;
        vertical-align: middle;
        background-color: #EC1747;
        width: 100%;
        color: #fff;
        white-space: nowrap;
        text-align: center;
        cursor: pointer;
        position: relative;
    }

    .register .buttoncancel {
        margin-top: 10px;
        font-size: 22px;
        line-height: 50px;
        vertical-align: middle;
        background-color: #FFFFFF;
        width: 100%;
        color: #151515;
        white-space: nowrap;
        text-align: center;
        cursor: pointer;
        position: relative;
    }
/*#endregion*/

/*#region recover*/
.recover {
    display: table;
    width: 50%;
    height: 100%;
    margin: 0 auto;
}

    .recover .content {
        display: table-cell;
        vertical-align: middle;
    }

    .recover .formholder {
        padding: 20px;
        background-color: #191B1F;
        position: relative;
    }

    .recover .form {
        width: 100%;
        display: table;
        position: relative;
    }

        .recover .form .username, .recover .form .captcha {
            display: table-row;
            vertical-align: middle;
            height: 40px;
            white-space: nowrap;
        }

            .recover .form .username .title, .recover .form .captcha .title {
                display: table-cell;
                font-size: 18px;
                vertical-align: middle;
                padding-top: 5px;
                padding-bottom: 5px;
            }

            .recover .form .username .input, .recover .form .captcha .input {
                display: table-cell;
                width: 100%;
                padding-top: 5px;
                padding-bottom: 5px;
            }

                .recover .form .username .input INPUT, .recover .form .captcha .input INPUT {
                    width: 100%;
                    font-size: 18px;
                    font-family: Arial;
                }

    .recover .buttonrecover {
        font-size: 22px;
        line-height: 50px;
        vertical-align: middle;
        background-color: #EC1747;
        width: 100%;
        color: #fff;
        white-space: nowrap;
        text-align: center;
        cursor: pointer;
        position: relative;
    }

    .recover .buttoncancel {
        margin-top: 10px;
        font-size: 22px;
        line-height: 50px;
        vertical-align: middle;
        background-color: #FFFFFF;
        width: 100%;
        color: #151515;
        white-space: nowrap;
        text-align: center;
        cursor: pointer;
        position: relative;
    }
/*#endregion*/

/*#region recoverpassword*/
.recoverpassword {
    display: table;
    width: 50%;
    height: 100%;
    margin: 0 auto;
}

    .recoverpassword .content {
        display: table-cell;
        vertical-align: middle;
    }

    .recoverpassword .formholder {
        padding: 20px;
        background-color: #191B1F;
        position: relative;
    }

    .recoverpassword .form {
        width: 100%;
        display: table;
        position: relative;
    }

        .recoverpassword .form .username, .recoverpassword .form .code, .recoverpassword .form .newpassword {
            display: table-row;
            vertical-align: middle;
            height: 40px;
            white-space: nowrap;
        }

            .recoverpassword .form .username .title, .recoverpassword .form .code .title, .recoverpassword .form .newpassword .title {
                display: table-cell;
                font-size: 18px;
                vertical-align: middle;
                padding-top: 5px;
                padding-bottom: 5px;
            }

            .recoverpassword .form .username .input, .recoverpassword .form .code .input, .recoverpassword .form .newpassword .input {
                display: table-cell;
                width: 100%;
                padding-top: 5px;
                padding-bottom: 5px;
            }

                .recoverpassword .form .username .input INPUT, .recoverpassword .form .code .input INPUT, .recoverpassword .form .newpassword .input INPUT {
                    width: 100%;
                    font-size: 18px;
                    font-family: Arial;
                }

    .recoverpassword .buttonchange {
        font-size: 22px;
        line-height: 50px;
        vertical-align: middle;
        background-color: #EC1747;
        width: 100%;
        color: #fff;
        white-space: nowrap;
        text-align: center;
        cursor: pointer;
        position: relative;
    }

    .recoverpassword .buttoncancel {
        margin-top: 10px;
        font-size: 22px;
        line-height: 50px;
        vertical-align: middle;
        background-color: #FFFFFF;
        width: 100%;
        color: #151515;
        white-space: nowrap;
        text-align: center;
        cursor: pointer;
        position: relative;
    }
/*#endregion*/

/*#region icons*/
#divIcons {
    position: absolute;
    bottom: -10px;
    right: 0;
    z-index: 999;
    pointer-events: none;
}

    #divIcons .icon {
        display: none;
        position: relative;
        bottom: 0;
        width: 58px;
        height: 58px;
        cursor: pointer;
        padding-right: 15px;
    }

        #divIcons .icon .image {
            position: absolute;
            pointer-events: auto;
        }

        #divIcons .icon.active .image {
            border-radius: 50%;
            box-shadow: 0px 0px 9px 4px #EC1747;
        }

        #divIcons .icon .alert {
            position: absolute;
            right: 15px;
            display: none;
        }

        #divIcons .icon .image img {
            width: 58px;
        }

        #divIcons .icon .alert img {
            width: 22px;
        }
/*#endregion*/

/*#region page*/
.pageinstance {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

    .pageinstance > .content {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
    }

    .pageinstance > .textcontent {
        padding: 10px;
        text-align: justify;
    }

    .pageinstance > .scrollablecontent {
        overflow-x: hidden;
        overflow-y: auto;
        padding-bottom: 40px;
    }
/*#endregion*/

/*#region game*/
.gameinstance {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
/*#endregion*/

/*#region tournment */
.tournmentinstance {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

    .tournmentinstance > .title {
        position: absolute;
        top: 10px;
        left: 148px;
        font-size: 35px;
        color: #ED1849;
        margin-bottom: 20px;
    }

    .tournmentinstance .subtitle {
        color: #fff;
    }

        .tournmentinstance .subtitle .sobeedescee {
            font-size: 20px;
        }

    .tournmentinstance .tournmentId {
        color: #999999;
        position: absolute;
        top: 50px;
        left: 158px;
    }

    .tournmentinstance .content {
    }

    .tournmentinstance .closefull {
        width: 100% !important;
    }

/*#endregion*/

/*#region animations */
.loading:after {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.5);
    background-image: url(../images/loading.png);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 128px 128px;
}

.loadingmedium:after {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.5);
    background-image: url(../images/loading.png);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 64px 64px;
}

.loadingsmall:after {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.5);
    background-image: url(../images/loading.png);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 32px 32px;
}

.bounce {
    -moz-animation: bounce 0.5s infinite linear;
    -o-animation: bounce 0.5s infinite linear;
    -webkit-animation: bounce 0.5s infinite linear;
    animation: bounce 0.5s infinite linear;
}

.bounceslow {
    -moz-animation: bounce 1s infinite linear;
    -o-animation: bounce 1s infinite linear;
    -webkit-animation: bounce 1s infinite linear;
    animation: bounce 1s infinite linear;
}

@-webkit-keyframes bounce {
    0% {
        top: 0;
    }

    50% {
        top: -0.2em;
    }

    70% {
        top: -0.3em;
    }

    100% {
        top: 0;
    }
}

@-moz-keyframes bounce {
    0% {
        top: 0;
    }

    50% {
        top: -0.2em;
    }

    70% {
        top: -0.3em;
    }

    100% {
        top: 0;
    }
}

@-o-keyframes bounce {
    0% {
        top: 0;
    }

    50% {
        top: -0.2em;
    }

    70% {
        top: -0.3em;
    }

    100% {
        top: 0;
    }
}

@-ms-keyframes bounce {
    0% {
        top: 0;
    }

    50% {
        top: -0.2em;
    }

    70% {
        top: -0.3em;
    }

    100% {
        top: 0;
    }
}

@keyframes bounce {
    0% {
        top: 0;
    }

    50% {
        top: -0.2em;
    }

    70% {
        top: -0.3em;
    }

    100% {
        top: 0;
    }
}
/*#endregion*/

/*#region gestures*/
DIV.tap-gesture {
    position: absolute;
    left: 50%;
    bottom: 0;
    pointer-events: none;
    z-index: 5;
}

    DIV.tap-gesture:after {
        content: '';
        background-image: url('../images/finger.png');
        background-size: cover;
        position: absolute;
        width: 24px;
        height: 24px;
        margin-top: -12px;
        margin-left: -6px;
        -webkit-animation: tap-gesture-animation 1s forwards linear infinite;
        animation: tap-gesture-animation 1s forwards ease infinite;
    }

    DIV.tap-gesture.left {
        left: 20%;
    }

    DIV.tap-gesture.hidden {
        display: none;
    }

@keyframes tap-gesture-animation {
    0% {
        margin-top: -6px;
    }

    33% {
        margin-top: -18px;
    }

    66% {
        margin-top: -6px;
    }

    100% {
        margin-top: -6px;
    }
}
/*#endregion*/
.cmplogo {
    bottom: unset !important;
}

@media (max-height: 500px) {
    #qc-cmp2-ui {
        height: 100%;
        max-height: 100%;
        display: grid;
        grid-template-rows: none;
    }
}