@charset "utf-8";
/* CSS Document */
@import url(family=Lato_400,100,300,700,900.css);
/*300 = Light, 100=Thin, 400=Regular, 700=Bold, 900=Black*/ 

body {
	-webkit-user-select:none;
	-webkit-touch-callout:none;
	font-family:'Lato', sans-serif;
	weight:400;
	padding:0px;
	margin:0px;
}
a, a:hover {
	text-decoration:none;
}
#map {
	z-index:1;position:absolute;background-color:#009900;width:5450px;height:2066px;
}
#hero {
	z-index:2;position:absolute;top:300px;left:380px;overflow:visible;width:30px;height:100px;
	/*border:1px solid #CC0000;*/
}
#Poppy {
	background-size:712px 940px;
	background-position:0px 564px;
	width:178px;
	height:188px;
}
#hero img {
	margin-left:-85px;
	margin-top:-40px;
}
#hero div{
	margin-left:-80px;
	margin-top:-80px;
}
#container {
	z-index:0;
	overflow:hidden;
	position:absolute;
	top:0px;
	left:0px;
	right:0px;
	bottom:0px;
	background-color:#CCCCCC;
	border:none;/*3px solid #000;*/
}
.obstacle, .obstacleh {
	background-color:#000000;
	opacity:0;
	z-index:3;
	position:absolute;
}
.obstacleh {
	background-color:#FF0000;
}
.obstacleh1 {	background-color:#000000;
	opacity:.5;
	z-index:3;
	position:absolute;
}
.character {
	opacity: 0;
	background-color: #ff009c;
	z-index: 3;
	position: absolute;
	bottom: 12px;
	right: 12px;
}
#pauseMenu {
	width:100%;
	height:100%;
	background-color:#0073e6;
	display:none;
	z-index:10;position:absolute;
	text-align:center;
}
#MobileControls {
	position:fixed;right:20px;top:90px;z-index:7;
	display:none;
}
#level1clearbg {
	z-index:0;
	position:fixed;
	top:0px;
	bottom:0px;
	left:0px;
	right:0px;
	background-image:url(../images/Level1ClearBG.jpg);
	background-repeat:no-repeat;
	background-size:cover;	
	background-position:center center;
}
#landingbg {
	z-index:0;
	position:fixed;
	top:0px;
	bottom:0px;
	left:0px;
	right:0px;
	background-image:url(../images/Landing.jpg);
	background-repeat:no-repeat;
	background-size:cover;	
	background-position:center center;
}
#trolls_logo {
	margin-top:20px;text-align:center;
	-webkit-transition: opacity 1s ease-in-out;
	-moz-transition: opacity 1s ease-in-out;
	-ms-transition: opacity 1s ease-in-out;
	-o-transition: opacity 1s ease-in-out;
	 opacity: 1;
}
#trolls_logo img {
	width:222px;
}
.RD {
	font-size:16px;
	color:#FFFFFF;
	font-weight:900;
}
#mazeadventure {
	margin-top:20px;
	height:260px;
	overflow:visible;
	position:relative;
	top:0px;
}
#mazeadventure.moveAndResize {
	-webkit-transition: all 1s ease-in-out;
	-moz-transition: all 1s ease-in-out;
	-ms-transition: all 1s ease-in-out;
	-o-transition: all 1s ease-in-out;
	-ms-transform: scale(0.5, 0.5); /* IE 9 */
	-webkit-transform: scale(0.5, 0.5); /* Safari */
	transform: scale(0.5, 0.5);
}
#playnowbtn, #playnowbtn2, #playnowbtn3, #playnowbtn4 {
	text-align:center;
	width:451px;
	background-image:url(../images/btn_play.png);
	background-size:451px 109px;
	background-repeat:no-repeat;
	line-height:109px;
	font-size:40px;
	color:#FFFFFF;
	font-weight:900;
	-webkit-transition: opacity 1s ease-in-out;
	-moz-transition: opacity 1s ease-in-out;
	-ms-transition: opacity 1s ease-in-out;
	-o-transition: opacity 1s ease-in-out;
	 opacity: 1;
}
#playnowbtn2, #playnowbtn3, #playnowbtn4 {
	margin-top:-100px;
}
#innerContent {
	position:relative;
	overflow:hidden;
	top:20px;
}
#playnowbtn.fadeOut, #trolls_logo.fadeOut {
	opacity:0;
}
#level1panel {
	position:relative;
	z-index:1;
	background-position:center;
	background-image:url(../images/chooseLevel_1.jpg);
	border-radius:40px;
	width:496px;
	height:322px;
}
#level2panel {
	position:relative;
	z-index:1;
	background-position:center;
	background-image:url(../images/chooseLevel_2.jpg);
	border-radius:40px;
	width:496px;
	height:322px;
}
#level3panel {
	position:relative;
	z-index:1;
	background-position:center;
	background-image:url(../images/chooseLevel_3.jpg);
	border-radius:40px;
	width:496px;
	height:322px;
}
#leveltitle, #leveltitle2, #leveltitle3 {
	position:relative;
	z-index:2;
	background-image:url(../images/levelbox.png);
	background-size:373px 126px;
	top:-80px;
	width:373px;
	height:126px;
}
#leveltitle2 {
	  background-image:url(../images/levelbox2.png);
}
#leveltitle3 {
	  background-image:url(../images/levelbox3.png);
}
#leveltitle img, #leveltitle2 img, #leveltitle3 img {
	width:373px;
}
#level1 {
	-webkit-transition: opacity 1s ease-in-out;
	-moz-transition: opacity 1s ease-in-out;
	-ms-transition: opacity 1s ease-in-out;
	-o-transition: opacity 1s ease-in-out;
	opacity: 0;
	height:0px;
}
#level1.visible {
	-webkit-transition: opacity 1s ease-in-out;
	-moz-transition: opacity 1s ease-in-out;
	-ms-transition: opacity 1s ease-in-out;
	-o-transition: opacity 1s ease-in-out;
	opacity:1;
	height:500px;
	overflow:visible;
}
#levelswitch {
	vertical-align:middle;display:inline-block;cursor:hand;cursor:pointer;
}
@media (max-width:1280px) {
	#MobileControls {
		display:block;
	}
}
@media (max-width:960px) {
	#trolls_logo {
		margin-top:10px;
	}
	#trolls_logo img {
		width:140px;
	}
	.RD {
		font-size:14px;
	}
	#mazeadventure {
		margin-top:0px;
		height:120px;
	}
	#mazeadventure img {
		width:306px;
	}
	#playnowbtn, #playnowbtn2, #playnowbtn3, #playnowbtn4 {
		text-align:center;
		width:338px;
		background-image:url(../images/btn_play.png);
		background-size:338px 77px;
		background-repeat:no-repeat;
		line-height:77px;
		font-size:30px;
		color:#FFFFFF;
		font-weight:900;
	}
	 #level1panel {
		position:relative;
		z-index:1;
		background-position:center;
		background-image:url(../images/chooseLevel_1.jpg);
		background-size:238px 150px;
		border-radius:20px;
		width:248px;
		height:161px;
	 }
	 #level1panel img {
		 width:248px;
	 }
	 #leveltitle, #leveltitle2, #leveltitle3 {
		  background-size:186px 63px;
		  top:-40px;
		  width:186px;
		  height:63px;
	 }
	 #leveltitle img, #leveltitle2 img, #leveltitle3 img {
		  width:186px;
	 }
	 #level1.visible {
		 height:250px;
	 }
	 #playnowbtn2, #playnowbtn3, #playnowbtn4 {
		-webkit-transition: opacity 1s ease-in-out;
		-moz-transition: opacity 1s ease-in-out;
		-ms-transition: opacity 1s ease-in-out;
		-o-transition: opacity 1s ease-in-out;
		 opacity: 1;
		 margin-top:-50px;
	}
	#container {
		overflow:scroll;
	}
	
}
#pauseMenu {
	width:100%;
	height:100%;
	background-color:#0073e6;
	display:none;
	z-index:10;position:absolute;
	text-align:center;
}
#thefooter {
	position:fixed;
	z-index:9;
	bottom:0px;
	background-repeat:repeat-x;
	background-position:center bottom;
	background-image:url(../images/footer_bar.png);
	width:100%;
}
#footerTT {
	float:left;
	text-align:left;
	display:inline-block;
	width:335px;
	height:136px;
	background-image:url(../images/footer_TT.png);
	background-repeat:no-repeat;
}
#footerRD {
	margin-top:114px;
	margin-left:64px;
	font-size:12px;
	font-weight:900;
	color:#ff1400;
}
#footerRight {
	float:right;text-align:left;display:inline-block;width:335px;height:136px;background-image:url(../images/footer_right.png);background-repeat:no-repeat;
}
#footerTimer {
	display:inline-block;
	background-image:url(../images/footer_timer.png);background-repeat:no-repeat;background-position:center bottom;width:273px;height:46px;margin-top:90px;
}
#footerTimerText {
	margin-top:18px;font-size:15px;font-weight:500;color:#FFFFFF;
}
#leveltitletop, #leveltitletop2, #leveltitletop3 {
	position:relative;
	z-index:2;
	background-image:url(../images/levelbox.png);
	background-size:233px 98px;
	width:250px;
	text-align:center;
	background-position: center top;
	background-repeat:no-repeat;  
}
#leveltitletop2 {
	  background-image:url(../images/levelbox2.png);
}
#leveltitletop3 {
	  background-image:url(../images/levelbox3.png);
}
#leveltitletop img, #leveltitletop2 img, #leveltitletop3 img {
	margin-top:8px;
	width:100%;
}
#pagebutton {
	position:absolute;top:20px;left:20px;width:50px;height:50px;border-radius:50%;background-color:#0073e6;
}
#pagebuttonright {
	position:absolute;top:20px;right:20px;width:50px;height:50px;border-radius:50%;background-color:#0073e6;
}
#continuebtn {
	position:relative;
	top:190px;
	text-align:center;
	width:374px;
	background-image:url(../images/btnContinue.png);
	background-size:374px 114px;
	background-repeat:no-repeat;
	line-height:114px;
	font-size:40px;
	color:#FFFFFF;
	font-weight:900;
}
#bluecover {
	z-index:7;position:absolute;top:0px;left:0px;right:0px;bottom:0px;background-color:#1076dd;opacity:.65;width:100%;
}
#charPopup, #charPopup2 {
	position:absolute;z-index:8;left:0px;right:0px;top:0px;bottom:0px;
}
#charPopup2 {
	z-index:1;
}
#charPopupCharacter {
	background-image:url(../images/CharacterPopup.png);
	background-repeat:no-repeat;
	width:687px;height:687px;text-align:center;
}
#chartext {
	position:relative;
	top:180px;
	left:90px;
	width:280px;
}
#chartext_youfound {
	font-size:20px;font-weight:900;color:#FFFFFF;
}
#chartext_NAME {
	line-height:48px;font-size:52px;font-weight:900;color:#FFFFFF;
}
#chartext_quote {
	height:120px;font-size:18px;line-height:18px;color:#FFFFFF;font-weight:700;padding-top:20px;padding-bottom:20px;
}
#meet_Cooper {
	width:687px;
	height:687px;
	background-image:url(../images/Trolls/Cooper.png);
	background-position:280px 130px;
	background-repeat:no-repeat;
}
#meet_Smidge {
	width:687px;
	height:687px;
	background-image:url(../images/Trolls/Smidge.png);
	background-position:340px -180px;
	background-repeat:no-repeat;
}
#meet_DJ {
	width:687px;
	height:687px;
	background-image:url(../images/Trolls/DJ.png);
	background-position:380px 40px;
	background-repeat:no-repeat;
}
#meet_Chef {
	width:687px;
	height:687px;
	background-image:url(../images/Trolls/Chef.png);
	background-position:280px 40px;
	background-size: 354px 571px;
	background-repeat:no-repeat;
}
#meet_King {
	width:687px;
	height:687px;
	background-image:url(../images/Trolls/King.png);
	background-position:320px 60px;
	background-size: 372px 485px;
	background-repeat:no-repeat;
}
#meet_Bridget {
	width:687px;
	height:687px;
	background-image:url(../images/Trolls/Bridget.png);
	background-position:380px 40px;
	background-repeat:no-repeat;
}
#meet_Prince {
	width:687px;
	height:687px;
	background-image:url(../images/Trolls/PrinceGristle.png);
	background-position:340px 60px;
	background-repeat:no-repeat;
}
#meet_Branch {
	width:687px;
	height:687px;
	background-image:url(../images/Trolls/Branch.png);
	background-position:390px 116px;
	background-repeat:no-repeat;
}
#meet_CloudGuy {
	width:687px;
	height:687px;
	background-image:url(../images/Trolls/CloudGuy.png);
	background-position:350px 126px;
	background-repeat:no-repeat;
}
#meet_Poppy {
	width:687px;
	height:687px;
	background-image:url(../images/Trolls/Poppy.png);
	background-position:390px 116px;
	background-repeat:no-repeat;
}
#meet_GuyDiamond {
	width:687px;
	height:687px;
	background-image:url(../images/Trolls/GuyDiamond.png);
	background-position:380px 30px;
	background-repeat:no-repeat;
}
#meet_Biggie {
	width:687px;
	height:687px;
	background-image:url(../images/Trolls/Biggie.png);
	background-position:280px 70px;
	background-repeat:no-repeat;
}
#meet_Fashionistas {
	width:687px;
	height:687px;
	background-image:url(../images/Trolls/Fashionistas.png);
	background-position:43px 72px;
	background-repeat:no-repeat;
}
#meet_Creek {
	width:687px;
	height:687px;
	background-image:url(../images/Trolls/Creek.png);
	background-position:330px 70px;
	background-repeat:no-repeat;
}
#meet_Fuzzbert {
	width:687px;
	height:687px;
	background-image:url(../images/Trolls/Fuzzbert.png);
	background-position:390px 180px;
	background-repeat:no-repeat;
}
#TheMap {
	margin-left:160px;
	background-image:url(../images/maze_1_mini.png);
	background-repeat:no-repeat;
	width:163px;
	height:53px;
	padding:1px;
	display:none;
}
#map_youarehere {
	position:relative;left:0px;top:0px;width:4px;height:4px;border-radius:50%;background-color:#C40000;
}
#Tooltip {
	position:absolute;
	z-index:99;
	top:500px;
	left:100px;
	width:120px;
	height:40px;
	background-color:#1076dd;
	color:#FFFFFF;
	font-weight:900;
	font-size:16px;
	border:1px solid #FFFFFF;
	border-radius:10px;
	-webkit-transition: opacity 1s ease-in-out;
	-moz-transition: opacity 1s ease-in-out;
	-ms-transition: opacity 1s ease-in-out;
	-o-transition: opacity 1s ease-in-out;
	 opacity: 0;
}
#Tooltip.Shown {
	/*opacity:1;*/
}
#Tooltip.Hidden {
	/*opacity:0;*/
}

#pausemenu_x {
	position:absolute;top:30px;left:30px;
}
#pausemenu_audio {
	position:absolute;top:30px;right:30px;
}
#pausemenu_x img {
	width:27px;
}
#pausemenu_audio img {
	width:43px;
}
#btnResume, #btnMainMenu, #btnTrailer {
	text-decoration:none;
	width:340px;
	margin-top:40px;
	height:64px;font-weight:900;text-align:center;border-radius:32px;background-color:#0062c4;line-height:64px;font-size:40px;color:#FFFFFF;
}
#btnMainMenu {
	width:420px;
}
#pauseTT {
	position:absolute;bottom:20px;left:20px;text-align:center;
	font-weight:900;color:#FFFFFF;font-size:11px;
}
#pauseTT img {
	width:170px;
}
#ratingsBug {
	position:absolute;bottom:20px;right:20px;text-align:right;
}
#ratingsBug img {
	width:100px;
}
#pauseLegal {
	font-weight:700;color:#FFFFFF;font-size:10px;
}
#pauseLegal a {
	color:#FFFFFF;
	text-decoration:none;
	margin-left:5px;
	margin-right:5px;
}
#btnNextAdventure {
	text-align:center;
	width:540px;
	background-image:url(../images/btnNext.png);
	background-size:540px 114px;
	background-repeat:no-repeat;
	line-height:114px;
	font-size:40px;
	color:#FFFFFF;
	font-weight:900;
	-webkit-transition: opacity 1s ease-in-out;
	-moz-transition: opacity 1s ease-in-out;
	-ms-transition: opacity 1s ease-in-out;
	-o-transition: opacity 1s ease-in-out;
	 opacity: 1;
}
#mobPoppyUp {
	background-color:#FF0000;height:60px;
	opacity:0;
	width:100%;
}
#mobPoppyLeft {
	float:left;clear:left;background-color:#000099;height:100px;
	opacity:0;
	width:40%;display:inline-block;
}
#mobPoppyRight {
	float:right;clear:right;background-color:#009900;height:100px;
	opacity:0;
	width:40%;display:inline-block;
}
#mobPoppyDown {
	clear:both;background-color:#FF0000;height:60px;
	opacity:0;
	width:100%;
}
#violate_landscape {
   display:none;
}

@media screen and (orientation:portrait)
{
   #violate_landscape {
	   display:block;
   }
}
@media screen and (orientation:landscape)
{
   #violate_landscape {
	   display:none;
   }
}
