/** Elementy podstawowe **/
html,body {
	background-color: #222;
	color: #fff;
	font-family: 'Open Sans';
	margin: 0;
	padding: 0;
	font-size: 12pt;
}

button::-moz-focus-inner,input::-moz-focus-inner {
	border: 0;
	padding: 0;
}

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

#gameContainer {
	position: relative;
	margin: 0 auto;
	-moz-user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
	overflow: hidden;
	width: 1200px;
	height: 750px;
	background-image: url('../media/menu_background.png');
	background-size: 100%;
}

.ui {
	position: absolute;
	z-index: 2;
}

#uiContainer {
	z-index: 102;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	-moz-user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
}

.ui-screen {
	background-image: url("../media/menu_background.png");
	background-size: 100%;
}

#start-screen {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 4;
	background-image: url('../media/menu_background.png');
	background-size: 100%;
}

.unclickable-layer {
	position: absolute;
	display: none;
	width: 100%;
	height: 100%;
	opacity: 1;
	z-index: 100;
	top: 0%;
	left: 0%;
}

/** Preloader **/
#preloader {
	width: 400px;
	height: 10px;
	border: 1px solid #444;
	position: absolute;
	left: 50%;
	margin-left: -200px;
	top: 52%;
	z-index: 5;
}

#preloader span {
	width: 0px;
	height: 10px;
	background: #444;
	display: block;
	position: absolute;
	margin: 0;
	top: 0;
	left: 0;
}

/** Ekran logowania **/
.login-div {
	display: block;
	position: absolute;
	left: 50%;
	margin-left: -163px;
	width: 326px;
	height: 240px;
	background: rgba(255, 255, 255, 0.9);
	top: 209px;
}

.login-div form {
	display: block;
	padding-left: 30px;
}

.login-div form[name="loginForm"] {
	position: absolute;
	top: 0;
	left: 0;
	width: 370px;
	height: 550px;
}

.login-div form[name="registerForm"] {
	position: absolute;
	top: 0;
	left: 400px;
	width: 370px;
	height: 550px;
}

.login-div form p {
	color: black;
	font-weight: bold;
}

.login-div form label {
	width: 100%;
	display: block;
	float: left;
	color: black;
	font-size: 13px;
	font-weight: bold;
}

.login-div form input,.login-div form select,.login-div form button {
	float: left;
	clear: left;
}

.login-div form input {
	width: 260px;
	height: 18px;
	margin-bottom: 10px;
	margin-top: 5px;
	border-color: bl;
	border: 1px solid #666;
}

.login-div form select {
	margin: 5px 0 10px 0;
	width: 265px;
}

.login-div form button {
	background: none;
	font-size: 17px;
	border: none;
	background-image: url('../media/buttons.png');
	width: 210px;
	height: 50px;
	color: white;
	text-transform: uppercase;
	transform: scale(0.7);
	outline: none;
	cursor: pointer;
	left: 24px;
	top: 9px;
	font-weight: bold;
	position: relative;
}

.login-div form button:hover {
	background-position: 0px -50px;
}

.login-div form[name="loginForm"] {
	width: 369px;
}

.message-box {
	position: absolute;
	top: 520px;
	left: 0;
	width: 100%;
	height: 35px;
	background: red;
	color: white;
	text-align: center;
	font-size: 12px;
	line-height: 35px;
	display: none;
}

/** **/
#player-cash-text {
	font-family: 'Exo', sans-serif;
	font-weight: 700;
	position: absolute;
	top: 10px;
	left: 50%;
	margin-left: -180px;
	width: 104px;
	font-size: 13px;
	text-align: right;
	text-transform: uppercase;
	color: #26a9e0;
	font-weight: bold;
}

#company-cash-text {
	font-family: 'Exo', sans-serif;
	font-weight: 700;
	position: absolute;
	top: 10px;
	left: 50%;
	margin-left: 120px;
	width: 104px;
	font-size: 13px;
	text-align: left;
	text-transform: uppercase;
	color: #f05a28;
	font-weight: bold;
}

#time-text {
	position: absolute;
	top: 19px;
	left: 50%;
	margin-left: -50px;
	width: 104px;
	font-size: 10px;
	text-align: right;
	text-transform: uppercase;
	color: #666;
}

/** Mini-mapa **/
.mini-map {
	bottom: 21px;
	right: 38px;
	background: transparent;
}

#mini-map-background {
	position: absolute;
	width: 288px;
	height: 213px;
	bottom: 0;
	right: 5px;
	z-index: 1;
	background-image: url('../media/ui.png');
	background-position: -165px 2px;
}

.workshop1-mini-map {
	bottom: 98px;
	right: 183px;
	width: 75px;
	height: 77px;
	position: absolute;
	z-index: 10;
	display: block;
}

.workshop2-mini-map {
	bottom: 98px;
	right: 38px;
	width: 75px;
	height: 77px;
	position: absolute;
	z-index: 10;
	display: block;
}

.workshop3-mini-map {
	bottom: 21px;
	right: 148px;
	width: 110px;
	height: 77px;
	position: absolute;
	z-index: 10;
	display: block;
}

.workshop4-mini-map {
	bottom: 21px;
	right: 38px;
	width: 110px;
	height: 77px;
	position: absolute;
	z-index: 10;
	display: block;
}

.waiting-area-mini-map {
	bottom: 98px;
	right: 113px;
	width: 70px;
	height: 77px;
	position: absolute;
	z-index: 10;
	display: block;
}

.workshop-counter {
	width: 32px;
	position: absolute;
	top: 0;
	left: 0;
	font-size: 10px;
	color: white;
	height: 21px;
	background-image: url('../media/ui.png');
	background-position: 0px -88px;
	text-align: center;
	line-height: 17px;
	font-weight: bold;
}

.player-echo {
	background-image: url('../media/ui.png');
}

.tank-echo-male {
	background-position: 3px -110px;
}

.dps1-echo-male {
	background-position: -17px -110px;
}

.dps2-echo-male {
	background-position: -39px -110px;
}

.healer-echo-male {
	background-position: -61px -110px;
}

.tank-echo-female {
	background-position: -83px -110px;
}

.dps1-echo-female {
	background-position: -106px -110px;
}

.dps2-echo-female {
	background-position: -128px -110px;
}

.healer-echo-female {
	background-position: -128px -136px;
}

/** **/
#clock-background {
	position: absolute;
	width: 555px;
	height: 96px;
	top: 0;
	left: 50%;
	margin-left: -322px;
	background-image: url('../media/ui.png');
	background-position: -454px 0px;
}

/** Pasek umiejętności **/
.skill-activationDiv {
	z-index: 1001;
	width: 157px;
	height: 37px;
	bottom: 140px;
	left: 497px;
	margin-right: 50%;
	display: none;
	background-image: url('../media/ui.png');
	background-position: -619px -131px;
}

.skill-activationText {
	position: absolute;
	font-size: 8px;
	text-transform: uppercase;
	display: none;
	margin: 0px;
	top: 8px;
	left: 14px;
	text-align: center;
	width: 128px;
}

.skill-activationBar {
	position: absolute;
	width: 120px;
	height: 10px;
	top: 6px;
	left: 13px;
	color: red;
	display: block;
	margin: 0px;
}

.skill-activationBar .progress-bar {
	background: #1b75bb;
}

.skill-quickbar {
	padding-top: 32px;
	padding-right: 8px;
	width: 471px;
	height: 121px;
	bottom: 15px;
	left: 181px;
	background: transparent;
	background-image: url('../media/ui.png');
	background-position: 0px -397px;
}

.skillCooldown-quickbar {
	width: 440px;
	height: 10px;
	bottom: 33px;
	left: 206px;
}

.communication-bubble {
	display: none;
	position: absolute;
	width: 90px;
	font-size: 14px;
	padding: 10px;
	background: #d75527;
	-moz-border-radius: 12px;
	max-width: 200px;
	z-index: 1000;
}

.communication-bubble:after {
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 25px 7px 0;
	border-color: #d75527 transparent;
	display: block;
	width: 0;
	z-index: 1000;
}

.workshop1-bubble {
	display: none;
	position: absolute;
	width: 72px;
	font-size: 14px;
	padding: 10px;
	background: #d75527;
	-moz-border-radius: 12px;
	max-width: 200px;
	z-index: 1000;
}

.workshop1-bubble:after {
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 24px 7px 0;
	border-color: #d75527 transparent;
	display: block;
	width: 0;
	top: 25px;
	left: 55px;
	transform: rotate(-30deg);
	z-index: 1000;
}

.workshop2-bubble {
	display: none;
	position: absolute;
	width: 58px;
	font-size: 14px;
	padding: 10px;
	background: #d75527;
	-moz-border-radius: 12px;
	max-width: 200px;
	z-index: 1000;
}

.workshop2-bubble:after {
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 24px 7px 0;
	border-color: #d75527 transparent;
	display: block;
	width: 0;
	top: 25px;
	left: 12px;
	transform: rotate(30deg);
	z-index: 1000;
}

.workshop3-bubble {
	display: none;
	position: absolute;
	width: 58px;
	font-size: 14px;
	padding: 10px;
	background: #d75527;
	-moz-border-radius: 12px;
	max-width: 200px;
	z-index: 1000;
}

.workshop3-bubble:after {
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 24px 7px 0;
	border-color: #d75527 transparent;
	display: block;
	width: 0;
	top: 25px;
	left: 55px;
	transform: rotate(-30deg);
	z-index: 1000;
}

.workshop4-bubble {
	display: none;
	position: absolute;
	/*width: 68px;*/
	font-size: 14px;
	padding: 10px;
	background: #d75527;
	-moz-border-radius: 12px;
	max-width: 200px;
	z-index: 1000;
	text-align: center;
}

.workshop4-bubble:after {
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 24px 7px 0;
	border-color: #d75527 transparent;
	display: block;
	width: 0;
	top: 25px;
	left: 12px;
	transform: rotate(30deg);
	z-index: 1000;
}

.waiting-area-bubble {
	display: none;
	position: absolute;
	width: 60px;
	font-size: 14px;
	padding: 10px;
	background: #d75527;
	-moz-border-radius: 12px;
	max-width: 200px;
	z-index: 1000;
}

.waiting-area-bubble:after {
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 16px 7px 0;
	border-color: #d75527 transparent;
	display: block;
	width: 0;
	top: -15px;
	left: 28px;
	transform: rotate(-180deg);
	z-index: 1000;
}

.skill-bubble {
	display: none;
	position: absolute;
	width: auto;
	font-size: 14px;
	padding: 10px;
	background: #d75527;
	-moz-border-radius: 12px;
	max-width: 200px;
	z-index: 1000;
}

.skill-bubble:after {
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 25px 7px 0;
	border-color: #d75527 transparent;
	display: block;
	width: 0;
	bottom: -25px;
	left: 14px;
	z-index: 1000;
}

.skill-bubble:before {
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 15px 15px 0;
	border-color: transparent;
	display: block;
	width: 0;
	z-index: 0;
	bottom: -18px;
	left: 11px;
	z-index: 1000;
}

.skill {
	position: relative;
	float: right;
	width: 87px;
	text-align: right;
	font-size: 16px;
	font-weight: bold;
	color: rgba(255, 255, 255, 0.5);
	padding-top: 70px !important;
	padding-right: 5px !important;
	height: 87px;
	border: none;
	display: none;
	padding: 0;
	margin-right: 1px;
	outline: none;
	cursor: pointer;
	background-image: url('../media/ui.png');
	background-position: -783px -478px;
	overflow: hidden;
}

.ui-button-disabled.skill,.ui-button-disabled.skill:hover {
	background-position: -957px -478px !important;
}

.skill:hover {
	background-position: -870px -478px;
}

.skill-cooldown {
	position: relative;
	margin-left: 11px;
	float: right;
	display: none;
}

.skill-cooldown .progress-bar {
	background: #1b75bb;
}

/** Ikony skilli **/
#skill-shield {
	background-position: -783px -391px !important;
}

#skill-shield:hover {
	background-position: -870px -391px !important;
}

#skill-shield.ui-button-disabled,#skill-shield.ui-button-disabled:hover
	{
	background-position: -957px -391px !important;
}

#skill-shield.locked,#skill-shield.locked:hover
{
	background-position: -1304px -261px !important;
	background-image: url('../media/skills.png');
}


#skill-assistants {
	background-position: -783px -565px !important;
}

#skill-assistants:hover {
	background-position: -870px -565px !important;
}

#skill-assistants.ui-button-disabled,#skill-assistants.ui-button-disabled:hover
	{
	background-position: -957px -565px !important;
}

#skill-assistants.locked,#skill-assistants.locked:hover
{
	background-position: -1304px -435px !important;
	background-image: url('../media/skills.png');
}

#skill-summonClient {
	background-position: -783px -652px !important;
}

#skill-summonClient:hover {
	background-position: -870px -652px !important;
}

#skill-summonClient.ui-button-disabled,#skill-summonClient.ui-button-disabled:hover
	{
	background-position: -957px -652px !important;
}

#skill-summonClient.locked,#skill-summonClient.locked:hover
{
	background-position: -1304px -522px !important;
	background-image: url('../media/skills.png');
}

#skill-service {
	background-position: -783px -739px !important;
}

#skill-service:hover {
	background-position: -870px -739px !important;
}

#skill-service.ui-button-disabled,#skill-service.ui-button-disabled:hover
	{
	background-position: -957px -739px !important;
}

#skill-service.locked,#skill-service.locked:hover
{
	background-position: -1304px -609px !important;
	background-image: url('../media/skills.png');
}

#skill-innovation {
	background-position: -783px -130px !important;
}

#skill-innovation:hover {
	background-position: -870px -130px !important;
}

#skill-innovation.ui-button-disabled,#skill-innovation.ui-button-disabled:hover
	{
	background-position: -957px -130px !important;
}

#skill-innovation.locked,#skill-innovation.locked:hover
{
	background-position: -1304px 0 !important;
	background-image: url('../media/skills.png');
}

#skill-defense {
	background-position: -783px -217px !important;
}

#skill-defense:hover {
	background-position: -870px -217px !important;
}

#skill-defense.ui-button-disabled,#skill-defense.ui-button-disabled:hover
	{
	background-position: -957px -217px !important;
}

#skill-defense.locked,#skill-defense.locked:hover
{
	background-position: -1304px -87px !important;
	background-image: url('../media/skills.png');
}

#skill-powerTransfer {
	background-position: -783px -478px !important;
}

#skill-powerTransfer:hover {
	background-position: -870px -478px !important;
}

#skill-powerTransfer.ui-button-disabled,#skill-powerTransfer.ui-button-disabled:hover
	{
	background-position: -957px -478px !important;
}

#skill-powerTransfer.locked,#skill-powerTransfer.locked:hover
{
	background-position: -1304px -348px !important;
	background-image: url('../media/skills.png');
}

#skill-negotiations {
	background-position: -783px -1000px !important;
}

#skill-negotiations:hover {
	background-position: -870px -1000px !important;
}

#skill-negotiations.ui-button-disabled,#skill-negotiations.ui-button-disabled:hover
{
	background-position: -957px -1000px !important;
}

#skill-negotiations.locked,#skill-negotiations.locked:hover
{
	background-position: -1304px -870px !important;
	background-image: url('../media/skills.png');
}

#skill-assign {
	background-position: -783px -1087px !important;
}

#skill-assign:hover {
	background-position: -870px -1087px !important;
}

#skill-assign.ui-button-disabled,#skill-assign.ui-button-disabled:hover
{
	background-position: -957px -1087px !important;
}

#skill-assign.locked,#skill-assign.locked:hover
{
	background-position: -1304px -957px !important;
	background-image: url('../media/skills.png');
}

#skill-takeCare {
	background-position: -783px -826px !important;
}

#skill-takeCare:hover {
	background-position: -870px -826px !important;
}

#skill-takeCare.ui-button-disabled,#skill-takeCare.ui-button-disabled:hover
{
	background-position: -957px -826px !important;
}

#skill-takeCare.locked,#skill-takeCare.locked:hover
{
	background-position: -1304px -696px !important;
	background-image: url('../media/skills.png');
}

#skill-recharge {
	background-position: -783px -913px !important;
}

#skill-recharge:hover {
	background-position: -870px -913px !important;
}

#skill-recharge.ui-button-disabled,#skill-recharge.ui-button-disabled:hover
{
	background-position: -957px -913px !important;
}

#skill-recharge.locked,#skill-recharge.locked:hover
{
	background-position: -1304px -783px !important;
	background-image: url('../media/skills.png');
}

#skill-regeneration {
	background-position: -783px -304px !important;
}

#skill-regeneration:hover {
	background-position: -870px -304px !important;
}

#skill-regeneration.ui-button-disabled,#skill-regeneration.ui-button-disabled:hover
{
	background-position: -957px -304px !important;
}

#skill-regeneration.locked,#skill-regeneration.locked:hover
{
	background-position: -1304px -174px !important;
	background-image: url('../media/skills.png');
}

/** Funkcja respawn **/
.respawn-bubble {
	z-index: 1000;
	position: absolute;
	font-size: 14px;
	width: auto;
	height: auto;
	padding: 10px;
	background: #d75527;
	display: none;
}

.respawn-bubble:after {
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 7px 18px 7px 0;
	border-color: transparent #d75527;
	display: block;
	width: 0;
	z-index: 1000;
	left: -17px;
	top: 13px;
}

.respawn-div {
	width: 305px;
	height: 124px;
	top: 91px;
	left: 50%;
	margin-left: -130px;
	display: none;
	background-image: url('../media/logout_panel.png');
	background-size: 304px;
}

#respawn-text-1 {
	position: absolute;
	top: 27px;
	left: 0;
	width: 100%;
	text-align: center;
	font-size: 16px;
	text-transform: uppercase;
}

.respawnText-div {
	width: 70px;
	height: 18px;
	display: block;
	float: left;
}

.respawnButton-div {
	width: 70px;
	height: 18px;
	display: block;
	float: left;
}

.respawn-button {
	cursor: pointer;
	display: block;
	width: 207px;
	height: 49px;
	background: none;
	position: absolute;
	background-image: url('../media/buttons.png');
	background-position: -209px 0px;
	top: 50px;
	right: 50px;
	border: none;
	color: white;
	text-transform: uppercase;
	font-size: 23px;
	line-height: 1px;
	outline: none;
}

.respawn-button:hover {
	background-position: -209px -50px;
}

.respawn-text {
	font-size: 12px;
	color: black;
	text-align: center;
	display: block;
	width: 70px;
	height: 18px;
	display: none;
}

/** Tutorial **/
.tutorial-arrow,
.tutorial-arrow2,
.tutorial-arrow3 {
	display: none;
	position: absolute;
	width: 50px;
	height: 50px;
	top: 50%;
	left: 50%;
	background-size: 50px;
	transform: rotate(90deg);
	z-index: 200 !important;
}

.tutorial-bubble {
	display: none;
	position: absolute;
	width: 246px;
	right: 10px;
	bottom: 262px;
	padding: 10px;
	padding-bottom: 10px;
	background: white;
	-moz-border-radius: 12px;
	z-index: 101;
	color: black;
	font-size: 14px;
	text-align: center;
}

.tutorial-bubble:after {
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 41px 8px 0;
	border-color: white transparent;
	display: block;
	width: 0;
	z-index: 1;
	bottom: -30px;
	left: 8px;
	z-index: 1000;
	transform: rotate(40deg);
}

.tutorial-bubble:before {
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 15px 15px 0;
	border-color: transparent;
	display: block;
	width: 0;
	z-index: 0;
	bottom: -18px;
	left: 11px;
	z-index: 1000;
}

.tutorial-button {
	background: none;
	background-image: url('../media/role_select_screen_buttons.png');
	background-position: 0 -338px;
	border: none;
	width: 139px;
	height: 27px;
	color: white;
	text-transform: uppercase;
	margin: 10px auto 4px;
	opacity: 1 !important;
	outline: none;
	cursor: pointer;
	font-family: 'Exo', sans-serif;
	font-weight: 700;
	font-size: 13px;
	line-height: 25px;
}

.tutorial-button:hover {
	background-position: 0 -365px;
}

.tutorial-button-disabled,.tutorial-button-disabled:hover {
	background-position: 0 -392px !important;
}

/** Player dissconect **/
.disconnect-div {
	position: absolute;
	width: 200px;
	height: 100px;
	top: 50%;
	right: 50%;
	margin-top: -50px;
	margin-right: -100px;
	display: none;
	background-color: #72C658;
	z-index: 101;
}

.disconnectX-button {
	position: absolute;
	width: 30px;
	height: 30px;
	top: 0%;
	right: 0%;
	cursor: pointer;
	padding: 0px;
	display: block;
	font-size: 14px;
	font-color: black;
	text-align: center;
	vertical-align: middle;
	line-height: 30px;
}

.disconnectLeave-button {
	position: absolute;
	width: 90px;
	height: 30px;
	bottom: 0%;
	right: 50%;
	margin-right: -45px;
	cursor: pointer;
	padding: 0px;
	display: block;
	font-size: 14px;
	font-color: blue;
	text-align: center;
	vertical-align: middle;
	line-height: 90px;
}

/** Główne elementy ui gry **/
.avatar-self {
	width: 181px;
	height: 149px;
	bottom: 35px;
	left: 0;
	background: none;
	background-image: url('../media/ui.png');
	background-position: -156px -216px;
}

#avatar-self-image {
	width: 129px;
	height: 108px;
	position: absolute;
	bottom: 27px;
	left: 36px;
}

.avatar-self-image-tank-male {
	background-image: url('../media/ui.png');
	background-position: -520px -650px;
}

.avatar-self-image-tank-female {
	background-image: url('../media/ui.png');
	background-position: -650px -650px;
}

.avatar-self-image-dps1-male {
	background-image: url('../media/ui.png');
	background-position: -520px -780px;
}

.avatar-self-image-dps1-female {
	background-image: url('../media/ui.png');
	background-position: -650px -780px;
}

.avatar-self-image-dps2-male {
	background-image: url('../media/ui.png');
	background-position: -520px -910px;
}

.avatar-self-image-dps2-female {
	background-image: url('../media/ui.png');
	background-position: -650px -910px;
}

.avatar-self-image-healer-male {
	background-image: url('../media/ui.png');
	background-position: -520px -1040px;
}

.avatar-self-image-healer-female {
	background-image: url('../media/ui.png');
	background-position: -650px -1040px;
}

.avatar-tank-image-male {
	background-image: url('../media/ui.png');
	background-position: -457px -560px;
	background-size: 950px;
}

.avatar-tank-image-female {
	background-image: url('../media/ui.png');
	background-position: -568px -560px;
	background-size: 950px;
}

.avatar-dps1-image-male {
	background-image: url('../media/ui.png');
	background-position: -457px -674px;
	background-size: 950px;
}

.avatar-dps1-image-female {
	background-image: url('../media/ui.png');
	background-position: -568px -674px;
	background-size: 950px;
}

.avatar-dps2-image-male {
	background-image: url('../media/ui.png');
	background-position: -457px -786px;
	background-size: 950px;
}

.avatar-dps2-image-female {
	background-image: url('../media/ui.png');
	background-position: -568px -786px;
	background-size: 950px;
}

.avatar-healer-image-male {
	background-image: url('../media/ui.png');
	background-position: -457px -895px;
	background-size: 950px;
}

.avatar-healer-image-female {
	background-image: url('../media/ui.png');
	background-position: -568px -895px;
	background-size: 950px;
}

#avatar-self-energy {
	position: absolute;
	bottom: 11px;
	left: 41px;
}

.avatar-target {
	width: 102px;
	height: 102px;
	bottom: 31px;
	right: 312px;
	background: transparent;
}

#avatar-target-background {
	width: 157px;
	height: 144px;
	background-image: url('../media/ui.png');
	position: absolute;
	bottom: 7px;
	right: 276px;
	background-position: 1px -216px;
}

.menu {
	width: 300px;
	height: 40px;
	top: 0px;
	right: -150px;
	margin-right: 50%;
}

.players-energy {
	width: 133px;
	height: 389px;
	top: 100px;
	left: 0;
	background: transparent;
	background-image: url('../media/ui.png');
	background-position: -479px -115px;
	padding-top: 17px;
}

.players-energy-spectate {
	width: 133px;
	height: 240px;
	top: 100px;
	left: 0;
	background: transparent;
	background-image: url('../media/ui.png');
	background-position: -479px -115px;
	padding-top: 17px;
}

.players-energy2 {
	display: none;
	width: 133px;
	height: 257px;
	top: 333px;
	left: 0;
	background: transparent;
	background-image: url('../media/ui.png');
	background-position: -479px -229px;
	padding-top: 17px;
	z-index: 0;
}

.avatar-image {
	position: relative;
	width: 96px;
	height: 97px;
	margin-left: 18px;
	float: left;
	display: none;
}

.players-energy-bar {
	position: relative;
	margin-left: 18px;
	margin-top: 6px;
	margin-bottom: 7px;
	float: left;
	background: #ffffff;
	display: none;
}

#task-button {
	position: absolute;
	font-size: 8px;
	bottom: 184px;
	right: 32px;
	width: 59px;
	height: 22px;
	border: none;
	background-image: url('../media/ui.png');
	background-position: 0px -66px;
	z-index: 10;
	text-transform: uppercase;
	color: white;
	outline: none;
	cursor: pointer;
}

#task-button:hover {
	background-position: -59px -66px;
}

#dev-info {
	position: absolute;
	top: 10px;
	right: 60px;
	width: 30px;
	height: 20px;
	background: red;
	color: white;
	border-radius: 30px;
	-moz-border-radius: 30px;
	-webkit-border-radius: 30px;
	font-size: 9px;
	text-align: center;
	padding-top: 10px;
}

.ui-button {
	font-family: 'Exo', sans-serif;
	font-weight: 700;
	background: rgba(180, 180, 180, 1);
	color: white;
	text-align: center;
	line-height: 52px;
	cursor: pointer !important;
	display: block;
	margin: 0;
	padding: 0;
	width: 210px;
	height: 50px;
	background: transparent;
	border: none;
	background-image: url("../media/buttons.png");
	text-transform: uppercase;
	font-size: 18px;
	outline: none;
}

.ui-button:hover {
	background-position: 0px -50px;
}

.ui-button-disabled,.ui-button-disabled:hover {
	cursor: default;
	background-position: 0px -100px;
}

.ui-button-inverted {
	background-position: 0px -150px;
}

.ui-button-inverted:hover {
	background-position: 0px -200px;
}

.ui-button-inverted-disabled,.ui-button-disabled:hover {
	background-position: 0px -250px !important;
}

.ui-button-warning {
	background-position: -210px 0px;
}

.ui-button-warning:hover {
	background-position: -210px -50px;
}

.ui-button-warning-disabled .ui-button-warning:hover {
	background-position: -210px -100px;
}

#logout-panel {
	position: absolute;
	top: 39px;
	right: 10px;
	min-height: 0px;
	z-index: 999;
	background-color: #222;
	display: none;
	padding: 20px;
	font-size: 14px;
}

#logout-panel a {
	text-transform: uppercase;
	text-decoration: none;
}

#logout-panel a:hover {
	color: #3aabf2;
}

.logout-tutorial-ico {
	position: absolute;
	display: none;
	z-index: 102;
	top: 10px;
	right: 0px;
	font-size: 9px;
	cursor: pointer;
	margin-right: 10px;
	opacity: 0.5;
	background-image: url("../media/role_select_screen_buttons.png");
	background-position: -50px 0px;
	background-color: red;
	width: 20px;
	height: 20px;
}

.logout-tutorial-ico:hover {
	opacity: 1;
}

.logout-tutorial-panel {
	display: none;
	width: 440px;
	height: 180px;
	margin: auto;
	overflow: auto;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-image: url("../media/logout_panel.png");
}

.logout-tutorial-text {
	position: absolute;
	width: 100%;
	top: 48px;
	left: 0px;
	text-align: center;
}

.logout-tutorial-button-do {
	position: absolute;
	top: 89px;
	left: 10px;
	color: white;
	text-align: center;
	line-height: 50px;
	cursor: pointer !important;
	display: block;
	margin: 0;
	padding: 0;
	width: 210px;
	height: 50px;
	background: transparent;
	border: none;
	background-image: url("../media/buttons.png");
	background-position: 0px -150px;
	text-transform: uppercase;
	font-size: 14px;
	outline: none;
}

.logout-tutorial-button-do:hover {
	background-position: 0px -200px;
}

.logout-tutorial-button-cancel {
	position: absolute;
	top: 89px;
	left: 223px;
	color: white;
	text-align: center;
	line-height: 50px;
	cursor: pointer !important;
	display: block;
	margin: 0;
	padding: 0;
	width: 210px;
	height: 50px;
	background: transparent;
	border: none;
	background-image: url("../media/buttons.png");
	background-position: -210px 0px;
	text-transform: uppercase;
	font-size: 14px;
	outline: none;
}

.logout-tutorial-button-cancel:hover {
	background-position: -210px -50px;
}

.tutorial-workshop1-ico {
	position: relative;
	display: none;
	float: left;
	background-image: url('../media/balloon.png');
	background-position: 0px 0px;
	width: 50px;
	height: 50px;
	margin-left: 70px;
}

.tutorial-workshop2-ico {
	position: relative;
	display: none;
	float: left;
	background-image: url('../media/balloon.png');
	background-position: -150px 0px;
	width: 50px;
	height: 50px;
	margin-right: 50px;
}

.tutorial-workshop3-ico {
	position: relative;
	display: none;
	float: left;
	background-image: url('../media/balloon.png');
	background-position: -50px 0px;
	width: 50px;
	height: 50px;
	margin-left: 70px;
}

.tutorial-workshop4-ico {
	position: relative;
	display: none;
	float: left;
	background-image: url('../media/balloon.png');
	background-position: -100px 0px;
	width: 50px;
	height: 50px;
	margin-right: 50px;
}

#logout-ico {
	position: absolute;
	z-index: 102;
	top: 10px;
	right: 0px;
	font-size: 9px;
	cursor: pointer;
	margin-right: 10px;
	opacity: 0.5;
	background-image: url("../media/role_select_screen_buttons.png");
	background-position: -50px 0px;
	width: 20px;
	height: 20px;
}

#logout-ico:hover {
	opacity: 1;
}

#game-logout {
	color: #fff;
	outline: none;
}

#logout-ico a {
	color: white;
}

#logout {
	color: #fff;
	font-weight: bold;
}

.game-round {
	position: absolute;
	top: 10px;
	left: 10px;
	z-index: 1;
}

.game-time {
	position: absolute;
	top: 35px;
	letter-spacing: 5px;
	left: 50%;
	margin-left: -34px;
	font-size: 36px;
	z-index: 1;
}

.round-number {
	position: absolute;
	display: block;
	top: 11px;
	left: 595px;
	font-size: 12px;
	font-family: 'Exo', sans-serif;
	text-align: center;
	z-index: 1;
}

.player-cash {
	position: absolute;
	top: 34px;
	width: 100px;
	text-align: right;
	left: 50%;
	margin-left: -191px;
	z-index: 1;
	font-size: 20px;
}

.company-cash {
	position: absolute;
	top: 10px;
	left: 50%;
	margin-left: 80px;
	z-index: 1;
	position: absolute;
	top: 34px;
	width: 100px;
	text-align: right;
	left: 50%;
	z-index: 1;
	font-size: 20px;
}

.player-profit {
	position: absolute;
	display: block;
	opacity: 0;
	top: 91px;
	right: 694px;
	width: 60px;
	height: 30px;
	background: rgba(57, 193, 77, 0.7);
	border-radius: 7px 7px 7px 7px;
	text-align: center;
	font-family: 'Exo', sans-serif;
	padding-top: 8px;
}

.company-profit {
	position: absolute;
	display: block;
	opacity: 0;
	top: 91px;
	right: 399px;
	width: 60px;
	height: 30px;
	background: rgba(57, 193, 77, 0.7);
	border-radius: 7px 7px 7px 7px;
	text-align: center;
	font-family: 'Exo', sans-serif;
	padding-top: 8px;
}

.player-profit-glass {
	position: absolute;
	display: block;
	top: 0px;
	right: 0px;
	width: 60px;
	height: 18px;
	background: rgba(255, 252, 255, 0.1);
	border-radius: 7px 7px 0px 0px;
}

.company-profit-glass {
	position: absolute;
	display: block;
	top: 0px;
	right: 0px;
	width: 60px;
	height: 18px;
	background: rgba(255, 252, 255, 0.1);
	border-radius: 7px 7px 0px 0px;
}

.in-game-message {
	background: white;
	width: 400px;
	height: auto;
	min-height: 200px;
	left: 50%;
	top: 50%;
	margin-left: -200px;
	margin-top: -100px;
	text-align: center;
	padding: 10px;
	color: black;
}

.ajax-loader {
	width: 32px;
	height: 32px;
	background-image: url('../media/ajax-loader.gif');
	display: block;
}

#modal-window {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 999;
	display: none;
}

#ui-button-logout {
	position: absolute;
	top: 89px;
	left: 10px;
}

#ui-button-complete-logout {
  position: absolute;
  top: 89px;
  left: 120px;
}

#ui-button-logout-cancel {
	position: absolute;
	top: 89px;
	left: 223px;
}

#modal-content-holder {
	width: 440px;
	height: 180px;
	margin: auto;
	overflow: auto;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-image: url("../media/logout_panel.png");
}

#modal-window-logout-info {
	position: absolute;
	width: 100%;
	top: 48px;
	left: 0px;
	text-align: center;
}

#game-logout-close {
	float: right;
	display: block;
	margin-top: 20px;
	margin-right: 20px;
	cursor: pointer;
}

#game-logout-close:hover {
	text-decoration: underline;
}

#tooltip {
	color: #fff;
	font-size: 30px;
	background-color: #444;
	position: absolute;
	z-index: 1000;
}

#ui-create-figure-background {
	background-color: #fff;
	width: 100%;
	height: 100%;
	position: absolute;
	z-index: 999;
}

.sex-clicked {
	border: solid 3px #fff;
}

#ui-create-figure-buttons-panel {
	width: 300px;
	background-color: #060;
	position: absolute;
	z-index: 1001;
	min-height: 400px;
}

#ui-create-figure-buttons-panel p {
	cursor: pointer;
	padding: 20px;
}

#ui-create-figure-role-image-panel {
	width: 400px;
	background-color: #09f;
	position: absolute;
	left: 300px;
}

#ui-create-figure-help-text {
	background-color: #0066A4;
	color: #fff;
}

#ui-start-game {
	position: absolute;
	right: 100px;
	top: 100px;
	z-index: 1000;
}

#ui-create-figure-description-text {
	position: absolute;
	right: 0px;
	top: 200px;
	z-index: 1000;
	width: 200px;
	background-color: #666;
	color: #fff;
}

#start-game-loader {
	position: absolute;
	z-index: 1000;
	top: 110px;
	right: 320px;
	display: none;
}

.create-figure-holder {
	height: 25px;
	padding: 7px;
}

.create-figure-holder span {
	cursor: pointer;
}

.create-figure-holder img {
	padding-right: 20px;
}

#ui-playground-screen {
	background-color: #06c;
	width: 700px;
	margin: auto;
}

.ui-playground-screen-buttons {
	padding: 20px;
	cursor: pointer;
}

.ui-playground-screen-buttons:hover {
	background-color: #5f9ea0;
}

.ui-time-loader {
	width: 100px;
	height: 30px;
	border: solid 2px #fff;
}

.loader-progress-bar {
	background-color: #81c54f;
}

.playground-row {
	padding: 5px;
	border-bottom: solid 1px #fff;
	position: relative;
	height: 50px;
}

.tutorial-part-ico {
	width: 31px;
	height: 40px;
	background-image: url('../media/playground_buttons.png');
	display: block;
	position: absolute;
	background-position: -222px -40px;
}

.playground-row button {
	position: absolute;
	left: 50px;
}

.tutorial-part-ico.completed {
	background-position: -222px 0;
}

.tutorial-part-ico.notcompleted {
	text-align: right;
	vertical-align: middle;
	line-height: 40px;
	padding-top: 4px;
}
.time-loader {
	position: absolute;
	border: 1px solid white;
}

.progress-bar {
	position: absolute;
	top: 0;
	left: 0;
	background: #81c54f;
	height: 100%;
	overflow: hidden;
}

.progress-bar:after {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	width: 10px;
	height: 100%;
	background: #fff;
	opacity: 0.2;
}

.progress-bar:before {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	width: 5px;
	height: 100%;
	background: #fff;
	opacity: 0.2;
}

/** Ekran powitalny gry **/
#welcome-screen {
	width: 520px;
	min-height: 576px;
	margin: auto;
	position: relative;
	margin-top: 30px;
	background-image: url('../media/welcome_screen_background.png');
}

.welcome-screen-income-role {
	width: 200px;
	height: 30px;
	float: left;
	position: absolute;
	top: 410px;
}

.welcome-screen-income-ico-role {
	width: 20px;
	height: 20px;
	background-color: #ffff00;
	position: absolute;
	left: 10px;
}

#welcome-screen-loader {
	position: absolute;
	bottom: 44px;
	left: 26px;
	border: none;
}

.welcome-screen-income-value-role {
	position: absolute;
	left: 50px;
	font-size: 21px;
	display: block;
}

#ui-button-ready {
	position: absolute;
	bottom: 32px;
	right: 27px;
	font-size: 14px;
}

#ui-role-income-value-role1 {
	position: absolute;
	left: 408px;
	text-align: right;
	width: 25px;
	font-family: 'Exo', sans-serif;
	font-weight: 700;
	top: -1px;
}

#ui-role-income-ico-role1 {
	position: absolute;
	left: 435px;
}

#ui-role-income-value-role2 {
	position: absolute;
	left: 248px;
	text-align: right;
	width: 25px;
	font-family: 'Exo', sans-serif;
	font-weight: 700;
	top: -1px;
}

#ui-role-income-ico-role2 {
	position: absolute;
	left: 275px;
}

#ui-role-income-value-role3 {
	position: absolute;
	left: 88px;
	text-align: right;
	width: 25px;
	font-family: 'Exo', sans-serif;
	font-weight: 700;
	top: -1px;
}

#ui-role-income-ico-role3 {
	position: absolute;
	left: 115px;
}

#ui-income-info {
	color: #3b88c2;
	position: absolute;
	top: 345px;
	left: 25px;
	font-weight: bold;
	font-size: 20px;
	font-family: 'Exo', sans-serif;
	font-weight: 700;
}

#ui-player-objective-label {
	color: #3b88c2;
	position: absolute;
	top: 174px;
	left: 25px;
	font-size: 20px;
	font-family: 'Exo', sans-serif;
	font-weight: 700;
}

#ui-player-role-info {
	top: 123px;
	left: 220px;
	position: absolute;
	font-size: 21px;
	font-family: 'Exo', sans-serif;
	font-weight: 700;
}

#ui-round-info-label {
	font-family: 'Exo', sans-serif;
	font-weight: 700;
	position: absolute;
	top: 50px;
	left: 0;
	width: 100%;
	text-align: center;
	font-size: 25px;
	text-transform: uppercase;
}

#ui-player-objective-info {
	position: absolute;
	top: 200px;
	left: 24px;
	width: 480px;
	font-size: 16px;
}

#ui-player-objective-info div {
	font-size: 14px;
	margin-bottom: 10px;
}

#ui-player-role-label {
	color: #3b88c2;
	position: absolute;
	top: 124px;
	left: 25px;
	font-size: 20px;
	font-family: 'Exo', sans-serif;
	font-weight: 700;
}

.cluster-dollar {
	background-image: url('../media/summary_screen_icons.png');
	width: 15px;
	height: 25px;
	background-position: -13px -169px;
}

.ui-player-role-icon {
	background-image: url('../media/summary_screen_icons.png');
	width: 40px;
	height: 40px;
	position: absolute;
	top: 115px;
	left: 168px;
}

.ui-player-role-icon-dps1 {
	background-position: 0 -40px;
}

.ui-player-role-icon-dps2 {
	background-position: 0 -80px;
}

.ui-player-role-icon-tank {
	
}

.ui-player-role-icon-healer {
	background-position: 0 -120px;
}

/** Ekran wyboru postaci **/
#role-select-screen-inner {
	width: 700px;
	height: 560px;
	margin: 0 auto;
	margin-top: 62px;
	position: relative;
	background-image: url("../media/role_select_screen_background.png");
	background-size: 100%;
}

@media ( min-height : 540px) {
	#role-select-screen-inner {
		margin-top: -70px;
	}
}

@media ( min-height : 640px) {
	#role-select-screen-inner {
		margin-top: 30px;
	}
}

#role-select-screen-text-2 {
	text-align: center;
	position: absolute;
	top: 110px;
	left: 200px;
	font-size: 14px;
	width: 310px;
}

#ui-role-select-screen-close,.ui-close-button-disabled {
	background: transparent;
	width: 20px;
	height: 20px;
	margin: 0;
	padding: 0;
	line-height: 0;
	position: absolute;
	top: 105px;
	right: 16px;
	opacity: 0.5;
	background-image: url("../media/role_select_screen_buttons.png");
	background-position: -50px 0px;
}

#ui-role-select-screen-close:hover,.ui-close-button-disabled:hover {
	opacity: 1;
}

#ui-sex-male-button {
	display: none;
}

#ui-sex-male-button+#ui-sex-male-label {
	cursor: pointer;
	position: absolute;
	top: 235px;
	left: 20px;
	width: 25px;
	height: 25px;
	background-image: url("../media/role_select_screen_buttons.png");
	background-position: -25px 0px;
}

#ui-sex-male-button:checked+#ui-sex-male-label {
	background-position: 0px 0px;
}

#ui-sex-female-button {
	display: none;
}

#ui-sex-female-button+#ui-sex-female-label {
	cursor: pointer;
	display: block;
	position: absolute;
	top: 235px;
	left: 55px;
	width: 25px;
	height: 25px;
	background-image: url("../media/role_select_screen_buttons.png");
	background-position: -25px -25px;
}

#ui-sex-female-button:checked+#ui-sex-female-label {
	background-position: 0px -25px;
}

#ui-sex-female-button+#ui-sex-female-label:hover {
	background-position: -50px -25px;
}

#ui-sex-male-button+#ui-sex-male-label:hover {
	background-position: -75px -25px;
}

/** Przyciski ról **/
#role-dps1-button,#role-tank-button,#role-dps2-button,#role-healer-button
	{
	display: none;
}

/** Checked **/
#role-healer-button:checked+#role-healer-label {
	top: 420px;
	background-position: 0px -218px;
}

#role-dps1-button:checked+#role-dps1-label {
	top: 330px;
	background-position: 0px -146px;
}

#role-tank-button:checked+#role-tank-label {
	top: 360px;
	background-position: 0px -290px;
}

#role-dps2-button:checked+#role-dps2-label {
	top: 390px;
	background-position: 0px -74px;
}

/* Disabled */
#role-dps1-button[disabled="true"]+#role-dps1-label {
	top: 330px;
	background-position: 0px -170px;
	color: #444;
}

#role-dps2-button[disabled="true"]+#role-dps2-label {
	top: 390px;
	background-position: 0px -98px;
	color: #444;
}

#role-healer-button[disabled="true"]+#role-healer-label {
	top: 420px;
	background-position: 0px -242px;
	color: #444;
}

#role-tank-button[disabled="true"]+#role-tank-label {
	top: 360px;
	background-position: 0px -314px;
	color: #444;
}

/* Normal */
#role-dps1-button+#role-dps1-label {
	top: 330px;
	background-position: 0px -122px;
}

#role-tank-button+#role-tank-label {
	top: 360px;
	background-position: 0px -266px;
}

#role-dps2-button+#role-dps2-label {
	top: 390px;
	background-position: 0px -50px;
}

#role-healer-button+#role-healer-label {
	top: 420px;
	background-position: 0px -194px;
}

#role-dps1-button+#role-dps1-label,#role-tank-button+#role-tank-label,#role-dps2-button+#role-dps2-label,#role-healer-button+#role-healer-label
	{
	text-indent: 35px;
	font-size: 14px;
	line-height: 26px;
	cursor: pointer;
	display: block;
	position: absolute;
	left: 20px;
	width: 162px;
	height: 24px;
	font-family: 'Exo', sans-serif;
	font-weight: 700;
	background-image: url("../media/role_select_screen_buttons.png");
}
/** Ikony  **/
.role-select-screen-ico {
	width: 25px;
	height: 25px;
	position: absolute;
	border: none;
}

.role-select-screen-ico.active {
	background-image: url("../media/role_select_screen_buttons.png");
	background-position: -100px -25px;
}

#ui-role-dps1-ico {
	top: 330px;
	left: 157px;
}

#ui-role-tank-ico {
	top: 360px;
	left: 157px;
}

#ui-role-dps2-ico {
	top: 390px;
	left: 157px;
}

#ui-role-healer-ico {
	top: 420px;
	left: 157px;
}

/** Postaci **/
#ui-image-dps1-male,#ui-image-dps1-female,#ui-image-tank-male,#ui-image-tank-female,#ui-image-dps2-male,#ui-image-dps2-female,#ui-image-healer-male,#ui-image-healer-female
	{
	width: 230px;
	height: 230px;
	position: absolute;
	top: 260px;
	left: 240px;
	display: none;
	background-image: url("../media/role_select_screen_roles.png");
}

#ui-image-tank-male {
	background-position: 0px 0px;
}

#ui-image-tank-female {
	background-position: -230px 0px;
}

#ui-image-dps1-male {
	background-position: 0px -230px;
}

#ui-image-dps1-female {
	background-position: -230px -230px;
}

#ui-image-dps2-male {
	background-position: 0px -460px;
}

#ui-image-dps2-female {
	background-position: -230px -460px;
}

#ui-image-healer-male {
	background-position: 0px -690px;
}

#ui-image-healer-female {
	background-position: -230px -690px;
}

#role-select-screen-start-button {
	position: absolute;
	top: 466px;
	left: 506px;
	width: 138px;
	height: 27px;
	padding: 0;
	background-image: url("../media/role_select_screen_buttons.png");
	background-position: 0px -338px;
	line-height: 30px;
	font-size: 12px;
}

#role-select-screen-start-button:hover {
	background-position: 0px -365px;
}

.role-select-screen-start-button-disabled {
	background-position: 0px -392px !important;
	color: #444 !important;
}

#roles-description-div {
	position: absolute;
	top: 245px;
	left: 510px;
	font-size: 12px;
	width: 165px;
	overflow: auto;
	height: 189px;
	padding-right: 15px;
}

#role-select-screen-sex {
	position: absolute;
	top: 200px;
	left: 20px;
	font-size: 13px;
	font-family: 'Exo', sans-serif;
	font-weight: 700;
}

#role-select-screen-role {
	position: absolute;
	top: 295px;
	left: 20px;
	font-size: 13px;
	font-family: 'Exo', sans-serif;
	font-weight: 700;
}

/** Nie znaleziono drużyny **/
#ui-no-players-label {
	position: absolute;
	top: 45px;
	left: 18px;
	width: 412px;
	text-align: center;
}

#ui-no-players-button {
	position: absolute;
	top: 89px;
	left: 50%;
	margin-left: -106px;
}

/*** SCROLLBAR **/
::-webkit-scrollbar {
	width: 8px;
}

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

::-webkit-scrollbar-track {
	background: #eee;
	border: thin solid lightgray;
	box-shadow: 0px 0px 3px #dfdfdf inset;
	border-radius: 10px;
}

::-webkit-scrollbar-thumb {
	background: #999;
	border: thin solid gray;
	border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
	background: #7d7d7d;
}

/** Ekran szkolenia **/
#playground-inner-container {
	width: 451px;
	height: 349px;
	margin: 0 auto;
	margin-top: 142px;
	position: relative;
	background-image: url('../media/playground_background.png');
}

#demo-menu-inner-container {
	width: 451px;
	height: 349px;
	margin: 0 auto;
	margin-top: 142px;
	position: relative;
	background-image: url('../media/playground_background.png');
}

#ui-playground-screen-close,
#ui-demo-screen-close {
	background: transparent;
	width: 20px;
	height: 20px;
	margin: 0;
	padding: 0;
	line-height: 0;
	position: absolute;
	top: 25px;
	right: 16px;
	opacity: 0.5;
	background-image: url("../media/role_select_screen_buttons.png");
	background-position: -50px 0px;
}

#ui-playground-screen-close:hover {
	opacity: 1;
}

#playground-text,
#demo-menu-text {
	font-family: 'Exo', sans-serif;
	font-weight: 700;
	position: absolute;
	top: 32px;
	height: 63px;
	margin: 0;
	left: 115px;
	width: 220px;
	text-align: center;
	text-transform: uppercase;
	font-size: 21px;
	line-height: 56px;
}

#playground-1-button,
#demo-1-button {
	background-image: url('../media/playground_buttons.png');
	width: 222px;
	height: 45px;
	top: 100px;
	position: absolute;
	left: 50%;
	margin-left: -110px;
	line-height: 47px;
	font-size: 16px;
	background-position: 0 -45px;
	text-indent: -40px;
}

#demo-1-button {
	text-indent: 0;
}


#playground-1-button:hover,
#demo-1-button:hover,
#demo-2-button:hover,
#demo-3-button:hover {
	background-position: 0 0;
}

#playground-1-ico {
	left: 294px;
	top: 99px;
}

.playground-number {
	font-family: 'Exo', sans-serif;
	font-size: 16px;
	color: white;
	text-align: left;
	display: block;
	position: absolute;
	width: 20px;
	height: 20px;
	left: 128px;
}

#playground-1-number {
	top: 112px;
}

#playground-2-number {
	top: 162px;
}

#playground-3-number {
	top: 212px;
}

#playground-4-number {
	top: 262px;
}

#playground-2-button,
#demo-2-button{
	background-image: url('../media/playground_buttons.png');
	width: 222px;
	height: 45px;
	top: 150px;
	position: absolute;
	left: 50%;
	margin-left: -110px;
	line-height: 0px;
	font-size: 16px;
	background-position: 0 -180px;
}
#demo-2-button {
	background-position: 0 -45px;
}

#playground-2-button:hover{
	background-position: 0 -135px;
}

#playground-2-button.ui-button-disabled,#playground-2-button.ui-button-disabled:hover
	{
	background-position: 0 -225px !important;
}

#playground-2-ico {
	top: 149px;
	left: 294px;
}

#playground-3-button,
#demo-3-button{
	background-image: url('../media/playground_buttons.png');
	width: 222px;
	height: 45px;
	top: 200px;
	position: absolute;
	left: 50%;
	margin-left: -110px;
	line-height: 0px;
	font-size: 16px;
	background-position: 0 -315px;
}

#demo-3-button {
	background-position: 0 -45px;
}

#playground-3-button:hover{
	background-position: 0 -270px;
}

#playground-3-button.ui-button-disabled,#playground-3-button.ui-button-disabled:hover
	{
	background-position: 0 -360px !important;
}

#demo-2-button.ui-button-disabled,
#demo-2-button.ui-button-disabled:hover,
#demo-3-button.ui-button-disabled,
#demo-3-button.ui-button-disabled:hover {
	background-position: 0 -90px !important;
}

#playground-3-ico {
	top: 199px;
	left: 294px;
}

#playground-4-button {
	background-image: url('../media/playground_buttons.png');
	width: 222px;
	height: 45px;
	top: 250px;
	position: absolute;
	left: 50%;
	margin-left: -110px;
	line-height: 0px;
	font-size: 16px;
	background-position: 0 -450px;
}

#playground-4-button:hover {
	background-position: 0 -405px;
}

#playground-4-button.ui-button-disabled,#playground-4-button.ui-button-disabled:hover
	{
	background-position: 0 -495px !important;
}

#playground-4-ico {
	top: 249px;
	left: 294px;
}

/** Wyposażenie **/
#gear-bar {
	width: 160px;
	height: 60px;
	bottom: 183px;
	left: 21px;
	position: absolute;
	background-image: url('../media/ui.png');
	background-position: -614px -230px;
}

.gear-bar-1 {
	position: absolute;
	float: none;
	top: 0px;
	left: 0px;
	width: 40px !important;
	height: 60px !important;
	z-index: 20;
}

.gear-bar-2 {
	position: absolute;
	float: none;
	top: 0px;
	left: 40px;
	width: 40px;
	height: 60px;
	z-index: 20;
}

.gear-bar-3 {
	position: absolute;
	float: none;
	top: 0px;
	left: 80px;
	width: 40px;
	height: 60px;
	z-index: 20;
}

.gear-bar-4 {
	position: absolute;
	float: none;
	top: 0px;
	left: 120px;
	width: 40px;
	height: 60px;
	z-index: 20;
}

.gear-bubble-1 {
	display: none;
	position: absolute;
	left: 27px;
	bottom: 256px;
	width: auto;
	font-size: 14px;
	padding: 10px;
	background: #d75527;
	-moz-border-radius: 12px;
	max-width: 200px;
	z-index: 1000;
}

.gear-bubble-1:after {
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 25px 7px 0;
	border-color: #d75527 transparent;
	display: block;
	width: 0;
	z-index: 1;
	bottom: -25px;
	left: 14px;
	z-index: 1000;
}

.gear-bubble-1:before {
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 15px 15px 0;
	border-color: transparent;
	display: block;
	width: 0;
	z-index: 0;
	bottom: -18px;
	left: 11px;
	z-index: 1000;
}

.gear-bubble-2 {
	display: none;
	position: absolute;
	left: 67px;
	bottom: 256px;
	width: auto;
	font-size: 14px;
	padding: 10px;
	background: #d75527;
	-moz-border-radius: 12px;
	max-width: 200px;
	z-index: 1000;
}

.gear-bubble-2:after {
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 25px 7px 0;
	border-color: #d75527 transparent;
	display: block;
	width: 0;
	z-index: 1;
	bottom: -25px;
	left: 14px;
	z-index: 1000;
}

.gear-bubble-2:before {
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 15px 15px 0;
	border-color: transparent;
	display: block;
	width: 0;
	z-index: 0;
	bottom: -18px;
	left: 11px;
	z-index: 1000;
}

.gear-bubble-3 {
	display: none;
	position: absolute;
	left: 107px;
	bottom: 256px;
	width: auto;
	font-size: 14px;
	padding: 10px;
	background: #d75527;
	-moz-border-radius: 12px;
	max-width: 200px;
	z-index: 1000;
}

.gear-bubble-3:after {
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 25px 7px 0;
	border-color: #d75527 transparent;
	display: block;
	width: 0;
	z-index: 1;
	bottom: -25px;
	left: 14px;
	z-index: 1000;
}

.gear-bubble-3:before {
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 15px 15px 0;
	border-color: transparent;
	display: block;
	width: 0;
	z-index: 0;
	bottom: -18px;
	left: 11px;
	z-index: 1000;
}

.gear-bubble-4 {
	display: none;
	position: absolute;
	left: 147px;
	bottom: 256px;
	width: auto;
	font-size: 14px;
	padding: 10px;
	background: #d75527;
	-moz-border-radius: 12px;
	max-width: 200px;
	z-index: 1000;
}

.gear-bubble-4:after {
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 25px 7px 0;
	border-color: #d75527 transparent;
	display: block;
	width: 0;
	z-index: 1;
	bottom: -25px;
	left: 14px;
	z-index: 1000;
}

.gear-bubble-4:before {
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 15px 15px 0;
	border-color: transparent;
	display: block;
	width: 0;
	z-index: 0;
	bottom: -18px;
	left: 11px;
	z-index: 1000;
}

#gear-upgrade-service-icon {
	position: absolute;
	float: none;
	top: 10px;
	left: 40px;
}

#gear-upgrade-speed-icon {
	position: absolute;
	float: none;
	top: 10px;
	left: 77px;
}

#gear-upgrade-care-icon {
	position: absolute;
	float: none;
	top: 10px;
	left: 114px;
}

#gear-upgrade-resistance-icon {
	position: absolute;
	float: none;
	top: 10px;
	left: 2px;
}

.gear-icon {
	position: relative;
	float: left;
	width: 34px;
	height: 33px;
	margin: 5px;
	display: none;
	background-image: url('../media/ui.png');
	background-position: -620px -300px;
}

#gear-balloon {
	width: auto;
	max-width: 226px;
	height: auto;
	padding: 20px;
	background: #d75527;
	position: absolute;
	bottom: 217px;
	right: 10px;
	color: white;
	font-size: 11px;
	line-height: 13px;
	text-align: left;
	opacity: 0.85;
	display: none;
	padding-bottom: 10px;
}

#gear-balloon-x {
	position: absolute;
	top: 5px;
	right: 5px;
	background: none;
	border: none;
	cursor: pointer;
	color: white;
}

#gear-upgrade-speed-icon-balloon,#gear-upgrade-speed-icon {
	background-position: -694px -300px;
}

#gear-upgrade-care-icon-balloon,#gear-upgrade-care-icon {
	background-position: -732px -300px;
}

#gear-upgrade-service-icon-balloon,#gear-upgrade-service-icon {
	background-position: -658px -300px;
}
/** Ekran podsumowania rundy **/
#round-summary-screen {
	width: 520px;
	height: auto;
	margin: auto;
	position: relative;
	margin-top: 30px;
}

#round-summary-screen-top {
	position: relative;
	float: left;
	margin: 0;
	padding: 0;
	height: 310px;
	width: 100%;
	background-image: url('../media/summary_screen_background.png');
}

#round-summary-screen-middle {
	position: relative;
	float: left;
	margin: 0;
	padding: 0;
}

#round-summary-screen-bottom {
	position: relative;
	float: left;
	margin: 0;
	padding: 0;
	height: 100px;
	width: 100%;
	background-image: url('../media/summary_screen_background.png');
	background-position: 0 -373px;
}

#ui-round-info-result-description {
	position: absolute;
	top: -30px;
	left: 25px;
	text-transform: uppercase;
	width: 480px;
	font-family: 'Exo', sans-serif;
	font-weight: 700;
}

.ui-round-info-label {
	font-family: 'Exo', sans-serif;
	font-weight: 700;
	position: absolute;
	top: 56px;
	height: 100px;
	width: 300px;
	left: 105px;
	font-size: 25px;
	text-transform: uppercase;
	text-align: center;
}

.ui-prize-table-left-label {
	position: absolute;
	top: 13px;
	left: 70px;
	font-size: 13px;
	text-transform: uppercase;
	font-family: 'Exo', sans-serif;
	font-weight: 700;
	line-height: 14px;
}

.round-summary-gear-icon {
	width: 40px;
	height: 38px;
	position: absolute;
	top: 0;
	left: 23px;
	background-image: url('../media/summary_screen_icons.png');
}

.ui-prize-table-row {
	position: relative;
	float: left;
	width: 520px;
	height: 45px;
	background-image: url('../media/summary_screen_background.png');
	background-position: 0 -315px;
}

.summary-screen-bubble, .dynamic-bubble {
	display: none;
	position: absolute;
	width: 246px;
	top: 0px;
	left: 0px;
	padding: 10px;
	padding-bottom: 10px;
	background: #d75527;
	-moz-border-radius: 12px;
	z-index: 101;
	color: white;
	font-size: 14px;
	text-align: center;
}

.summary-screen-bubble:after, .dynamic-bubble:after{
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 41px 8px 0;
	border-color: #d75527 transparent;
	display: block;
	width: 0;
	z-index: 1;
	bottom: -30px;
	left: 8px;
	z-index: 1000;
	transform: rotate(40deg);
}

.summary-screen-bubble:before, .dynamic-bubble:before{
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 15px 15px 0;
	border-color: transparent;
	display: block;
	width: 0;
	z-index: 0;
	bottom: -18px;
	left: 11px;
	z-index: 1000;
}

.ui-prize-void-element-1 {
	position: absolute;
	top: 0px !important;
	left: 0px !important;
	width: 300px !important;
	height: 38px !important;
}

.ui-prize-void-element-2 {
	position: absolute;
	top: 45px !important;
	left: 0px !important;
	width: 300px !important;
	height: 38px !important;
}

.ui-prize-void-element-3 {
	position: absolute;
	top: 90px !important;
	left: 0px !important;
	width: 300px !important;
	height: 38px !important;
}

.round-summary-gear-upgrade-service-icon {
	background-position: -40px -40px;
}

.round-summary-gear-upgrade-speed-icon {
	background-position: -40px -80px;
}

.round-summary-gear-upgrade-resistance-icon {
	background-position: -40px 0;
}

.round-summary-gear-upgrade-take_care-icon {
	background-position: -40px -120px;
}

.radio-label-default {
	overflow: hidden;
	width: 40px;
	text-indent: 100px;
	height: 38px;
	display: block;
	float: left;
	margin: 0;
	margin-right: 5px;
	background: #58595b;
	background-image: url('../media/summary_screen_icons.png');
}

.radio-label-default:hover {
	background: #6cb8ea;
	background-image: url('../media/summary_screen_icons.png');
}

.radio-label-selected {
	background: #1b75bb !important;
	background-image: url('../media/summary_screen_icons.png') !important;
}

.ui-role-buttons-label-healer {
	background-position: 0 -120px !important;
}

.ui-role-buttons-label-dps1 {
	background-position: 0 -40px !important;
}

.ui-role-buttons-label-dps2 {
	background-position: 0 -80px !important;
}

#ui-result-company {
	position: absolute;
	top: 171px;
	left: 30px;
	color: #3b88c2;
	font-size: 18px;
	font-family: 'Exo', sans-serif;
	font-weight: 700;
}

#ui-result-company span {
	color: white;
}

.ui-quiz-table-left-label {
	font-size: 11px;
	text-transform: uppercase;
	position: absolute;
	top: 13px;
	left: 25px;
}

#ui-role-income-role-tank {
	position: absolute;
	top: 205px;
	left: 20px;
	width: 100px;
}

#ui-role-income-role-dps1 {
	position: absolute;
	top: 205px;
	left: 120px;
	width: 100px;
}

#ui-role-income-role-dps2 {
	position: absolute;
	top: 205px;
	left: 220px;
	width: 100px;
}

#ui-role-income-role-healer {
	position: absolute;
	top: 205px;
	left: 320px;
	width: 100px;
}

#ui-player-role-icon-tank,#ui-player-role-icon-dps1,#ui-player-role-icon-dps2,#ui-player-role-icon-healer
	{
	top: 0;
	left: 0;
}

#ui-player-role-icon-dps1 {
	background-position: 0 -40px;
}

#ui-player-role-icon-dps2 {
	background-position: 0 -80px;
}

#ui-player-role-icon-healer {
	background-position: 0 -120px;
}

#ui-role-income-value-role-tank,#ui-role-income-value-role-dps1,#ui-role-income-value-role-dps2,#ui-role-income-value-role-healer
	{
	top: 9px;
	left: 45px;
	position: absolute;
	font-size: 17px;
	font-family: 'Exo', sans-serif;
	font-weight: 700;
}

.ui-round-info {
	
}

.ui-round-info-icon {
	width: 20px;
	height: 20px;
	background-color: #FFF;
	position: absolute;
}

.round-summary-screen-bottom {
	
}

.ui-role-radio {
	display: none;
}

.radio-label-default {
	background-color: #333;
}

.ui-prize-table-left,.ui-quiz-table-left {
	width: 50%;
	float: left;
}

.ui-prize-role-buttons,.ui-quiz-role-buttons {
	width: 40%;
	float: right;
}
/** Ikony stanu klienta **/
.state-icons {
	position: absolute;
	bottom: 152px;
	left: 225px;
	width: auto;
	z-index: 20;
}

.client-state-icon {
	width: 41px;
	height: 34px;
	margin-right: 4px;
	background-image: url('../media/ui.png');
	background-position: -650px -450px;
	float: left;
	display: none;
}

.state-icon-client {
	display: none;
}

.state-icon-shield {
	width: 41px;
	height: 34px;
	margin-right: 4px;
	background-image: url('../media/ui.png');
	background-position: -650px -450px;
	float: left;
}

.state-icon-defense {
	width: 41px;
	height: 34px;
	margin-right: 4px;
	background-image: url('../media/ui.png');
	background-position: -700px -450px;
	float: left;
}

/** Komunikacja **/
.communication-button {
	position: absolute;
	border: none;
	outline: none;
	width: 55px;
	height: 22px;
	background-image: url('../media/ui.png');
	z-index: 10;
	cursor: pointer;
}

.communication-button:active {
	
}

.i-will-button-disabled,.i-will-button-disabled:hover {
	bottom: 184px !important;
	right: 93px !important;
	background-position: -110px -44px !important;
}

#i-will-button {
	bottom: 184px;
	right: 93px;
	background-position: 0px -44px;
}

#i-will-button:hover {
	background-position: -55px -44px;
}

.angry-clients-button-disabled,.angry-clients-button-disabled:hover {
	bottom: 184px !important;
	right: 150px !important;
	background-position: -110px 0px !important;
}

#angry-clients-button {
	bottom: 184px;
	right: 150px;
}

#angry-clients-button:hover {
	background-position: -55px 0px;
}

.low-energy-button-disabled,.low-energy-button-disabled:hover {
	bottom: 184px !important;
	right: 207px !important;
	background-position: -110px -22px !important;
}

#low-energy-button {
	bottom: 184px;
	right: 207px;
	background-position: 0px -22px;
}

#low-energy-button:hover {
	background-position: -55px -22px;
}

#i-will-message {
	opacity: 1;
	z-index: 1000;
	width: 21px;
	height: 18px;
	background-image: url('../media/ui.png');
	background-position: -44px -135px;
}

#low-energy-message {
	opacity: 1;
	z-index: 1000;
	width: 21px;
	height: 18px;
	background-image: url('../media/ui.png');
	background-position: 0px -135px;
}

#angry-clients-message {
	opacity: 1;
	z-index: 1000;
	width: 21px;
	height: 18px;
	background-image: url('../media/ui.png');
	background-position: -22px -135px;
}

.cursor-message {
	position: absolute;
	width: 30px;
	height: 30px;
	border-radius: 30px;
	-moz-border-radius: 30px;
	-webkit-border-radius: 30px;
}

#cursor-i-will-message {
	opacity: 0.5;
	z-index: 1000;
	background-image: url('../media/ui.png');
	background-position: -60px -155px;
}

#cursor-low-energy-message {
	opacity: 0.5;
	z-index: 1000;
	background-image: url('../media/ui.png');
	background-position: -30px -155px;
}

#cursor-angry-clients-message {
	opacity: 0.5;
	z-index: 1000;
	background-image: url('../media/ui.png');
	background-position: 0px -155px;
}

.message {
	position: absolute;
}

#tutorial-head {
	position: absolute;
	bottom: 168px;
	right: 278px;
	width: 134px;
	height: 172px;
	background-image: url('../media/ui.png');
	background-position: -341px -1037px;
	display: none;
}

@media ( max-height : 759px) {
	#gameContainer {
		width: 960px;
		height: 600px;
	}
	.players-energy {
		width: 109px;
		height: 315px;
		top: 60px;
		background-position: -408px -97px;
		padding-top: 14px;
		background-size: 935px;
	}
	.players-energy-spectate {
		width: 109px;
		height: 205px;
		top: 60px;
		background-position: -408px -97px;
		padding-top: 14px;
		background-size: 935px;
	}
	.players-energy2 {
		width: 109px;
		height: 214px;
		top: 278px;
		background-position: -408px -214px;
		padding-top: 14px;
		background-size: 935px;
		z-index: 0;
	}
	.avatar-image {
		width: 82px;
		height: 84px;
		margin-left: 14px;
	}
	.avatar-tank-image-male {
		background-position: -384px -470px;
		background-size: 800px;
	}
	.avatar-tank-image-female {
		background-position: -477px -470px;
		background-size: 800px;
	}
	.avatar-dps1-image-male {
		background-position: -384px -566px;
		background-size: 800px;
	}
	.avatar-dps1-image-female {
		background-position: -477px -566px;
		background-size: 800px;
	}
	.avatar-dps2-image-female {
		background-position: -478px -660px;
		background-size: 800px;
	}
	.avatar-dps2-image-male {
		background-position: -385px -660px;
		background-size: 800px;
	}
	.avatar-healer-image-male {
		background-position: -382px -754px;
		background-size: 800px;
	}
	.avatar-healer-image-female {
		background-position: -474px -751px;
		background-size: 800px;
	}
	.players-energy-bar {
		margin-left: 7px;
		margin-top: 4px;
		margin-bottom: 4px;
		-ms-transform: scale(0.85);
		-webkit-transform: scale(0.85);
		transform: scale(0.85);
	}
	.avatar-self {
		bottom: 15px;
		left: -18px;
		-ms-transform: scale(0.83);
		-webkit-transform: scale(0.83);
		transform: scale(0.83);
	}
	.skill-quickbar {
		bottom: -7px;
		left: 90px;
		-ms-transform: scale(0.82);
		-webkit-transform: scale(0.82);
		transform: scale(0.82);
	}
	.skillCooldown-quickbar {
		width: 440px;
		height: 12px;
		bottom: 19px;
		left: 114px;
		-ms-transform: scale(0.82);
		-webkit-transform: scale(0.82);
		transform: scale(0.82);
	}
	.skill-cooldown {
		-ms-transform: scale(1, 1.1);
		-webkit-transform: scale(1, 1.1);
		transform: scale(1, 1.1);
	}
	#avatar-target-background {
		bottom: -8px;
		right: 258px;
		-ms-transform: scale(0.82);
		-webkit-transform: scale(0.82);
		transform: scale(0.82);
	}
	.avatar-target {
		bottom: 16px;
		right: 293px;
		-ms-transform: scale(0.825);
		-webkit-transform: scale(0.825);
		transform: scale(0.825);
	}
	.respawn-div {
		-ms-transform: scale(0.82);
		-webkit-transform: scale(0.82);
		transform: scale(0.82);
		top: 83px;
	}
	.respawn-bubble {
		-ms-transform: translate(-134px, 1px);
		-webkit-transform: translate(-134px, 1px);
		transform: translate(-134px, 1px);
	}
	.skill-bubble {
		-ms-transform: translate(-93px, 22px) scale(0.80);
		-webkit-transform: translate(-93px, 22px) scale(0.80);
		transform: translate(-93px, 22px) scale(0.80);
	}
	.skill-activationDiv {
		bottom: 106px;
		left: 368px;
	}
	#gear-bar {
		-ms-transform: scale(0.75);
		-webkit-transform: scale(0.75);
		transform: scale(0.75);
		bottom: 142px;
		left: 2px;
	}
	.gear-bubble-1 {
		bottom: 215px;
		left: 21px;
	}
	.gear-bubble-2 {
		bottom: 215px;
		left: 48px;
	}
	.gear-bubble-3 {
		bottom: 215px;
		left: 76px;
	}
	.gear-bubble-4 {
		bottom: 215px;
		left: 105px;
	}
	.state-icons {
		bottom: 116px;
		left: 161px;
		-ms-transform: scale(0.82);
		-webkit-transform: scale(0.82);
		transform: scale(0.82);
		z-index: 20;
	}
	#tutorial-head {
		-ms-transform: scale(0.80);
		-webkit-transform: scale(0.80);
		transform: scale(0.80);
		bottom: 114px;
	}
	.login-div {
		top: 120px;
	}
	#welcome-screen {
		margin-top: 10px;
	}
	.player-profit {
		right: 576px;
	}
	.company-profit {
		right: 281px;
	}
	.round-number {
		left: 473px;
	}
}

/** Ikony umiejętności nad mini-mapą **/
.assistants-message,.powerTransfer-message,.summonClient-message {
	position: absolute;
	bottom: 100px;
	right: 100px;
	width: 32px;
	height: 32px;
	background-image: url('../media/ui.png');
	background-position: -630px -500px;
	z-index: 11;
	display: none;
}

.assistants-message {
	background-position: -680px -500px;
}

#assistants-message-1 {
	right: 220px;
	bottom: 85px;
}

#assistants-message-2 {
	right: 45px;
	bottom: 85px;
}

#assistants-message-3 {
	right: 220px;
	bottom: 60px;
}

#assistants-message-4 {
	right: 45px;
	bottom: 60px;
}

#powerTransfer-message-1 {
	bottom: 115px;
	right: 176px;
}

#powerTransfer-message-2 {
	bottom: 115px;
	right: 88px;
}

#powerTransfer-message-3 {
	bottom: 30px;
	right: 176px;
}

#powerTransfer-message-4 {
	bottom: 30px;
	right: 88px;
}

.summonClient-message {
	background-position: -730px -500px;
}

#summonClient-message-1 {
	right: 220px;
	bottom: 115px;
}

#summonClient-message-2 {
	right: 45px;
	bottom: 115px;
}

#summonClient-message-3 {
	right: 220px;
	bottom: 30px;
}

#summonClient-message-4 {
	right: 45px;
	bottom: 30px;
}

.start-button-disabled-blue {
	background-position: 0px -338px !important;
	color: white !important;
}

.skill-upr {
	position: absolute;
	top: 2px;
	left: 2px;
	background: rgba(255, 255, 255, 0.2);
	padding: 0 5px 0 5px;
	border-radius: 9px;
	font-size: 15px;
	color: white;
}

.skill-name {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	overflow: hidden;
	font-size: 9px;
	margin-bottom: 5px;
	text-align: center;
}

#ui-connection-problem-label {
	position: absolute;
	width: 100%;
	top: 56px;
	left: 0;
	text-align: center;
}

/** TEMP 
#regenerate-button {
    position: absolute;
    top: 50px;
    right: 10px;
}
.ig_debug_head, .ig_debug_menu_item, .ig_debug_menu_item, .ig_debug_menu_item, .ig_debug_menu_item{
    display: none;
}
.ig_debug_panel_menu{
	background: none !important;
}
.ig_debug{
	background: none !important;
	font-size: 10px !important;
	border-top: none !important;
    color: black important;
}
.ig_debug_stats {
    border-left: none !important;
}
**/

#modal-content-holder .text-holder {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 90%;
	border-radius: 10px;
	padding: 20px;
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
}