html {
    -webkit-text-size-adjust: 100%; /* Prevent font scaling in landscape while allowing user zoom */
}

@font-face{
	font-family: ChunkFive;
	src:url(../../fonts/chunkfive.otf),
	url(../../fonts/chunkfive.woff) format('woff')
}

@font-face{
	font-family: BariolRegular;
	src:url(../../fonts/bariol_regular.otf),
	url(../../fonts/bariol_regular.woff) format('woff')
}

@font-face{
	font-family: BariolBold;
	src:url(../../fonts/bariol_bold.otf),
	url(../../fonts/bariol_bold.woff) format('woff')
}

@font-face{
	font-family: AliceRegular;
	src:url(../../fonts/alice_regular.woff) format('woff')
}

body{
	font-family:BariolRegular;
	margin:0;
}

body:not(.embed){
	background-color:#191919;
}

h1,h2,h3{font-weight:normal;}

#game_container button{outline:none;}

strong{
	font-family:BariolBold;
	font-weight:normal;
}

/* this one is just a temporary thing */
body:not(.embed) #content_container{
	margin-top:0px;
	margin-left:200px;
	margin-right:200px;
	padding:20px;
	background-color:#373737;
}

#game_container{
	background-image:url(../images/bg-main.jpg);
	width:100%;
	height:200px; /* change this via javascript - maybe */
	background-repeat:no-repeat;
	background-size:100% 100%;
	background-color:grey;
	position:relative;
	overflow:hidden;
	-webkit-touch-callout: none; /* iOS Safari */
	-webkit-user-select: none; /* Safari */
	-moz-user-select: none; /* Firefox */
	-ms-user-select: none; /* Internet Explorer/Edge */
	user-select: none; /* Non-prefixed version, currently supported by Chrome and Opera */
}

#game_logo,
#game_prize_reveal{
	position:absolute;
	width:30%;
	left:35%;
	top:3%;
	background-image:url(../images/logo.png);
	background-size:100% 100%;
	z-index:18;
	display:none;
}

#game_prize_reveal{
	position:relative;
	background-image:url(../images/logo-no-detail.png);
	width:50%;
	left:10%;
	top:10%;
}

#game_prize_reveal #game_prize_reveal_amount{
	position:absolute;
	width:100%;
	top:38%;
	font-size:10vw;
	color:#FFFFFF;
	text-align:center;
	font-family:ChunkFive;
	display:none;
}

#game_prize_reveal #game_prize_reveal_icon{
	background-image:url(../images/coin.png);
	background-size:100% 100%;
	width:22%;
	height:15%;
	left:39%;
	top:60%;
	content:"";
	display:none;
	position:absolute;
}

#game_instructions{
	/*background-color:rgba(0,0,0,0);*/
	position:absolute;
	top:48%;
	width:100%;
	text-align:center;
	color:#FFFFFF;
	padding:5% 0;
	display:none;
	z-index:19;
}

#game_instructions h1,
#game_instructions p{
	padding:0 5%;
	margin:0 0 1% 0;
}

#game_instructions h1{
	font-family:ChunkFive;
	font-size:5vw;
}

#game_instructions p{
	font-size:2.5vw;
	margin-bottom:2%;
	padding:0 10%;
}

#game_instructions button{
	font-size:2.5vw;
	background-color:rgba(255,255,255,0.1);
	color:#FFFFFF;
	border:0;
	font-family:ChunkFive;
	border:2px solid #FFFFFF;
	padding:1% 2%;
	border-radius:1000px; /* max px, % is bad */
	cursor:pointer;
	/*transition: all .3s ease-in;*/
}

#game_instructions button:hover{
	background:transparent;
	background-color:rgba(255,255,255,0.9);
	color:#333333;
}

#game_instructions button:not(:hover).glow{
 	animation:glow_on_off 2500ms infinite;
}

@keyframes glow_on_off{
	0%{
		box-shadow:0 0 -10px #FFFFFF;
	}
	50%{
		box-shadow:0 0 30px #FFFFFF;
		background-color:rgba(255,255,255,0.3);
	}
	100%{
		box-shadow:0 0 -10px #FFFFFF;
	}
}

.stage_object{
	position:absolute;
	display:none;
}

.stage_object#stage_trees{
	background-image:url(../images/bg-trees.png);
	background-size:100% 100%;
	width:50%;
	height:50%;
	z-index:10;
	/*display:block; /* temp */
}

.stage_object#stage_tent{
	background-image:url(../images/stage-tent.png);
	background-size:100% 100%;
	width:61%;
	height:63%;
	margin-left:-2%;
	top:28%;
	z-index:8;
}

.stage_object#stage_table{
	background-image:url(../images/stage-table.png);
	background-size:100% 100%;
	width:24%;
	height:30%;
	z-index:9;
	top:62%;
	left:45%;
	z-index:9;
}

.stage_object#stage_pare{
	background-image:url(../images/stage-pare.png);
	background-size:100% 100%;
	width:17%;
	height:55%;
	top:24%;
	left:62%;
	z-index:7;
}

.stage_smoke{
	position:absolute;
	background-image:url(../images/bg-smoke.png);
	background-size:100% 100%;
	/* styles in JS */
	z-index:6;
	opacity:0;
	/*background-color:yellow;*/
}

#game_prize_board{
	position:absolute;
	height:85%;
	bottom:0%;
	width:18%;
	right:-18%; /* make it invisible to start */
	/*background-color:rgba(9,61,168,0.5);*/
	background-color:rgba(0,0,0,0.5);
	border-radius:20px 0 0 0;
}

#gpb_table{
	/*background-color:blue;*/
	position:absolute;
	height:95%;
	bottom:2.5%;
	width:100%;
	font-size:1.6vw;
	font-family:ChunkFive;
	color:#FFFFFF;
}

#gpb_table .gpb_row{
	
}

#gpb_table .gpb_row.gpb_row_highlighted{
	color:#FFCC00;
}

#gpb_table .gpb_row.gpb_row_shade{
	background-color:rgba(255,255,255,0.2);
}

#gpb_table .gpb_cell{
	margin-top:3.5%;
	z-index:13;
	position:absolute;
}

#gpb_table .gpb_cell.gpb_cell_count{
	left:10%;
}

#gpb_table .gpb_cell.gpb_cell_amount{
	left:28%;
	background-image:url(../images/coin-opaque.png);
	background-size:auto 75%;
	background-position:0 center;
	background-repeat:no-repeat;
	padding-left:15%;
}

#gpb_table .gpb_row.gpb_row_highlighted .gpb_cell.gpb_cell_amount{
	background-image:url(../images/coin.png);
}

#gpb_table #gpb_row_highlighter{
	position:absolute;
	background-color:rgba(0,144,255,0.8);
	width:107%;
	z-index:12;
	bottom:0%;
	right:0%;
	border-radius:1000px 0 0 1000px;
	display:none;
}

#game_cheats{
	position:absolute;
	height:15%;
	top:0%;
	width:50%;
	z-index:19;
	right:0%; 
	text-align:right;
	display:none;
	opacity:0.25;
	transition: all .3s ease-in;
}

#game_cheats .game_cheat{
	margin-top:1%;
	height:90%;
	display:inline-block;
	margin-right:2%;
	transition: all .3s ease-in;
}

#game_cheats.preview_available,
#game_cheats.available{
	opacity:1;
	cursor:pointer;
}

#game_cheats .game_cheat.used{
	opacity:0.25;
	cursor:auto;
	-webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
  	filter: grayscale(100%);
}

#game_cheats .game_cheat img{
	height:100%;
	position:relative;
}

#game_cheat_tooltip{
	position:absolute;
	bottom:0%;
	background-color:rgba(0,0,0,0.75);
	color:#FFFFFF;
	text-align:center;
	z-index:21;
	padding:10px;
	font-size:1vw;
	border-radius:500px;
	display:none;
}

.opacity_pulse{
	animation:opacity_pulse 2000ms infinite;
}

@keyframes opacity_pulse{
	0%{opacity:1;}
	50%{opacity:0.5;}
	100%{opacity:1;}
}

#game_cheats.cheat_pulse{
	animation:cheat_pulse 2000ms infinite;
}

@keyframes cheat_pulse{
	0%{width:50%;}
	50%{width:85%;}
	100%{width:50%;}
}

.game_speech_bubble{
	position:absolute;
	top:7%;
	left:42%;
	width:25%;
	height:25%;
	background-image:url(../images/speech-bubble.png);
	background-size:100% 100%;
	background-repeat:no-repeat;
	z-index:20;
	text-align:center;
	font-size:1.7vw;
	display:table;
	font-family:BariolBold;
	cursor:pointer;
	opacity:0;
}

.game_speech_bubble span{
	display:table-cell;
	vertical-align:middle;
	padding:15% 8% 8% 8%;
	opacity:0;
}

.game_speech_bubble span div{
	font-family:BariolRegular;
	text-transform:uppercase;
	background-color:#b4b4b4;
	color:#FFFFFF;
	font-size:0.8vw;
	margin-top:-50px;
	margin-left:3%;
	padding:2% 4%;
	display:inline-block;
	border-radius:5000px;
}

.game_speech_bubble span strong.money{
	display:inline-block;
	background-image:url(../images/coin.png);
	background-size:auto 75%;
	background-position:0 center;
	background-repeat:no-repeat;
	padding-left:10%;
	margin-left:2%;
}

#question_container{
	position:absolute;
	bottom:0%;
	height:35%;
	width:80%;
	z-index:20;
	background-color:rgba(0,0,0,0.75);
	border-radius:0 20px 0 0;
	text-align:center;
	font-size:1.8vw;
	font-family:ChunkFive;
	display:none;
}

#question_container #question{
	border-radius:0 15px 0 0;
	background-color:rgba(255,255,255,0.9);
	font-family:ChunkFive;
	/*margin-left:2.5%;*/
	/*margin-top:2.5%;*/
	height:35%;
	/*display:table;*/
	width:100%;
	z-index:11;
}

/*#question_container #question span{
	display:table-cell;
	vertical-align:middle;
}*/

#question_container #question_title{
	z-index:9;
	position:absolute;
	width:95%;
	height:13%; /* single line padding */
	padding:3% 2.5%; /* single line padding */
}

#question_container #question_title.dual_line{
	height:27%; /* dual line padding */
	padding:1% 2.5%; /* dual line padding */
}

#question_container #question_background{
	position:absolute;
	width:0%;
	height:35%;
	background-color:rgba(11,130,217,.75);
	border-radius:0 15px 0 0;
	top:0;
	right:0;
}

#question_container .answer{
	background-color:rgba(255,255,255,0);
	/*margin:1%;*/
	height:21%;
	display:inline-block;
	width:49.6%;
	margin-left:0%;
	color:#FFFFFF;
	margin-top:0.75%;
	padding-top:2%;
}

#question_container .answer.smaller_text{
	font-size:1.2vw;
}

#question_container .answer{
	background-color:rgba(255,255,255,0.2);
	transition: all .2s ease-in;
}

#question_container:not(.answered){
	cursor:pointer;
}

#question_container:not(.answered) .answer:not(.disabled):not(.amber):hover{
	background-color:rgba(255,255,255,0.9);
	color:#000000;
}

#question_container .answer.amber{
	background-color:#FFCC00;
	color:#000000;
}

#question_container .answer.green{
	background-color:#1acd02;
	color:#FFFFFF;
}

#question_container .answer.green:not(.amber){
	animation:opacity_pulse 2000ms infinite;
}

#question_container .answer#answer_b,
#question_container .answer#answer_d{
	margin-left:.8%;
}

#question_container .answer.cheat_highlight{
	background-color:rgba(0,144,255,0.8);
}

#question_container .answer.disabled{
	cursor:default;
	opacity:0.2;
}

.game_cheat_window{
	z-index:19;
}

#game_cheat_window_invade{
	top:7%;
	left:10%;
	width:35%;
	height:45%;
	background-color:rgba(0,0,0,0.8);
	position:absolute;
	border-radius:5%;
	padding:3% 1%;
	display:none;
}

#game_cheat_window_invade .invade_vote{
	position:absolute;
	height:0%;
	background-color:#FFCC00;
	width:15%;
	left:8%;
	bottom:16%;
}

#game_cheat_window_invade .invade_vote_label{
	color:#FFFFFF;
	font-family:ChunkFive;
	font-size:1.5vw;
	position:absolute;
	bottom:6%;
	width:15%;
	text-align:center;
}

#game_cheat_window_invade .invade_vote#invade_vote_a,
#game_cheat_window_invade .invade_vote_label#invade_vote_label_a{left:8%;}

#game_cheat_window_invade .invade_vote#invade_vote_b,
#game_cheat_window_invade .invade_vote_label#invade_vote_label_b{left:31%;}

#game_cheat_window_invade .invade_vote#invade_vote_c,
#game_cheat_window_invade .invade_vote_label#invade_vote_label_c{left:54%;}

#game_cheat_window_invade .invade_vote#invade_vote_d,
#game_cheat_window_invade .invade_vote_label#invade_vote_label_d{left:76%;}

#game_cheat_window_book{
	position:relative;
	top:-65%;
	left:-55%;
	width:50%;
	height:60%;
	background-color:#c30202 !important;
	transform:rotate(-5deg);
	display:none;
	opacity:0;
}

#game_cheat_window_book #game_cheat_book_page{
	position:absolute;
	font-size:1.6vw;
	margin:0;
	font-family:AliceRegular;
	top:5%;
	left:0%;
	width:60%;
	height:75%;
	padding:5% 5% 5% 30%;
	background-color:#FFFFFF;
	box-shadow:0 0 30px #000000;
	overflow:hidden;
	color:#1E1E1E;
	line-height:1.1;
}

#game_cheat_window_book #game_cheat_book_page.smaller_text{
	font-size:1.3vw;
}

#game_cheat_window_book #game_cheat_book_page:before{
	display:block;
	width:.5%;
	height:100%;
	position:absolute;
	box-shadow:0 0 30px #000000;
	left:20%;
	top:0%;
	content:"";
	background-image:linear-gradient(to right,#999999,#CCCCCC,#999999);
	background-color:#999999;
}

#game_cheat_window_book #game_cheat_book_page:after{
	display:block;
	position:absolute;
	left:58%;
	bottom:5%;
	content:"- 69 -";
	color:#999999;
	font-size:1.2vw;
}

#game_sound,
#game_fullscreen{
	position:absolute;
	left:2%;
	margin:1% 2%;
	width:5%;
	height:7%;
	background-image:url(../images/icon_sound_off.png);
	background-size:100% 100%;
	background-repeat:no-repeat;
	opacity:0.8;
	z-index:18;
	cursor:pointer;
}

#game_sound{
	top:14%;
	background-image:url(../images/icon_sound_off.png);
}

#game_fullscreen{
	top:5%;
	background-image:url(../images/icon_fullscreen_enable.png);
}

#game_fullscreen.fullscreen_disable{
	background-image:url(../images/icon_fullscreen_disable.png);
}

#game_sound:hover,
#game_fullscreen:hover{
	opacity:1;
}

#game_sound.sound_is_on,
#game_sound.sound_is_off:hover{
	background-image:url(../images/icon_sound_off.png);
}

#game_sound.sound_is_off,
#game_sound.sound_is_on:hover{
	background-image:url(../images/icon_sound_on.png);
}

#game_confetti{
	position:absolute;
	opacity:0.5;
	width:100%;
	height:100%;
	background-image:url(../images/confetti.gif);
	background-size:100% 100%;
	display:none;
}

/* temp way to display all while working on stuff */
/*.stage_object,
#game_cheats{
	display:block !important;
}
#game_prize_board{
	right:0%;
}
/* *********************************** */

#credits{
	text-align:center;
	padding:10px;
}

#credits,
#credits a{
	color:#666666;
}


@media (max-width: 1300px){
	
	body:not(.embed) #content_container{
		margin-top:0px;
		margin-left:0px;
		margin-right:0px;
		padding:20px;
		background-color:#373737;
	}
	
}
	

	
	
	
	
	
	
	
	




