/*fonts can be "preloaded" by creating dummy elements in the HTML document that specify
	css classes which use a particular font.
  BE CAREFUL WITH THIS, FONT FILES MAY BE LARGE AND CAN CAUSE DELAYS/UNRESPONSIVENESS!
 */

/*PRE-POSITIONED TEXT*/

.pText {
	display: inline;
	height: 100%;
	color: #000;
	font: 38px/38px 'TradeGothicW02-BoldCn20_675505', sans-serif;
	font-weight: bold;
 	-webkit-font-smoothing: antialiased;
	pointer-events: none;
	font-family: 'TradeGothicW02-BoldCn20_675505', Arial, Helvetica, sans-serif;
}
.pText_topLeft2  {
	width: 75%;
	height: 30%;
	top: 19%;
	left: 4%;	
	opacity: 0;
	position: absolute;
	text-align: left;
}
.pText_topLeft  {
	width: 75%;
	height: 30%;
	top: 11%;
	left: 4%;	
	opacity: 0;
	position: absolute;
	text-align: left;
}
.pText_topLeft3  {
	width: 75%;
	height: 30%;
	top: 26%;
	left: 4%;	
	opacity: 0;
	position: absolute;
	text-align: left;
}
.pText_midLeft  {
	width: 65%;
	top: 37%;
	height: 25%;
	left: 4%;	
	opacity: 0;
	position: absolute;
	text-align: left;
}
.pText_topRight {
	width: 45%;
	height: 35%;
	top: 27%;
	left: 48%;	
	opacity: 0;
	position: absolute;
	text-align: left;
}
.pText_midRight {
	width: 45%;
	height: 35%;
	top: 37%;
	left: 48%;	
	opacity: 0;
	position: absolute;
	text-align: left;
}
.pText_center {
	width: 100%;
	height: 7%;
	top: 46%;
	opacity: 0;
	position: absolute;
	text-align: center;
}

/*create an '.pText_foo_on' selector to override the default 'propOpacityFull' on behavior
.pText_a_on {
	opacity: 1;
}
*/


/*QUESTION TEXTS - should be positioned with specific button containers in mind*/
.qText {
	display: inline;
	height: 100%;
	color: #fff;
	font: 38px/38px 'TradeGothicW02-BoldCn20_675505', sans-serif;
	font-family: 'TradeGothicW02-BoldCn20_675505', Arial, Helvetica, sans-serif;
	-webkit-font-smoothing: antialiased;
	pointer-events: none;
}

.qText_topRight {
	width: 40%;
	padding: 8px;
	height: 14%;
	top: 10%;
	left: 55%;/*target 50*/
	opacity: 0;
	position: absolute;
	text-align: left;
}
.qText_topRight_3lines {
	width: 40%;
	padding: 8px;
	height: 21%;
	top: 10%;
	left: 55%;/*target 50*/
	opacity: 0;
	position: absolute;
	text-align: left;
}
.qText_topRight2 {
	width: 35%;
	padding: 8px;
	height: 14%;
	top: 16%;
	left: 55%;/*target 55*/
	opacity: 0;
	position: absolute;
	text-align: left;
}
.qText_upperCenter {
	width: 42%;
	height: 14%;
	top: 30%;
	left: 30%; /*target 30*/
	padding: 8px;
	opacity: 0;
	position: absolute;
	text-align: left;
}
.qText_upperCenter2 {
	width: 52%;
	height: 21%;
	top: 15%;
	left: 25%; /*target 25*/
	padding: 8px;
	opacity: 0;
	position: absolute;
	text-align: left;
}
.qText_topLeft {
	width: 60%;
	height: 14%;
	top: 13%;
	left: 5%; /*target 5*/
	padding: 8px;
	opacity: 0;
	position: absolute;
	text-align: left;
}
.qText_topLeft_1line {
	width: 60%;
	height: 14%;
	top: 13%;
	left: 5%; /*target 5*/
	padding: 8px;
	opacity: 0;
	position: absolute;
	text-align: left;
}

.qText_bottomLeft_1line {
	width: 60%;
	height: 14%;
	top: 13%;
	left: 5%; /*target 5*/
	padding: 8px;
	opacity: 0;
	position: absolute;
	text-align: left;
}
.qText_topLeft2 {
	width: 45%;
	height: 14%;
	top: 12%;
	left: 15%; /*target 15*/
	padding: 8px;
	opacity: 0;
	position: absolute;
	text-align: left;
}
.qText_topLeft3 {
	width: 60%;
	height: 14%;
	top: 8%;
	left: 5%; /*target 5*/
	padding: 8px;
	opacity: 0;
	position: absolute;
	text-align: left;
}
.qText_midLeft {
	width: 32%;
	height: 14%;
	top: 33%;
	left: 5%; /*target 5*/
	padding: 8px;
	opacity: 0;
	position: absolute;
	text-align: left;
}
.addText {
	opacity: 0;
}