html body,
html > body.game-page {
	background: url('/oddsquad/img/overlay/award/main-bg.jpg') no-repeat center center fixed transparent; 
	background-color: transparent;

	-webkit-background-size: cover;
	-moz-background-size: cover;
	-ms-background-size: cover;
	background-size: cover;
}
html > body.game-page #root {
	background-color: transparent;
}
#game {
	height: 768px;
	width: 1024px;
	max-width: 100%;
	max-height: 90%;

	position: absolute;
	top: 50%;
	left: 50%;

	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);

	border: 5px solid #1f73ca;
	background-color: rgba(0,0,0,0.75);
	overflow: hidden;
}
nav.gameNav {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	float: left;
	background-color: rgba(0,0,0,0.75);
	border-bottom: 2px solid white;
}
nav.gameNav .btn-game-createAgent,
nav.gameNav .btn-game {
	position: relative;
	width: 5%;
	max-width: 75px;
	float: left;
	margin: 5px 0;
}
nav.gameNav .btn-game-createAgent:hover,
nav.gameNav .btn-game:hover {
	-webkit-filter: brightness(1.5);
	-moz-filter: brightness(1.5);
	-ms-filter: brightness(1.5);
	filter: brightness(1.5);
}
nav.gameNav .btn-game-createAgent .sizer,
nav.gameNav .btn-game .sizer {
	padding-top: 78.571428571428571428571428571429%;
}
nav.gameNav .btn-game-createAgent .sized,
nav.gameNav .btn-game .sized {
	background-image: url(/oddsquad/img/global/btn-bg-sm.png);
	background-size: 100% 100%;
	background-position: center center;
}
nav.gameNav .btn-game-createAgent i,
nav.gameNav .btn-game i {
	position: absolute;
	top: calc(50% - 5px);
	left: 50%;

    transition: all 0.20s ease-out;
    -ms-transition: all 0.20s ease-out;
    -moz-transition: all 0.20s ease-out;
    -webkit-transition: all 0.20s ease-out;
    
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}
nav.gameNav .btn-game-createAgent i:before,
nav.gameNav .btn-game i:before {
    font-family: 'FontAwesome';
	content: 'O';

	font-weight: 900;
	font-size: 0.65em;
	color: #b51617;
	text-shadow: 2px 2px 0 rgba(255,255,255,0.3);
}
nav.gameNav .btn-game.disabled,
nav.gameNav .btn-game.muted {
	-webkit-filter: grayscale(1);
	-moz-filter: grayscale(1);
	-ms-filter: grayscale(1);
	filter: grayscale(1);
	opacity: 0.75;
}
nav.gameNav .btn-game i.icon-award {
	top: calc(50% - 3px);
}
nav.game-nav .btn-close {
	top: 40px;
}
nav.game-nav .btn-close i:before {
    font-family: 'oddsquad-icons';
}
nav.gameNav .btn-game i.icon-award:before {
    font-family: 'oddsquad-icons';
	content: "\e515";
}
nav.gameNav .btn-game i.icon-play:before {
	content: "\f04b";
}
nav.gameNav .btn-game i.icon-help {
	/*
	top: calc(50% - 1px);
	top: 50%;
	top: calc(50% - 5px);
	top: 46.5%;
	*/
}
nav.gameNav .btn-game i.icon-help:before {
	content: "\f128";
	/*
	font-size: 0.9em;
	*/
}
nav.gameNav .btn-game-createAgent i.icon-createAgent:before {
	content: "\f234";
}
nav.gameNav .btn-game i.icon-pause:before {
	content: "\f04c";
}
nav.gameNav .btn-game i.icon-captions:before {
	content: "\f20a";
}
nav.gameNav .btn-game i.icon-muteon:before {
	content: "\f026";
}
nav.gameNav .btn-game i.icon-muteoff:before {
	content: "\f028";
}
nav.gameNav .btn-game i.icon-muteon,
nav.gameNav .btn-game i.icon-play,
nav.gameNav .btn-game.muted i.icon-muteoff,
nav.gameNav .btn-game.paused i.icon-pause {
	opacity: 0;
}
nav.gameNav .btn-game.muted i.icon-muteon,
nav.gameNav .btn-game.paused i.icon-play {
	opacity: 1;
}
nav.gameNav .btn-game-close {
	float: left;
	position: absolute;
	right: 20px;
	top: 50%;
	color: #fff;

	font-weight: 900;
	font-size: 0.85em;
	text-transform: uppercase;

	-webkit-transform: translate(0, -50%);
	-moz-transform: translate(0, -50%);
	-ms-transform: translate(0, -50%);
	transform: translate(0, -50%);
}
nav.gameNav .btn-game-close i {
	margin-left: 10px;
	font-size: 24px;
}
nav.gameNav .btn-game-close i:before{
	font-family: 'oddsquad-icons';
	content: "\e604";
}
.odd_squad_creatureduty .game-nav {
  position: relative;
  z-index: 1;
}

@media (max-width: 800px){

	nav.gameNav .btn-game-createAgent i,
	nav.gameNav .btn-game i {
		top: calc(50% - 2px);
	}

}