@charset "UTF-8";
/* CSS Document */


.theHolder {
	position:relative;
	left:0px;
	top:0px;
	width:100%;
	height:100vh;
	display:inline-block;
	box-sizing:border-box;
	overflow:hidden;
	background-color:#fff;
}

.gameHolder {
	position:absolute;
	left:0px;
	top:0px;
	width:2121px;
	height:1126px;
	box-sizing:border-box;
	
	background-position: left top;
	background-size:2121px 1126px;
	background-repeat:no-repeat;
	display:none;
	overflow:hidden;
	border:none;
}

.theHolder .gameHolder div:focus {
	outline:none !important;
	outline-width: 0 !important;
	box-shadow: none;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
}

.theHolder .gameHolder img:focus {
	outline:none !important;
	outline-width: 0 !important;
	box-shadow: none;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
}

.theHolder .gameHolder:focus {
	outline:none !important;
	outline-width: 0 !important;
	box-shadow: none;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
}

.theHolder .gameHolder:focus {
	outline:none !important;
	outline-width: 0 !important;
	box-shadow: none;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
}

.theHolder:focus {
	outline:none !important;
	outline-width: 0 !important;
	box-shadow: none;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
}

.theHolder:focus {
	outline:none !important;
	outline-width: 0 !important;
	box-shadow: none;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
}

.factTab {
	position:absolute;
	left:0px;
	top:0px;
	width:5px;
	height:5px;
}

.characters {
	position:absolute;
	left:0px;
	top:0px;
	width:2121px;
	height:1126px;
	background-position: left top;
	background-size:2121px 1126px;
	background-repeat:no-repeat;
}

.pen1 {
	position:absolute;
	left:518px;
	top:464px;
}

.pen2 {
	position:absolute;
	left:1489px;
	top:493px;
}

.hand1 {
	position:absolute;
	left:408px;
	top:557px;
}

.hand2 {
	position:absolute;
	left:1515px;
	top:574px;
}

.eyes1 {
	position:absolute;
	left:781px;
	top:320px;
}

.eyes2 {
	position:absolute;
	left:1230px;
	top:320px;
}

.characters1 {
	background-image:url(images/characters_a.png);
}

.characters2 {
	background-image:url(images/characters.png);
}

.characters3 {
	background-image:url(images/characters3.png);
}

.charactersArms1 {
	background-image:url(images/arms_with_pens.png);
}

.charactersArms2 {
	background-image:url(images/arms_only.png);
}

.completed {
	background-image:url(images/completed.png);
	z-index:100;
}

.title {
	background-image:url(images/title.png);
}

.endTitle {
	background-image:url(images/end_title.png);
}

.directions {
	background-image:url(images/directions.png);
	cursor:pointer;
}

.alert {
	position:absolute;
	left:342px;
	top:372px;
	width:238px;
	height:202px;
	background-position: left top;
	background-size:238px 202px;
	background-repeat:no-repeat;
	background-image:url(images/alert.png);
}

.alert2 {
	left:1549px;
}

.start {
	position:absolute;
	left:783px;
	top:990px;
	width:550px;
	height:96px;
	background-position: left top;
	background-size:550px 96px;
	background-repeat:no-repeat;
	background-image:url(images/start.png);
	cursor:pointer;
}

.findout {
	position:absolute;
	left:825px;
	top:921px;
	width:464px;
	height:98px;
	background-position: left top;
	background-size:464px 98px;
	background-repeat:no-repeat;
	background-image:url(images/find_out_more.png);
	cursor:pointer;
}

.reload {
	position:absolute;
	left:0px;
	top:0px;
	width:260px;
	height:110px;
	background-position: left top;
	background-size:260px 110px;
	background-repeat:no-repeat;
	background-image:url(images/reload.png);
	cursor:pointer;
}

.poly {
	position:absolute;
	left:0px;
	top:0px;
	width:2121px;
	height:1126px;
	background-position: left top;
	background-size:2121px 1126px;
	background-repeat:no-repeat;
}

.poly0 {
	background-image:url(images/poly_0_select.png);
}

.poly1 {
	background-image:url(images/poly_1_select.png);
}

.poly2 {
	background-image:url(images/poly_2_select.png);
}

.poly3 {
	background-image:url(images/poly_3_select.png);
}

.poly4 {
	background-image:url(images/poly_4_select.png);
}

.poly5 {
	background-image:url(images/poly_5_select.png);
}

.poly6 {
	background-image:url(images/poly_6_select.png);
}

.poly7 {
	background-image:url(images/poly_7_select.png);
}

.popupHolder {
	position:absolute;
	left:0px;
	top:0px;
	width:2121px;
	height:1126px;
	display:table;
	vertical-align:middle;
	text-align:center;
	z-index:25;
}

.popup {
	position:relative;
	left:0px;
	top:0px;
	width:2121px;
	height:1126px;
	display:table-cell;
	vertical-align:middle;
	text-align:center;
}

.popupBox {
	position:relative;
	left:0px;
	top:0px;
	width:1630px;
	height:auto;
	display:inline-block;
	vertical-align:middle;
	text-align:center;
	background-color:#FFF;
	box-sizing:border-box;
	border:solid;
	border-width:12px;
	border-color:#4656a0;
	
}

.popupText {
	position:absolute;
	left:52px;
	top:50px;
	width:1400px;
	height:auto;
	display:inline-block;
	text-align:left;
	box-sizing:border-box;
	font-size:16px;
	color:#000;
	font-family:MuseoSans-500;
	font-size:51px;
	line-height:62px;
}

.popupText strong {
	font-weight:normal;
	font-family:MuseoSans-900;
	color:#4656a0;
}

.popupFact {
	position:relative;
	left:0px;
	top:0px;
	width:1606px;
	height:auto;
	display:inline-block;
	vertical-align:middle;
	text-align:left;
	box-sizing:border-box;
}

.popupFact img {
	position:relative;
	left:0px;
	top:0px;
	width:1606px;
	height:auto;
	display:inline-block;
	vertical-align:middle;
	text-align:left;
	box-sizing:border-box;
}

.popupImage {
	position:relative;
	left:0px;
	top:0px;
	width:auto;
	height:auto;
	display:table-cell;
	vertical-align:middle;
	text-align:left;
	box-sizing:border-box;
}

.closeButton {
	position:absolute;
	right:0px;
	top:0px;
	cursor:pointer;
}

.logos {
	position:absolute;
	right:0px;
	top:0px;
	pointer-events:none;
	z-index:125;
}

.soundToggle {
	position:absolute;
	right:0px;
	bottom:0px;
	cursor:pointer;
	z-index:125;
}

.soundText {
	position:absolute;
	right:75px;
	bottom:0px;
	cursor:pointer;
	z-index:124;
}

.directions2 {
	position:absolute;
	left:0px;
	top:0px;
	pointer-events:none;
}

.countDown {
	font-family:Arial, "Helvetica Neue", Helvetica, Arial, sans-serif !important;
	font-size:40px;
	color:#000;
	position:absolute;
	left:50%;
	top:50%;
	width:100px;
	height:100px;
	background-color:#FFF;
	z-index:10000;
	text-align:center;
	line-height:100px;
	border-radius:50%;
	font-weight:bold;
	box-sizing:border-box;
	margin-left:50px;
	margin-top:-50px;
}

.countDown span {
	margin-left:15px;
}

.countDown .percentage {
	vertical-align: baseline;
  position: relative;
  top: -0.4em;
  font-size:20px;
}


@media only screen and (max-width:1280px){

	
	.gameHolder {
		margin-left:0px;
		margin-top:0px;
	}
	
	.countDown {
		margin-left:-50px;
	}

	
}



@media only screen and (max-width:760px){
	.gameHolder {
		margin-left:0px;
		margin-top:0px;
	}
	
}