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

@font-face {
  font-family: 'SF-Cartoonist-Hand';
    src:  url('SF-Cartoonist-Hand.ttf.woff') format('woff'),
    url('SF-Cartoonist-Hand.ttf.svg#SF-Cartoonist-Hand') format('svg'),
    url('SF-Cartoonist-Hand.ttf.eot'),
    url('SF-Cartoonist-Hand.eot?#iefix') format('embedded-opentype'); 
    font-weight: normal;
    font-style: normal;
}

/*
@font-face {
    font-family: 'armadabold';
    src: url('armada-bold-webfont.woff2') format('woff2'),
         url('armada-bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
*/

body {
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
}

.game {
	position:relative;
	left:0px;
	top:0px;
	width:calc(100vw - 200px);
	height:calc(75vw - 200px);
	max-height:100vh;
	text-align:center;
	display:inline-block;
	margin-left:200px;
	box-sizing:border-box;
	/*font-size:calc((100vw - 200px)/1024);*/
	-webkit-text-size-adjust: 100%;
}

.gameScreen {
	position:absolute;
	left:0px;
	top:0px;
	width:100%;
	height:100%;
	display:inline-block;
}

.screenHolder {
	position:relative;
	left:0px;
	top:0px;
	width:100%;
	height:100%;
	display:inline-block;
	text-align:center;
	max-width:133.333vh;
	overflow:hidden;
}

.blurGlow {
	-webkit-filter: drop-shadow( 0em 0em 5em #FFF ); 
    filter: drop-shadow( 0em 0em 5em #FFF );
}

.blurGlow2 {
	background-color:#7a509e !important;
}

@media only screen and (max-width:1120px) {
	.game {
		width:100vw;
		height:calc(75vw - 50px);
		margin-left:0px;
		margin-top:50px;
		max-height:calc(100vh - 80px);
		/*font-size:calc(100vw/1100);*/
	}
	div.menu-links {
		display:none;
	}
	div#aem-kids-menu {
		width:100% !important;
		height:50px !important;
		min-height:50px;
		max-width:none;
	}
	div#logo-box {
		width:100% !important;
		max-width:none;
		background-color:#e20c32;
		display:inline-block;
		text-align:center;
	}
	div#logo-box img {
		position:relative;
		display:inline-block;
		height:50px;
	}
	aside.main-sidebar {
		width:100% !important;
		max-width:none;
		text-align:center;
		display:inline-block;
	}
	section.sidebar {
		width:100% !important;
		max-width:none;
		text-align:center;
		display:inline-block;
	}
	div.sidebar-header {
		width:100% !important;
		max-width:none;
		text-align:center;
		display:inline-block;
	}
}


@media (min-aspect-ratio: 4/3) {
	.game {
		/*font-size:calc(100vh/768);*/
	}
}


@media only screen and (max-width:750px) {
	.game {
		width:100vw;
		height:calc(75vw - 35px);
		margin-left:0px;
		margin-top:35px;
		max-height:calc(100vh - 65px);
	}
	div#aem-kids-menu {
		width:100% !important;
		height:35px !important;
		min-height:35px;
		max-width:none;
	}
	div#logo-box img {
		position:relative;
		display:inline-block;
		height:35px;
	}
}

@media only screen and (max-width:680px) {
	.game {
		/*font-size:calc(100vw/1200);*/
	}
}

/* spaceBackgroundScreen */

.spaceBackgroundScreen {
	/*position:absolute;
	background-image:url(images/nebula.jpg);
	background-position:50% 50%;
	background-size:100% auto;*/
	overflow:hidden;
	display:none;
}

.spaceBackgroundScreen .theSpaceBackground {
	position:absolute;
	left:0px;
	top:-25%;
	width:100%;
	height:auto;
	display:inline-block;
}

/* spaceBackgroundScreenHolder */

.spaceBackgroundScreenHolder {
}

/* spaceBackgroundScreenHolder */

/* spaceBackgroundScreen */


/* missionBackgroundScreen */

.missionBackgroundScreen {
	position:absolute;
	background-image:url(images/mission_background.jpg);
	background-position:50% 50%;
	background-size:cover;
	display:none;
}

/* missionBackgroundScreenHolder */

.missionBackgroundScreenHolder {
}

/* missionBackgroundScreenHolder */

/* missionBackgroundScreen */






/* dollScreen */

.dollScreen {
	position:absolute;
	display:none;
}

/* dollScreenHolder */

.dollScreenHolder .doll {
	position:absolute;
	left:2%;
	bottom:0px;
	width:auto;
	height:85.2%;
	/*height:95%;*/
	display:inline-block;
	object-fit: contain;
}

/* dollScreenHolder */

/* dollScreen */




/* startScreen */

.startScreen {
	display:none;
}

/* startScreenHolder */

.startScreenHolder .theTitle {
	position:absolute;
	left:29.5%;
	top:35.2%;
	width:auto;
	height:20.1%;
	display:inline-block;
	object-fit: contain;
	-webkit-filter: drop-shadow( -5em 5em 5em #000 ); 
    filter: drop-shadow( 5em 5em 5em #000 );
}

.startScreenHolder .theTopTitle {
	position:absolute;
	left:50%;
	top:4.4%;
	width:auto;
	height:17.4%;
	display:inline-block;
	object-fit: contain;
	-webkit-transform:translateX(-50%);
	-ms-transform:translateX(-50%);
	transform:translateX(-50%);
}

.startScreenHolder .theRocket {
	position:absolute;
	left:75.2%;
	top:15.3%;
	width:auto;
	height:21.7%;
	display:inline-block;
	object-fit: contain;
}

.startScreenHolder .theButton {
	position:absolute;
	left:37.7%;
	top:61%;
	width:auto;
	height:10%;
	display:inline-block;
	object-fit: contain;
	cursor:pointer;
}

.startScreenHolder .dog {
	position:absolute;
	right:6.3%;
	bottom:1.8%;
	width:auto;
	height:28.9%;
	display:inline-block;
	object-fit: contain;
}

.startScreenHolder .sponsoredText {
	margin:0px;
	padding:0px;
	position:absolute;
	left:2%;
	top:2%;
	width:auto;
	height:auto;
	color:#FFF;
	font-family:"agenda";
	font-weight:500;
	font-size:11.3em;
	text-align:left;
}

.startScreenHolder .bottomText {
	margin:0px;
	padding:0px;
	position:absolute;
	left:0px;
	bottom:2%;
	width:100%;
	height:auto;
	color:#FFF;
	font-family:"agenda";
	font-weight:500;
	font-size:10.5em;
}


/* startScreenHolder */

/* startScreen */


/* welcomeScreen */

.welcomeScreen {
	display:none;
}

/* welcomeScreenHolder */

.welcomeScreenHolder .theBubble {
	position:absolute;
	left:29.5%;
	top:4%;
	width:65.8%;
	height:38.6%;
	display:inline-block;
	background-image:url(images/welcome_bubble.png);
	background-position:left top;
	background-size:100% 100%;
	background-repeat:no-repeat;
}

.welcomeScreenHolder .dog {
	position:absolute;
	right:6.3%;
	bottom:1.8%;
	width:auto;
	height:28.9%;
	display:inline-block;
	object-fit: contain;
}

.welcomeScreenHolder .theBubble p {
	margin:0px;
	padding:0px;
	position:absolute;
	left:10%;
	top:50%;
	width:89%;
	height:auto;
	text-align:center;
	font-family:"SF-Cartoonist-Hand";
	font-size:39em;
	line-height:1.1em;
	color:#000;
	-webkit-transform:translateY(-55%);
	-ms-transform:translateY(-55%);
	transform:translateY(-55%);
}

.welcomeScreenHolder .theBubble p strong {
	font-weight:bold;
	color:#c70a4c;
}

.welcomeScreenHolder .theBubble .secondText {
	font-size:37em;
}

.welcomeScreenHolder .bottomTextHolder {
	position:absolute;
	left:34.5%;
	bottom:3%;
	width:62.1%;
	height:auto;
	display:inline-block;
}

.welcomeScreenHolder .bottomTextHolder p {
	margin:0px;
	padding:0px;
	position:relative;
	left:0px;
	top:0px;
	width:100%;
	height:auto;
	text-align:center;
	font-family:"agenda";
	font-weight:500;
	font-size:24em;
	line-height:1.1em;
	color:#FFF;
}

.welcomeScreenHolder .bottomTextHolder strong {
	font-weight:700;
	color:#95d0f4;
}

.welcomeScreenHolder .bottomTextHolder .bottomP {
	font-size:9.5em;
	line-height:1.3em;
}

.welcomeScreenHolder .theButton {
	position:absolute;
	left:51.9%;
	top:51.9%;
	width:auto;
	height:10%;
	display:inline-block;
	object-fit: contain;
	cursor:pointer;
}


@media only screen and (max-width:620px) {
	.welcomeScreenHolder .sponsoredText {
		font-size:7px;
	}
}

/* welcomeScreenHolder */

/* welcomeScreen */




/* selectionScreen */

.selectionScreen {
	display:none;
}

/* selectionScreenHolder */

.selectionScreenHolder .theBubble {
	position:absolute;
	left:29.5%;
	top:4%;
	width:65.6%;
	height:22.5%;
	display:inline-block;
	background-image:url(images/selection_bubble.png);
	background-position:left top;
	background-size:100% 100%;
	background-repeat:no-repeat;
}

.selectionScreenHolder .theBubble p {
	margin:0px;
	padding:0px;
	position:absolute;
	left:13%;
	top:50%;
	width:83%;
	height:auto;
	text-align:center;
	font-family:"SF-Cartoonist-Hand";
	font-size:39em;
	line-height:1.1em;
	color:#000;
	-webkit-transform:translateY(-55%);
	-ms-transform:translateY(-55%);
	transform:translateY(-55%);
}

.selectionScreenHolder .theButton {
	position:absolute;
	left:51.9%;
	top:87%;
	width:auto;
	height:7.4%;
	display:inline-block;
	object-fit: contain;
	cursor:pointer;
}

.selectionScreenHolder .selectionButton {
	position:absolute;
	left:49.2%;
	top:29.9%;
	width:21.4%;
	height:48em;
	background-color:#FFF;
	display:inline-block;
	border-radius:10em;
	text-decoration:none;
}

.selectionScreenHolder .labelButton {
	margin:0px;
	padding:0px;
	position:absolute;
	left:32%;
	top:29.9%;
	width:20%;
	height:48em;
	display:inline-block;
	text-decoration:none;
	cursor:default;
}

.selectionScreenHolder .label_1 {
	left:32%;
	top:29.9%;
}

.selectionScreenHolder #but_1_1 {
	left:49.2%;
	top:29.9%;
}

.selectionScreenHolder #but_1_2 {
	left:71.4%;
	top:29.9%;
}

.selectionScreenHolder .label_2 {
	left:32%;
	top:37.5%;
}

.selectionScreenHolder #but_2_1 {
	left:49.2%;
	top:37.5%;
}

.selectionScreenHolder #but_2_2 {
	left:71.4%;
	top:37.5%;
}

.selectionScreenHolder .label_3 {
	left:32%;
	top:45.1%;
}

.selectionScreenHolder #but_3_1 {
	left:49.2%;
	top:45.1%;
}

.selectionScreenHolder #but_3_2 {
	left:71.4%;
	top:45.1%;
}

.selectionScreenHolder .label_4 {
	left:32%;
	top:52.7%;
}

.selectionScreenHolder #but_4_1 {
	left:49.2%;
	top:52.7%;
}

.selectionScreenHolder #but_4_2 {
	left:71.4%;
	top:52.7%;
}

.selectionScreenHolder .selectionButton div {
	width:100%;
	font-family: 'Audiowide', cursive;
	font-weight:400;
	font-size:22em;
	line-height:2.2em;
	color:#999;
	text-transform:uppercase;
}

.selectionScreenHolder .labelButton div {
	width:100%;
	font-family: 'Audiowide', cursive;
	font-weight:400;
	font-size:22em;
	line-height:2.2em;
	color:#FFF;
	text-transform:uppercase;
}

.selectionScreenHolder .bottomTextHolder {
	position:absolute;
	left:34.5%;
	bottom:14.8%;
	width:62.1%;
	height:auto;
	display:inline-block;
	text-align:center;
	font-family:"agenda";
	font-weight:500;
	font-size:32em;
	line-height:1.1em;
	color:#FFF;
}

.selectionScreenHolder .popupSelection {
	margin:0px;
	padding:0px;
	position:absolute;
	left:49.2%;
	top:29.9%;
	width:21.4%;
	height:auto;
	background-color:#FFF;
	display:inline-block;
	border-radius:10em;
	text-decoration:none;
	padding-top:12em;
	padding-bottom:12em;
	box-shadow: 5em 5em 5em #000000;
}

.selectionScreenHolder .popupSelection2 {
	left:71.4%;
}

.selectionScreenHolder .popupSelection .downArrow {
	position:relative;
	left:0px;
	top:0px;
	width:auto;
	height:24em;
	display:inline-block;
}

.selectionScreenHolder .popupSelection .popupSelectionItem {
	position:relative;
	left:0px;
	top:0px;
	width:95%;
	height:auto;
	display:inline-block;
	font-family: 'Audiowide', cursive;
	font-weight:400;
	font-size:22em;
	line-height:2em;
	color:#999;
	text-decoration:none;
	text-transform:uppercase;
}

.selectionScreenHolder .popupSelection .popupSelectionItem:hover {
	color:#FFF;
	background-color:#25336c;
	
}


@media only screen and (max-width:620px) {
	.selectionScreenHolder .sponsoredText {
		font-size:7px;
	}
}

/* selectionScreenHolder */

/* selectionScreen */



/* gameplayScreen */

.gameplayScreen {
	display:none;
}

/* gameplayScreenHolder */

.gameplayScreenHolder .responseBubble {
	position:absolute;
	left:2.7%;
	top:2.7%;
	width:30.2%;
	height:22%;
	background-image:url(images/top_bubble.png);
	background-position:top left;
	background-size:100% 100%;
	background-repeat:no-repeat;
	display:inline-block;
}

.gameplayScreenHolder .responseBubble .nextMessage {
	margin:0px;
	padding:0px;
	position:absolute;
	left:2%;
	top:22.3%;
	width:96%;
	height:auto;
	font-size:29em;
	line-height:.9em;
	color:#000;
	font-family:"SF-Cartoonist-Hand";
	font-weight:normal;
	display:inline-block;
}

.gameplayScreenHolder .responseBubble .nextMessage strong {
	font-weight:bold;
	text-transform:uppercase;
	color:#00a9e8;
}

.gameplayScreenHolder .responseBubble .wrongMessage {
	margin:0px;
	padding:0px;
	position:absolute;
	left:2%;
	top:14.4%;
	width:96%;
	height:auto;
	font-size:29em;
	line-height:.9em;
	color:#000;
	font-family:"SF-Cartoonist-Hand";
	font-weight:normal;
	display:inline-block;
}

.gameplayScreenHolder .responseBubble .wrongMessage strong {
	font-weight:bold;
	color:#29a37d;
}

.gameplayScreenHolder .responseBubble .correctMessage {
	margin:0px;
	padding:0px;
	position:absolute;
	left:2%;
	top:27%;
	width:96%;
	height:auto;
	font-size:39em;
	line-height:.9em;
	color:#000;
	font-family:"SF-Cartoonist-Hand";
	font-weight:normal;
	display:inline-block;
	text-transform:uppercase;
}

.gameplayScreenHolder .bottomMessage {
	margin:0px;
	padding:0px;
	position:absolute;
	left:38%;
	bottom:2%;
	width:55.2%;
	height:auto;
	display:inline-block;
	text-align:center;
	font-family:"agenda";
	font-weight:700;
	font-size:22em;
	line-height:1.1em;
	color:#FFF;
}

.gameplayScreenHolder .theComputer {
	position:absolute;
	left:33%;
	bottom:0px;
	width:66.3%;
	height:97.7%;
	display:inline-block;
	background-image:url(images/control_panel.png);
	background-position:left top;
	background-size:100% 100%;
	background-repeat:no-repeat;
	
}

.gameplayScreenHolder .theComputer .galaxy {
	position:absolute;
	left:0px;
	top:0px;
	width:100%;
	height:100%;
	display:none;
	background-image:url(images/middle_galaxy.png);
	background-position:top left;
	background-size:100% 100%;
	overflow:hidden;
}

.gameplayScreenHolder .theComputer .galaxy .playAgainButton {
	position:absolute;
	left:29.4%;
	top:32.6%;
	width:auto;
	height:30.3%;
	object-fit: contain;
	cursor:pointer;
}

.gameplayScreenHolder .theComputer .galaxy p {
	margin:0px;
	padding:0px;
	position:absolute;
	left:0px;
	top:50%;
	width:100%;
	height:auto;
	-webkit-transform:translateY(-50%);
	-ms-transform:translateY(-50%);
	transform:translateY(-50%);
	color:#FFF;
	font-family:"agenda";
	font-weight:700;
	font-size:36em !important;
	text-transform:uppercase;
}

.gameplayScreenHolder .theComputer .teamDisplay .galaxy {
	background-image:url(images/top_galaxy.png);
}

.gameplayScreenHolder .theComputer .answer1 .galaxy {
	background-image:url(images/a1_galaxy.png);
}

.gameplayScreenHolder .theComputer .answer2 .galaxy {
	background-image:url(images/a2_galaxy.png);
}

.gameplayScreenHolder .theComputer .answer3 .galaxy {
	background-image:url(images/a3_galaxy.png);
}

.gameplayScreenHolder .theComputer .theQuestion {
	position:absolute;
	left:6.7%;
	top:30.4%;
	width:87%;
	height:32.1%;
	background-color:#00a9e8;	
}

.gameplayScreenHolder .theComputer .theQuestion p {
	margin:0px;
	padding:0px;
	position:absolute;
	left:50%;
	top:50%;
	width:92%;
	height:auto;
	font-size:29em;
	line-height:1.1em;
	-webkit-transform:translateX(-50%) translateY(-50%);
	-ms-transform:translateX(-50%) translateY(-50%);
	transform:translateX(-50%) translateY(-50%);
	color:#FFF;
	font-family:"agenda";
	font-weight:700;
}

.gameplayScreenHolder .theComputer .theQuestion p span {
	font-weight:500;
	font-size:.7em;
	line-height:1em;
	display:inline-block;
	padding-top:.5em;
	padding-bottom:.5em;
}

.gameplayScreenHolder .theComputer .answer {
	position:absolute;
	left:5.9%;
	top:69.9%;
	width:25.9%;
	height:13.4%;
	background-color:#633488;	
	cursor:pointer;
}

.gameplayScreenHolder .theComputer .correct {
	background-color:#29a37d !important;	
}

.gameplayScreenHolder .theComputer .noninteractive {
	background-color:#45454f !important;	
}

.gameplayScreenHolder .theComputer .incorrect {
	background-color:#ce493e !important;	
}

.gameplayScreenHolder .theComputer .answer .questionImage {
	display:inline-block;
	width:100%;
	height:auto;
	margin-top:.3em;
}

.gameplayScreenHolder .theComputer .answer .check {
	position:absolute;
	left:0px;
	top:0px;
	width:100%;
	height:100%;
	display:none;
}

.gameplayScreenHolder .theComputer .answer .theX {
	position:absolute;
	left:0px;
	top:0px;
	width:100%;
	height:100%;
	display:none;
}

.gameplayScreenHolder .theComputer .answer2 {
	left:37.2%
}

.gameplayScreenHolder .theComputer .answer3 {
	left:68.5%
}

.gameplayScreenHolder .theComputer .answer p {
	margin:0px;
	padding:0px;
	position:absolute;
	left:50%;
	top:50%;
	width:92%;
	height:auto;
	font-size:19.5em;
	line-height:1.1em;
	-webkit-transform:translateX(-50%) translateY(-50%);
	-ms-transform:translateX(-50%) translateY(-50%);
	transform:translateX(-50%) translateY(-50%);
	color:#FFF;
	font-family:"agenda";
	font-weight:700;
}

.gameplayScreenHolder .theComputer .teamDisplay {
	position:absolute;
	left:6.7%;
	top:2.3%;
	width:87%;
	height:21.5%;
	background-color:#25336c;	
}

.gameplayScreenHolder .theComputer .teamBlock {
	position:relative;
	left:0px;
	top:0px;
	width:24.8%;
	height:100%;
	display:inline-block;
}

.gameplayScreenHolder .theComputer .galaxyBlock {
	position:relative;
	left:0px;
	top:0px;
	width:24.8%;
	height:100%;
	display:inline-block;
}

.gameplayScreenHolder .theComputer .teamBlock p {
	margin:0px;
	padding:0;
	position:relative;
	left:0px;
	top:0px;
	width:90%;
	height:auto;
	display:inline-block;
	color:#FFF;
	font-family:"agenda";
	font-weight:500;
	font-size:13em;
	line-height:1.1em;
	margin-top:1em;
}
.gameplayScreenHolder .theComputer .teamBlock p span {
	font-weight:700;
	color:#ce493e;
}

.gameplayScreenHolder .theComputer .teamBlock .dog {
	position:absolute;
	left:50%;
	top:0px;
	width:auto;
	height:100%;
	display:inline-block;
	-webkit-transform:translateX(-50%);
	-ms-transform:translateX(-50%);
	transform:translateX(-50%);
}

.gameplayScreenHolder .theComputer .galaxyBlock .dog {
	position:absolute;
	left:50%;
	top:0px;
	width:auto;
	height:100%;
	display:inline-block;
	-webkit-transform:translateX(-50%);
	-ms-transform:translateX(-50%);
	transform:translateX(-50%);
}


/* gameplayScreenHolder */

/* gameplayScreen */

.game p {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}

.specialDog {
	position:absolute;
	left:33.5%;
	top:8.9%;
	width:32.1%;
	height:81.3%;
	display:inline-block;
}

.specialDog .element {
	position:absolute;
	left:0px;
	top:0px;
	width:100%;
	height:100%;
	background-position:left top;
	background-size:100% 100%;
	background-repeat:no-repeat;
}

.specialDog .head {
	background-image:url(images/orion_head.png);
}

.specialDog .right_front_leg {
	background-image:url(images/orion_right_front_leg.png);
}

.specialDog .right_back_leg {
	background-image:url(images/orion_right_back_leg.png);
}

.specialDog .body {
	background-image:url(images/orion_body.png);
}

.specialDog .tail {
	background-image:url(images/orion_tail.png);
}

.specialDog .left_front_leg {
	background-image:url(images/orion_left_front_leg.png);
}

.specialDog .left_back_leg {
	background-image:url(images/orion_left_back_leg.png);
}

.volumeClass {
	position:absolute;
	left:10px;
	bottom:10px;
	width:3%;
	height:auto;
	max-width:52px;
	z-index:100000;
	cursor:pointer;
}