@CHARSET "UTF-8";

@import
	url(http://fonts.googleapis.com/css?family=Noto+Serif&subset=latin-ext)
	;

*.unselectable {
	-moz-user-select: -moz-none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	/*
     Introduced in IE 10.
     See http://ie.microsoft.com/testdrive/HTML5/msUserSelect/
   */
	-ms-user-select: none;
	user-select: none;
}

#EcoGame {
	text-align: center;
	font-family: "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial,
		Verdana, sans-serif;
	background: url(../img/bg-first.jpg);
	height: 100%;
	color: black;
	position: relative;
}

#EcoGame>div {
	display: none;
}

#EcoGame>div.active {
	display: block;
}

#EcoGame h1 {
	font-family: 'Noto Serif', serif;
	font-size: 2.5em;
	padding: 1em;
	margin: 0;
	padding: 1em;
}

#EcoGame h2 {
	font-family: 'Noto Serif', serif;
	font-size: 19px;
	width: 295px !important;
	height: 30px !important;
	margin: 0 auto;
	padding: 16px 0;
	background: url(../img/header.png) no-repeat;
	text-align: center;
}

#EcoGame h3 {
	font-family: 'Noto Serif', serif;
	font-size: 2.0em;
	padding: 0.5em;
	margin: 0;
}

#EcoGame .decorate_big {
	color: rgb(200, 200, 100);
	font-size: 36px;
	font-weight: bold;
}

#EcoGame .decorate {
	color: rgb(200, 200, 100);
	font-size: 22px;
	font-weight: bold;
}

#EcoGame .no_decorate {
	font-size: 15px;
	font-weight: bold;
	color: white;
}

#EcoGame .button {
	position: absolute;
	color: rgba(0, 0, 0, 0.0);
	cursor: pointer;
}

#EcoGame .left {
	position: absolute;
	color: rgba(0, 0, 0, 0.0);
	width: 300px;
	height: 57px;
	top: 470px;
	left: 100px;
	cursor: pointer;
}

#EcoGame .left:hover {
	background-position: 0 57px !important;
}

#EcoGame .right {
	position: absolute;
	width: 315px;
	height: 56px;
	color: rgba(0, 0, 0, 0.0);
	top: 471px;
	left: 404px;
	cursor: pointer;
}

#EcoGame .right:hover {
	background-position: 0 56px !important;
}

#EcoGame .backToMenu {
	background: url(../img/wroc_do_menu.png);
}

#EcoGame .array {
	width: 600px;
	height: 423px;
	background: url(../img/tablica.png);
	position: absolute;
	left: 100px;
	top: 10px;
}

#EcoGame #author {
	position: absolute;
	font-size: 10px;
	color: rgb(153, 153, 153);
	display: block;
	top: 585px;
	left: 700px;
	cursor: default;
}

#EcoGame #author a {
	cursor: default;
	text-decoration: none;
	color: rgb(153, 153, 153);
}

/* loading */
#EcoGame #loading {
	position: relative;
	height: 100%;
}

#EcoGame #loading .time {
	top: 510px;
}

/* menu */
#EcoGame #kreda {
	background: url(../img/menu.png);
	width: 541px;
	height: 134px;
	position: absolute;
	top: 466px;
	left: 140px;
}

#EcoGame #kreda #btStartGame {
	width: 117px;
	height: 84px;
	background: url(../img/graj.png);
	left: 20px;
	top: 20px;
}

#EcoGame #kreda #btStartGame:hover {
	background-position: 0 84px !important;
}

#EcoGame #kreda #btRecords {
	width: 181px;
	height: 40px;
	background: url(../img/rekordy.png);
	top: 36px;
	left: 299px;
}

#EcoGame #kreda #btRecords:hover {
	background-position: 0 40px !important;
}
/* levelDifficult */
#EcoGame #levelDifficult {
	padding-top: 20px;
}

#EcoGame #levelDifficult>a {
	position: absolute;
}

#EcoGame #levelDifficult #easy {
	background-image: url('../img/latwe.png');
	width: 187px;
	height: 238px;
	left: 3px;
	top: 190px;
}

#EcoGame #levelDifficult #easy:hover {
	background-position: 0 238px !important;
}

#EcoGame #levelDifficult #medium {
	background-image: url('../img/sredni.png');
	width: 185px;
	height: 240px;
	left: 200px;
	top: 180;
}

#EcoGame #levelDifficult #medium:hover {
	background-position: 0 240px !important;
}

#EcoGame #levelDifficult #hard {
	background-image: url('../img/trudny.png');
	width: 192px;
	height: 244px;
	left: 397px;
	top: 194px;
}

#EcoGame #levelDifficult #hard:hover {
	background-position: 0 244px !important;
}

#EcoGame #levelDifficult #insane {
	background-image: url('../img/niemozliwy.png');
	width: 189px;
	height: 240px;
	left: 600;
	top: 183px;
}

#EcoGame #levelDifficult #insane:hover {
	background-position: 0 240px !important;
}

#EcoGame #levelDifficult .savings span {
	font-weight: bold;
}

/* records */
#EcoGame #records table {
	width: 90%;
	border-collapse: collapse;
	margin: 12px auto 0;
}

#EcoGame #records table td {
	text-align: center;
	font-size: 15px;
	border-top: 1px solid black;
	padding: 3px;
}

#EcoGame #records table th {
	font-size: 13px;
}

#EcoGame #records table td:nth-child(2),#EcoGame #records table th:nth-child(2)
	{
	text-align: left;
}

/* month */
#EcoGame #month #info {
	padding: 2em 2em 0;
	line-height: 1.8em;
}

#EcoGame #month #info ul {
	text-align: left;
	font-size: 14px;
	list-style-type: circle;
	line-height: 18px;
}

#EcoGame #month #info ul li {
	padding: 3px;
}

#EcoGame #month #start {
	width: 333px;
	height: 57px;
	background: url(../img/rozpocznij_gre.png);
	top: 467px;
	left: 244px;
}

#EcoGame #month #start:hover {
	background-position: 0 57px !important;
}
/* board */
#EcoGame #board {
	position: relative;
	background: url(../img/bg-board.jpg);
}

#canvas {
	width: 100%;
	height: 100%;
	-webkit-transform: translate3d(0, 0, 0);
}

#EcoGame #board #UI {
	position: absolute;
	width: 100%;
}

#EcoGame #board #UI table {
	width: 100%;
}

#EcoGame #board #UI table td {
	width: 33%;
}

#EcoGame #board #UI #colected {
	text-align: left;
	padding: 0.4em 0 0 1em;
}

#EcoGame #board #UI #colected span {
	display: block;
	padding-left: 0.4em;
}

#EcoGame #board #UI #points,#EcoGame #board #UI #savings {
	text-align: right;
	padding: 0.2em 1em 0.2em 0;
}

.progress {
	margin: 0 auto;
	width: 6em;
	height: 0.5em;
	border-radius: 0.5em;
	overflow: hidden;
	border: 1px solid rgb(200, 200, 100);
}

.progress #indicator {
	background-color: rgb(200, 200, 100);
	height: 100%;
	width: 0%;
	border-top-left-radius: 0.5em;
	border-bottom-left-radius: 0.5em;
}

#EcoGame .time {
	height: 0.9em;
	border-radius: 0.5em;
	position: absolute;
	top: 90%;
	left: 10%;
	width: 80%;
}

#EcoGame .time #indicator {
	position: absolute;
	width: 100%;
}

#EcoGame #board #good {
	display: none;
	position: absolute;
	top: 180px;
	font-size: 50px;
	font-weight: bold;
	width: 100%;
	color: rgb(73, 170, 48);
	text-shadow: 0 0 10px rgb(73, 170, 48), 0 0 5px rgb(73, 170, 48);
}

#EcoGame #board #bad {
	display: none;
	position: absolute;
	top: 180px;
	font-size: 50px;
	font-weight: bold;
	width: 100%;
	color: rgb(214, 27, 19);
	text-shadow: 0 0 10px rgb(214, 27, 19), 0 0 5px rgb(214, 27, 19);
}
/* new record */
#EcoGame #newRecord .description {
	font-size: 1.4em;
}

#EcoGame .form {
	padding-top: 60px;
}

#EcoGame .form label {
	font-size: 2em;
	font-weight: bold;
}

#EcoGame .form input {
	font-size: 2em;
	padding: 0.2em;
	background: none;
	border: 2px solid;
}

#EcoGame #cencel {
	background: url(../img/anuluj.png);
}

#EcoGame #add {
	background: url(../img/dodaj_rekord.png);
}

/* koniec gry */
#EcoGame #end #restart {
	background: url(../img/jeszcze_raz.png);
}