@font-face { font-family: 'seriesorbitregular'; src: url("fonts/serio___-webfont.eot"); src: url("fonts/serio___-webfont.eot?#iefix") format("embedded-opentype"), url("fonts/serio___-webfont.woff") format("woff"), url("fonts/serio___-webfont.ttf") format("truetype"), url("fonts/serio___-webfont.svg#seriesorbitregular") format("svg"); font-weight: normal; font-style: normal; }

/*
@function pixeltoem($pixelsize){  @return ( $pixelsize / $BASE_FONT_SIZE ) + em;
}*/
.muteDivPlay{
	width:62px;
	height:41px;
	background-image:url('../images/speaker/On.png');
	position:absolute;
	left:120px;
	text-decoration::none;
	top:0;
	z-index:9999;
}

.muteDivPlay:hover{
	background-image:url('../images/speaker/On_hover.png');
}

.muteDivNoPlay{
	width:62px;
	height:41px;
	background-image:url('../images/speaker/Off.png');
position:absolute;
	left:120px;
	text-decoration::none;
	top:0;
	z-index:9999;
}


.muteDivNoPlay:hover{
background-image:url('../images/speaker/Off_hover.png');	
}


















































.cursor-active { cursor: pointer; }

body { background: black; overflow: hidden; color: #ffe7b0; font-weight: bold; font-size: 1em; -webkit-user-select: none; -moz-user-select: none; user-select: none; }

a, img { border: 0px; outline: none; }

.disabled { opacity: .75!important; }

.mouseDisabled { cursor: default; }

.closebutton { cursor: pointer; display: block; position: absolute; }

h4 { font-size: 1em; }

h1, h2, h3 { font-size: 1.150em; line-height: 1.150em; }

.default-background { background: url("../images/default_background.jpg") no-repeat top center; }

.dark-background { background: url("../images/dark_background.jpg") no-repeat top center; }

.no-background { background: none!important; }

#levelheading { text-align: center; position: absolute; z-index: 9; top: 30px; padding: 0px; margin: 0px; width: 100%; }

#gameframe { background: url("../images/game_panel_area.png") no-repeat center center; width: 100%; max-width: 889px!important; margin: 0 auto; height: 549px; position: relative; display: block; top: 3em; z-index: 1; }
#gameframe.hide { display: none; }

#navigation { position: absolute; padding: 0px; margin: 0px; bottom: -2px; width: 400px; z-index: 6; display: block; left: 49%; z-index: 999; }
#navigation a { display: inline; float: right; margin-right: 20px; padding: 0px; }

#gamearea { width: 100%; position: absolute; display: block; top: 0px; left: 0px; z-index: 2; padding: 0px 16px 0px 16px; margin: 0px 0px 0px 0px; height: 630px; overflow: hidden; }
#gamearea .gamingpanel { width: 100%; max-width: 889px!important; margin: 0 auto; height: 560px; position: relative; display: block; padding-top: 64px; top: 3em; overflow: hidden; }

#small_elder { width: 113px; height: 151px; opacity: 1; position: absolute; bottom: -13px; z-index: 10; left: 15px; display: block; }
#small_elder.noshow { display: none; }

#popup { width: 100%; height: 100%; background-color: rgba(255, 255, 255, 0.5); position: absolute; top: 0px; left: 0px; z-index: 1000; }
#popup.popupclean { background-color: rgba(255, 255, 255, 0); z-index: 998; }
#popup.popupcleanclickthrough { background: none; pointer-events: none; z-index: 998; }
#popup .feedback_panel { position: relative; top: 110px; left: 67px; width: 551px; }
#popup .feedback_panel p { font-size: 1.125em; line-height: 1.250em; }
#popup .feedback_panel a { font-family: "seriesorbitregular"; font-size: 1.438em; font-weight: normal; position: absolute; bottom: 73px; left: 153px; text-decoration: none; background: rgba(240, 213, 118, 0.8) url("../images/brown_arrow.png") no-repeat 95% 50%; -webkit-border-radius: 6px 6px; -moz-border-radius: 6px / 6px; border-radius: 6px / 6px; color: #2e1b0c; display: block; width: 280px; padding: 10px 10px 10px 30px; }
#popup .feedback_panel a:hover { background-color: rgba(255, 133, 10, 0.8); }
#popup .feedback_panel a.feedback_continue { width: 200px; left: 178px; }
#popup .feedback_panel a.feedback_timetoraise { width: 382px; left: 89px; }
#popup .feedback_panel a.tryagain { width: 191px; left: 180px; }

.wrapper { position: relative; display: block; height: 630px; overflow: hidden; }

#navigation .hide, #gamearea .hide, #wrapper .hide { display: none; }

#popup .feedback_panel { text-indent: 0px; color: #ffe7b0; }

.build_icons { position: absolute; display: block; top: 30px; left: 546px; z-index: 6; width: 121px; }
.build_icons.buildland_icons { top: 30px; }

#main_navigation { position: absolute; top: 0px; left: 20px; z-index: 999; }
#main_navigation ul { list-style-type: none; padding: 0px 10px 0px 10px; margin: 0px; background-color: #2e1b0c; width: 100px; text-align: center; position: relative; top: -156px; text-align: center; }
#main_navigation li { padding: 10px 0px; border-bottom: 1px solid #ffe7b0; font-family: "seriesorbitregular"; font-weight: normal; margin: 0px; font-size: 18px; }
#main_navigation li a { color: #ffe7b0; text-decoration: none; width: 80px; display: block; }
#main_navigation li a.menuarrow { background: url("../images/menu_arrow_down.png") top right no-repeat; padding-right: 20px; }
#main_navigation li a.menuarrow:hover { background: url("../images/menu_arrow_down_orange.png") top right no-repeat; }
#main_navigation li a.menuarrow.active { background: url("../images/menu_arrow_up_orange.png") no-repeat; background-position: right -2px; }
#main_navigation li a:hover { color: #ff8f16; }
#main_navigation li a.active { color: #ff8f16; }
#main_navigation li:last-child { border: none; }

#giftbox { background: url("../images/gift_box_close.png") no-repeat top left; width: 110px; height: 84px; display: inline-block; bottom: -2px; position: absolute; left: 120px; z-index: 10; }
#giftbox.nograss { background: url("../images/giftbox_normal2.png") no-repeat top left; width: 75px; left: 128px; }
#giftbox.hide { display: none; }
#giftbox.doublegifts { background: url("../images/giftbox_open_double.png") no-repeat top left; width: 409px; }
#giftbox.singlegift { background: url("../images/gift_box_open.png") no-repeat top left; width: 216px!important; }
#giftbox .giftInfo { background: url("../images/stone_gift_popup.png") no-repeat top left; width: 197px; height: 139px; display: block; position: absolute; z-index: 8; color: #ffe7b0; font-size: 1em; font-weight: normal; top: -125px; left: 71px; text-align: center; }
#giftbox .giftInfo .info { padding: 7px 0px 0px; display: inline-block; }
#giftbox .giftInfo .info p { padding: 0px 10px; margin-top: 6px; }
#giftbox .giftInfo heading { color: #ff8f16; font-family: "seriesorbitregular"; font-weight: normal; font-size: 1em; }
#giftbox .giftInfo .lineSpacing { margin: 2px auto; border-top: 1px solid #ffe7b0; width: 90%; height: 1px; }
#giftbox .giftInfo.secondInfo { left: 152px; }
#giftbox .giftInfo.hide { display: none; }
#giftbox .giftInfo .closebutton { left: 175px; top: 6px; }
#giftbox .giftcontents { width: 200px; display: inline-block; position: relative; top: 8px; left: 119px; height: 50px; }
#giftbox .giftContainer { display: inline-block; position: relative; padding: 0px; margin: 0px; width: 80px; }
#giftbox .giftContainer.singleGiftPadding { top: 4px; }
#giftbox img { float: left; z-index: 4; position: relative; }
#giftbox img.sarsenPos { top: -3px; left: 5px; }
#giftbox img.glow { z-index: 2; left: 0px; top: -56px; }

#sidebar { position: absolute; top: 124px; right: 1%; z-index: 8; width: 87px; }

#scoreboard { background: url("../images/score_panel.png") no-repeat top left; width: 87px; height: 150px; display: inline-block; float: left; clear: both; text-align: center; padding: 0px 0px 0px 18px; }
#scoreboard .gemGlow { background: url("../images/gem_glow.png") top left no-repeat; width: 58px; height: 58px; display: block; position: absolute; top: -4px; left: -5px; opacity: 0; }
#scoreboard.hide { display: none; }
#scoreboard .overall_score { top: 54px; position: relative; font-family: "seriesorbitregular"; font-weight: normal; color: #ff8f16; font-size: 1.250em; width: 67px; text-align: center; }

#progresslevel { background: url("../images/progresslevel_board.png") no-repeat top left; width: 72px; height: 316px; margin: 20px 0px 0px 14px; display: inline-block; float: left; padding: 10px 10px 0px; text-align: center; font-family: "seriesorbitregular"; font-weight: normal; }
#progresslevel.hide { display: none; }
#progresslevel .progress_title { font-size: 0.75em; }
#progresslevel .progresslevel_number { color: white; margin-top: 20px; font-size: 1em; width: 100%; text-align: center; }
#progresslevel .progress_bar { width: 40px; height: 120px; overflow: hidden; position: relative; left: 6px; top: -11px; }
#progresslevel .progress_bar img { height: 200px; width: 40px; position: relative; }

.endscreenpadding { padding-left: 3%!important; margin-top: -14px; }
.endscreenpadding heading { text-align: center; padding: 0px; margin: -10px 0px 0px; }

.yourscored { font-family: "seriesorbitregular"; font-weight: normal; position: relative; top: 0px; left: 0px; margin-bottom: -34px; width: 140px; text-align: center; margin-left: 29%; }

.orangehighlight { color: #ff8f16; }

#preloader { background-color: rgba(0, 0, 0, 0.7); width: 976px; height: 630px; display: block; position: absolute; top: 0px; left: 0px; }
#preloader img { width: 64px; height: 64px; display: block; position: relative; margin: 30% auto; }

#skipintrobutton { background: url("../images/skip_intro_off.png") no-repeat top left; width: 207px; height: 44px; position: absolute; display: block; top: 312px; left: 13%; }
#skipintrobutton:hover { background: url("../images/skip_intro_on.png") no-repeat top left; }

#intromap { background: url("../images/intro_map.png") top left no-repeat; width: 486px!important; height: 436px; margin: 0px; padding: 0px; position: relative; top: 48px; left: 71px; }
#intromap img { position: absolute; }
#intromap .introPeople { z-index: 6; }
#intromap .introShip { background: url("../images/intro_ship.png") no-repeat top left; width: 77px; height: 22px; position: absolute; display: block; }
#intromap .introShip.introShipSmall { background: url("../images/intro_ship_small.png") no-repeat top left; height: 30px; }
#intromap #ship1 { top: 60px; left: 24px; /* left: 125px;
top: 85px; */ }
#intromap #ship2 { top: 59px; left: 406px; /* left: 322px;
top: 56px;
*/ }
#intromap #ship3 { top: 359px; left: 448px; /* left: 319px;
top: 340px;*/ }
#intromap #ship4 { top: 381px; left: 340px; /* left: 217px;
top: 368px; */ }
#intromap #ship5 { top: 411px; left: 241px; /* left: 114px;
top: 399px; */ }
#intromap #intropeople1 { top: 31px; left: 239px; }
#intromap #intropeople2 { top: 174px; left: 340px; }
#intromap #intropeople3 { top: 311px; left: 167px; }
#intromap #introanimals { top: 170px; left: 109px; }

#intro-route-paths { display: block; position: relative; width: 500px; height: 600px; }
#intro-route-paths img { position: absolute; }
#intro-route-paths #intro-route1 { top: 77px; left: 255px; }
#intro-route-paths #intro-route2 { top: 202px; left: 235px; }
#intro-route-paths #intro-route3 { top: 232px; left: 126px; }
#intro-route-paths #intro-route4 { top: 317px; left: 181px; }

.introElder { background: url("../images/intro_elder.png") top left no-repeat; width: 192px; height: 326px; display: block; position: absolute; top: 307px; left: 4px; }

.startintro { background: url("../images/startintro_background_new.jpg") no-repeat top left; width: 975px; height: 630px; display: inline-block; position: relative; text-align: center; }
.startintro img.title { position: relative; top: 30px; }
.startintro .startintro_content { text-align: left; color: #2e1b0c; font-size: 1.438em; line-height: 1.1em; position: relative; top: 100px; margin-right: 25px; }
.startintro .startintro_content p { padding-right: 40px; }
.startintro hide { display: none; }
.startintro a { background: url("../images/start_quest.png") no-repeat top left; position: absolute; top: 312px; left: 13%; width: 218px; height: 44px; display: block; text-indent: -9999px; }
.startintro a:hover { background: url("../images/start_quest_on.png") no-repeat top left; }

.intro_elder_head { position: relative; left: -16px; z-index: 4; top: 94px; }

.intro_background { width: 975px; height: 630px; display: block; position: relative; left: -1px; color: #ffe7b0; }
.intro_background .speech_bubble { /* a{ position:relative; top:550px; left:300px;
}*/ color: #2e1b0c; }

.character1_speechbubble, .character2_speechbubble, .intro_speech_bubble { font-size: 1.063em; line-height: 1.125em; }

.assemble_intro_background { background: url("../images/intro_background.jpg") no-repeat top left; }
.assemble_intro_background .intro_speech_bubble { background: url("../images/elder_speech_bubble.png") no-repeat top left; display: block; width: 297px; height: 169px; position: relative; left: 40px; top: 130px; padding: 10px 10px 10px 20px; }
.assemble_intro_background .character1_speechbubble { background: url("../images/character1_speechbubble.png") no-repeat top left; width: 234px; height: 180px; display: block; left: 17px; position: relative; top: 235px; margin-right: 30px; padding: 4px 10px 0px 15px; }
.assemble_intro_background .character2_speechbubble { background: url("../images/character2_speechbubble.png") no-repeat top left; width: 247px; height: 149px; display: block; position: relative; top: 190px; padding: 6px 10px 0px 15px; }

.locate_intro_background { background: url("../images/level2_intro_background.jpg") no-repeat top left; }
.locate_intro_background .intro_speech_bubble { background: url("../images/locate_elder_speechbubble.png") no-repeat top left; display: block; width: 487px; height: 382px; position: relative; left: 102px; top: 95px; padding: 15px 33px 10px 40px; }
.locate_intro_background .character1_speechbubble { background: url("../images/locate_character1_speechbubble.png") no-repeat top left; width: 247px; height: 149px; top: -569px; left: 664px; padding: 6px 10px 0px 15px; position: relative; display: block; z-index: 4; }
.locate_intro_background .intro_elder_head { top: -119px; }

.journey_intro_background { background: url("../images/journeyIntroBackground.jpg") no-repeat top left; }
.journey_intro_background .intro_speech_bubble { background: url("../images/journey_speechbubble.png") no-repeat top left; display: block; width: 487px; height: 382px; position: relative; left: 81px; top: 106px; padding: 15px 33px 10px 40px; }
.journey_intro_background .character1_speechbubble { background: url("../images/journey_character2_speechbubble.png") no-repeat top left; width: 233px; height: 137px; top: 136px; left: 188px; padding: 4px 10px 0px 15px; position: relative; display: block; z-index: 4; }
.journey_intro_background .character2_speechbubble { background: url("../images/journey_character1_speechbubble.png") no-repeat top left; width: 247px; height: 149px; display: block; position: relative; top: 236px; padding: 6px 10px 0px 15px; left: 105px; }
.journey_intro_background .intro_elder_head { top: -84px; }

.raise_intro_background { background: url("../images/level4_intro_screen.jpg") no-repeat top left; }
.raise_intro_background .intro_speech_bubble { background: url("../images/level4_elder_speechbubble_new.png") no-repeat top left; display: block; width: 487px; height: 352px; position: relative; left: 102px; top: 84px; padding: 15px 33px 10px 40px; }
.raise_intro_background .character1_speechbubble { background: url("../images/level4character1_speecbubble.png") no-repeat top left; width: 247px; height: 149px; top: 174px; left: 199px; padding: 0px 10px 0px 15px; position: relative; display: block; z-index: 4; }
.raise_intro_background .intro_elder_head { top: -53px; }

#assemble_group #guard { padding-top: 6px; }
#assemble_group #guard img { margin: 0 auto; display: block; }

.contentAreaPadding { padding: 0px 0px 0px 6%; height: 500px; overflow: hidden; }
.contentAreaPadding h2, .contentAreaPadding h3 { margin: 0; padding: 0 30px 0px 0px; }

#allocate_people .column:last-child { float: left; }
#allocate_people h2 { margin-bottom: 2em; }
#allocate_people .small-5 { margin-right: 0px; width: 33%; }
#allocate_people .small-7 { padding-left: 0px; }
#allocate_people .track { background: url("../images/track.png") no-repeat top left; width: 321px; height: 19px; }
#allocate_people .drag_handle { background: url("../images/dragger.png") no-repeat center center; width: 24px; height: 26px; cursor: pointer; z-index: 6; position: relative; top: -36px; }
#allocate_people .percentage_indicator { position: relative; display: block; width: 40px; height: 30px; text-align: center; top: -34px; z-index: 7; font-family: "seriesorbitregular"; font-weight: normal; color: #ffcb1b; font-size: 1.5em; }
#allocate_people .slider { display: block; position: relative; top: 46px; left: 140px; z-index: 4; }
#allocate_people .allocate_item { margin-bottom: 4px; width: 468px; height: 82px; display: block; position: relative; z-index: 20; }
#allocate_people #allocate_carpenter { background: url("../images/allocate_carpenter_new.png") no-repeat top left; }
#allocate_people #allocate_stoneworker { background: url("../images/allocate_stoneworker_new.png") no-repeat top left; }
#allocate_people #allocate_planner { background: url("../images/allocate_planner_new.png") no-repeat top left; }
#allocate_people #allocate_heavy_lifter { background: url("../images/allocate_heavy_lifter_new.png") no-repeat top left; }
#allocate_people .piechart_wrapper #piechart { padding-top: 40px; display: block; height: 300px; }
#allocate_people .piechart_wrapper .piechart_data { color: #ffe7b0; font-size: 34px; width: 235px; position: relative; display: block; z-index: 4; top: -233px; font-family: "seriesorbitregular"; font-weight: normal; }
#allocate_people .piechart_wrapper .piechart_data #score { font-size: 48px; color: #ffcb1b; width: 110px; display: inline-block; text-align: right; }
#allocate_people .piechart_wrapper .piechart_data p.score_data { font-size: 34px; border-bottom: 1px solid #ffe7b0; padding: 0px 0px 10px 16px; color: #FFE7B0; }
#allocate_people .piechart_wrapper .piechart_data p.score_needs_to_be { font-size: 34px; color: #F0D576; width: 95px; line-height: .5em; margin: -20px auto 0px; text-align: center; }
#allocate_people .piechart_wrapper .piechart_data p.score_needs_to_be .small_copy { display: block; padding-bottom: 10px; font-size: 15px; color: #ffe7b0; }

#assemble_people { text-align: center; display: inline-block; width: 98%; z-index: 40; }
#assemble_people .row { padding-top: 20px; }
#assemble_people .small-2 { width: 24%; padding-top: 0px; margin: 0px; }
#assemble_people .column:last-child { float: left; }

#choose_tools .small-3, #choose_tools .large-3 { width: 23%; padding-left: 0px; padding-right: 0px; }
#choose_tools .row { padding-top: 10px; padding-left: 4%; }
#choose_tools .column:last-child { float: left; }
#choose_tools .tool_info { padding: 21px 10px 0px; text-align: center; margin: -20px auto 0px; line-height: 1.125em; }
#choose_tools .toolpanel { text-align: center; cursor: pointer; font-family: "seriesorbitregular"; font-weight: normal; font-size: 1.125em; color: #554426; }

#antler_pick p, #flint p { margin-top: 6px; text-align: center; }

#hammerstone img, #flint img { margin-top: -10px; }

.allocate_panel_score { max-width: 230px; display: inline-block; position: relative; }
.allocate_panel_score img { position: relative; }
.allocate_panel_score .allocation_score { display: inline-block; position: absolute; z-index: 4; font-family: "seriesorbitregular"; font-weight: normal; font-size: 1.75em; top: 15px; color: #f0d576; left: 65%; }

.finalChosenTools { padding: 0px 0px 0px; margin: 0px; text-align: center; }
.finalChosenTools .chosenPanel { -webkit-transform: scale(0.8, 0.8); -moz-transform: scale(0.8, 0.8); -ms-transform: scale(0.8, 0.8); -o-transform: scale(0.8, 0.8); transform: scale(0.8, 0.8); float: left; display: inline-block; position: relative; font-family: "seriesorbitregular"; color: #554426; font-weight: normal; margin: 0px -16px 0px; padding: 4px 0px 0px; }
.finalChosenTools .chosenPanel:first-child { margin-left: 8px; }
.finalChosenTools .chosenPanel:last-child { margin-right: 0px; }

#locate_stone { width: 792px; display: block; margin: 0 auto; }
#locate_stone .locate_instruction { padding: 0 80px; }
#locate_stone .locate_instruction p { font-size: 1.250em; }
#locate_stone .locate_instruction h2 { line-height: 1em; margin-bottom: -10px; }
#locate_stone .locate_stone_map { position: relative; top: 50px; background: url("../images/location_map.png") no-repeat center center; width: 647px; height: 371px; display: block; margin: 0 auto; }
#locate_stone .location_popup { width: 305.95px; height: 195px; position: absolute; z-index: 6; }
#locate_stone .location_popup .closebutton { right: 14px; top: 10px; }
#locate_stone .location_popup .closebutton.down { right: 14px; top: 27px; }
#locate_stone .location_popup .popup_content { width: 280px; margin: 0 auto; padding: 14px 2px 5px; height: 114px; }
#locate_stone .location_popup .popup_content img { float: left; margin-right: 10px; margin-left: -14px; }
#locate_stone .location_popup .popup_content p { padding: 0 6px; }
#locate_stone .location_popup .popup_content.popup_down { padding-top: 26px; height: 120px; }
#locate_stone #bluestonePopup { left: 32px; top: 36px; }
#locate_stone #sarsenPopup { left: 126px; top: 62px; }
#locate_stone #hexPopup { left: -94px; top: 84px; }
#locate_stone #hexPopup img { margin-left: -5px; margin-right: 0px; }
#locate_stone #granitePopup { left: 191px; top: 111px; }
#locate_stone #hexSpot { left: 117px; top: 48px; }
#locate_stone #graniteSpot { left: 405px; top: 75px; }
#locate_stone #graniteSpot img.mini_stone { position: relative; left: -79px; }
#locate_stone #bluestoneSpot { left: 249px; top: 216px; }
#locate_stone #bluestoneSpot img.mini_stone { position: relative; top: -10px; }
#locate_stone #sarsenSpot { left: 344px; top: 245px; }
#locate_stone #sarsenSpot img.mini_stone { position: relative; left: -78px; }
#locate_stone #stonehenge { left: 356px; top: 290px; width: 170px; }
#locate_stone #stonehenge img { display: block; position: relative; float: left; width: 27px; }
#locate_stone #stonehenge p { background: url("../images/brown_arrow2.png") no-repeat top left; margin-left: 0px; font-family: "seriesorbitregular"; font-weight: normal; font-size: 12px; text-indent: 10px; float: left; position: relative; left: 0px; top: -4px; color: #2e1b0c; }
#locate_stone .location_hotspot { position: absolute; display: block; height: 50px; width: 100px; }
#locate_stone .location_hotspot img:first-child { cursor: pointer; }
#locate_stone .location_hotspot .mini_stone { opacity: 0; }
#locate_stone .location_hotspot .mini_stone_on { opacity: 100; }

.selectButton { margin: 0 auto; color: #2e1b0c; display: block; width: 154px; margin-top: -12px; padding: 0px; text-align: left; cursor: pointer; }
.selectButton p { background: rgba(240, 213, 118, 0.8) url("../images/brown_arrow.png") no-repeat 95% 50%; -webkit-border-radius: 6px 6px; -moz-border-radius: 6px / 6px; border-radius: 6px / 6px; padding-top: 10px; padding-bottom: 6px; padding-right: 140px; padding-left: 10%; font-family: "seriesorbitregular"; font-weight: normal; font-size: 1.5em; }
.selectButton p.over { background-color: #ff8f16; }
.selectButton.down { margin-top: 0px; }

#plan_route { background: url("../images/plan_route_map_new.png") no-repeat top center; width: 742px; margin: 0 auto; background-position: -10px 60px; height: 500px; }
#plan_route #route_step1, #plan_route #route_step2, #plan_route #route_step3 { z-index: 6; position: relative; top: -150px; }
#plan_route #the_route { left: 16px; overflow: hidden; position: relative; top: 170px; overflow: hidden; width: 300px; display: inline-block; height: 130px; }
#plan_route #the_route .route { width: 0px; display: block; overflow: hidden; }
#plan_route #the_route .route img { max-width: none; display: inline; }
#plan_route #the_route .route.routestep1 { width: 100px; }
#plan_route #the_route .route.routestep2 { width: 200px; }
#plan_route #the_route .route.routestep3 { width: 300px; }
#plan_route .push-7 { left: 56%; }
#plan_route .step_heading { margin-top: 16px; margin-bottom: -16px; }
#plan_route .large-4, #plan_route .small-4 { padding: 0; margin: 0; top: 53px; }
#plan_route .options { -webkit-border-radius: 6px 6px; -moz-border-radius: 6px / 6px; border-radius: 6px / 6px; background: none; width: 238px; height: 163px; cursor: pointer; position: relative; border: none; }
#plan_route .option_container { -webkit-border-radius: 6px 6px; -moz-border-radius: 6px / 6px; border-radius: 6px / 6px; background-color: #2e1b0c; text-align: center; padding: 0; width: 226px; height: 150px; }
#plan_route .option_container img { position: relative; }
#plan_route .option_container p { position: relative; top: -40px; z-index: 4; }
#plan_route .rollover, #plan_route .selected { border: 6px solid #ff8f16; top: -6px; left: -6px; background-color: #ff8f16; }

.feedbackStones { display: block; width: 98%; margin-top: -10px; }
.feedbackStones .stonecontainer { display: inline-block; width: 45%; text-align: center; }
.feedbackStones .stonecontainer img { width: 55%; }
.feedbackStones .stonecontainer p { position: relative; bottom: 20px; }
.feedbackStones .hide { display: none; }

#locate_end .small-3 { padding: 0px; width: 22%; }
#locate_end .small-3:last-child { float: left; }
#locate_end .small-3:first-child { margin-left: 2%; }
#locate_end .stonepanel { -webkit-transform: scale(0.8, 0.8); -moz-transform: scale(0.8, 0.8); -ms-transform: scale(0.8, 0.8); -o-transform: scale(0.8, 0.8); transform: scale(0.8, 0.8); padding: 0px; margin: 0px; }
#locate_end .resultmap { width: 92%; }

#assemble_materials { width: 700px; margin: 0 auto; position: relative; }
#assemble_materials h2 { margin-bottom: 30px; }
#assemble_materials .column:last-child { float: left; margin-right: 0; }
#assemble_materials #glue img { top: -54px; }
#assemble_materials #rope img { top: -54px; }
#assemble_materials #wheels img { top: -55px; }
#assemble_materials #crane img { top: -55px; }

.materialpanel { background: url("../images/choose_material_off_new.png") no-repeat top center; width: 166px; height: 150px; color: #333333; text-align: center; margin-top: -16px; display: block; cursor: pointer; margin-bottom: 42px; }
.materialpanel p { margin-top: 0px; padding-top: 25px; font-family: "seriesorbitregular"; font-weight: normal; }
.materialpanel p.doubleline { padding: 19px 20px 0px; }
.materialpanel img { margin: 0; padding: 0; top: -50px; position: relative; }

.materialpanel_on { background: url("../images/choose_material_on_new.png") no-repeat top center; }

#choose_transport #method-water, #choose_transport #method-land { padding-left: 2%; }
#choose_transport .method_title { padding-right: 100px; margin-bottom: 20px; }
#choose_transport .transportmethod { text-align: center; color: #2e1b0c; font-family: "seriesorbitregular"; font-weight: normal; font-size: 23px; }
#choose_transport .transportmethod .methodbig { font-size: 40px; }
#choose_transport .transportmethod img { z-index: 2; width: 364px; height: 287px; }
#choose_transport .method_frame { background: url("../images/method_frame_off.png") no-repeat center center; z-index: 4; display: block; position: relative; top: -265px; width: 314px; height: 235px; left: 26px; }
#choose_transport .method_frame p { position: absolute; bottom: -12px; left: 30%; }
#choose_transport .method_frame.method_frame_on, #choose_transport .method_frame .selected { background: url("../images/method_frame_on.png") no-repeat center center; }

#build_transport_water.contentAreaPadding, #build_transport_land.contentAreaPadding { padding-left: 0px; padding-right: 0px; }
#build_transport_water h2, #build_transport_water h3, #build_transport_land h2, #build_transport_land h3 { padding: 0px; margin: 0px; }

.largestone { position: absolute; z-index: 8; display: block; top: 30px; left: 142px; opacity: 0; }

.build_transport_background { background: url("../images/build_transport_background.png") no-repeat center center; width: 726px; height: 395px; display: inline-block; left: -40px; position: relative; top: 10px; }

#water_blueprint1 { position: relative; display: inline-block; z-index: 4; top: 24px; left: 117px; }

#water_blueprint2 { position: relative; display: inline-block; top: -72px; left: 11px; }

.waterlog_icon1 { background: url("../images/water_icon_off.png") no-repeat center center; position: relative; width: 119px; height: 98px; top: 0px; left: 0px; }
.waterlog_icon1.over { background: url("../images/water_icon_on.png") no-repeat center center; }
.waterlog_icon1 img { position: relative; left: 4px; top:5px;
width: 109px; }

.waterlog_icon2 { background: url("../images/water_icon2_off.png") no-repeat center center; position: relative; width: 121px; height: 98px; top: 0px; left: 0px; padding-top: 6px; }
.waterlog_icon2.over { background: url("../images/water_icon2_on.png") no-repeat center center; }
.waterlog_icon2 img { position: relative;left: 5px;
width: 107px; }

.rope_icon { background: url("../images/rope_icon_off.png") no-repeat center center; position: relative; width: 117px; height: 97px; top: 0px; left: 0px; }
.rope_icon.over { background: url("../images/rope_icon_on.png") no-repeat center center; }
.rope_icon img { position: relative; }

#landrope_blueprint3 { background: url("../images/land_rope_background_off.png") no-repeat center center; position: relative; display: inline-block; width: 424px; height: 145px; top: 21px; left: 101px; }
#landrope_blueprint3.on { background: url("../images/land_rope_background_on.png") no-repeat center center; }

#land_blueprint1 { background: url("../images/land_log1_background_off.png") no-repeat center center; position: relative; display: inline-block; width: 407px; height: 146px; top: -32px; left: 57px; }
#land_blueprint1.on { background: url("../images/land_log1_background_on.png") no-repeat center center; }

#land_blueprint2 { position: relative; display: inline-block; width: 416px; height: 165px; top: -91px; left: 8px; }
#land_blueprint2 .land_log1 { z-index: 4; position: relative; background: url("../images/land_log2_background_off.png") no-repeat center center; }
#land_blueprint2 .land_log1.on { background: url("../images/land_log2_background_on.png") no-repeat center center; }
#land_blueprint2 .log2 { position: relative; top: -170px; left: 19px; }

#disaster { background: url("../images/disaster_person.png") no-repeat; background-position: 459px 244px; height: 546px; }
#disaster h2 { margin-bottom: 10px; }
#disaster h2, #disaster h3 { padding: 0 60px 0px 30px; }
#disaster .disasteroptions { font-size: 30px; color: #ffe7b0; margin-right: 10px; }
#disaster .disaster_options { position: relative; top: 20px; left: -10px; }
#disaster .choice1_panel { background: url("../images/answer_panel1_off.png") no-repeat top left; width: 108%; height: 71px; display: inline-block; padding-left: 20px; font-size: 16px; font-family: "seriesorbitregular"; font-weight: normal; color: #ffcb1b; margin-bottom: 20px; }
#disaster .choice1_panel.on, #disaster .choice1_panel .selected { background: url("../images/answer_panel1_on.png") no-repeat top left; }
#disaster .choice2_panel { background: url("../images/answer_panel2_off.png") no-repeat top left; width: 56%; height: 105px; padding-left: 20px; padding-right: 20px; letter-spacing: 0.1em; display: inline-block; font-size: 1.2em; font-family: "seriesorbitregular"; font-weight: normal; color: #ffcb1b; }
#disaster .choice2_panel.on, #disaster .choice2_panel .selected { background: url("../images/answer_panel2_on.png") no-repeat top left; }

#search_food_source { height: 550px; }
#search_food_source h2, #search_food_source h3 { margin-bottom: 10px; }

.food_sources { background: url("../images/food_source_silhoette.png") no-repeat top left; display: inline-block; width: 100%; height: 259px; position: relative; top: 38px; left: 42px; }

.food_container { display: block; width: 121px; height: 120px; position: relative; top: -30px; float: left; font-family: "seriesorbitregular"; font-weight: normal; font-size: 17px; }
.food_container img { margin: 0px; padding: 0px; position: relative; z-index: 4; top: -14px; left: -10px; display: inline; max-width: none!important; }
.food_container img.chosenFood { z-index: 14; }
.food_container p { text-align: center; background-color: rgba(46, 27, 12, 0.8); padding: 16px 0px 0px; -webkit-border-radius: 6px 6px; -moz-border-radius: 6px / 6px; border-radius: 6px / 6px; margin: 0px auto 0px; margin-top: -6px; z-index: 2; width: 115px; height: 51px; }

.berry_container { left: 10px; }
.berry_container img { left: -20px; }

.chicken_container { left: 71px; height: 126px; }
.chicken_container img { top: -22px; z-index: 5; }

.nuts_container { position: relative; left: 142px; }
.nuts_container img { left: -14px; top: -10px; }

.potatoe_container { left: 205px; }
.potatoe_container img { left: -16px; top: -11px; }

.pig_container { display: block; left: 10px; top: -5px; clear: left; }
.pig_container img { left: -15px; z-index: 7; }

.ox_container { display: block; left: 447px; top: -5px; clear: right; }
.ox_container img { top: -20px; left: -10px; }

.food_basket { background: url("../images/basket_off.png") no-repeat center center; width: 354px; height: 226px; float: left; clear: both; position: relative; display: block; top: -188px; left: 186px; height: 300px; z-index: 1; text-align: center; pointer-events: none; }
.food_basket img { position: relative; top: 20px; }

#food_basket_hotspot { background: url("../images/basket_mask.png") no-repeat 0px 46px; width: 276px; height: 244px; display: block; position: relative; top: 124px; left: 228px; z-index: 8; pointer-events: none; }

#journey_end .food_basket { -webkit-transform: scale(0.8, 0.8); -moz-transform: scale(0.8, 0.8); -ms-transform: scale(0.8, 0.8); -o-transform: scale(0.8, 0.8); transform: scale(0.8, 0.8); top: -30px; float: none; position: relative; left: 14%; }
#journey_end .food_basket img { position: relative; }
#journey_end .food_basket .resultTransport { width: 92%; }
#journey_end .food_basket #pigInBasket { top: 76px; left: -137px; z-index: 4; }
#journey_end .food_basket #oxInBasket { top: -48px; left: -18px; }
#journey_end .food_basket #nutsInBasket { top: -72px; left: 37px; }
#journey_end .food_basket #berriesInBasket { top: 30px; left: 143px; }
#journey_end .basket_mask { background: url("../images/basket_mask.png") no-repeat 0px 0px; display: block; width: 276px; height: 244px; left: 39px; position: relative; top: -114px; z-index: 4; }

 /* #triliton,#arrange_stone,#join_stones,#raise_stones{ &.contentAreaPadding{ padding-top:50px; } }
*/
#triliton .triliton_plan { background-image: url("../images/rotate_stone_planner_new.png"), url("../images/great_paper_background3.png"); background-position: 0px 95px,top center; background-repeat: no-repeat; width: 726px; height: 396px; }
#triliton .triliton_plan h4 { font-family: "seriesorbitregular"; font-weight: normal; font-size: 1.250em; display: inline-block; position: relative; top: 20px; left: 48px; color: #2e1b0c; }
#triliton .triliton_plan .thestones { position: relative; top: -36px; }
#triliton #topstone { display: block; position: relative; top: 34px; left: 220px; width: 239px; height: 54px; z-index: 4; background: url("../images/top_stone.png") no-repeat top left; opacity: 0; }
#triliton #topstone.on { opacity: 1; }
#triliton #leftstone { display: block; position: relative; top: 20px; left: 212px; width: 135px; height: 220px; background: url("../images/left_stone.png") no-repeat top left; opacity: 0; }
#triliton #leftstone.on { opacity: 1; }
#triliton #rightstone { display: block; left: 353px; position: relative; top: -206px; width: 118px; height: 228px; background: url("../images/right_stone.png") no-repeat top left; opacity: 0; }
#triliton #rightstone.on { opacity: 1; }
#triliton .build_icons { left: 624px; top: 109px; }
#triliton .topstone_icon { background: url("../images/topstone_icon_off.png") no-repeat top left; width: 115px; height: 96px; display: inline-block; }
#triliton .topstone_icon img { position: relative; top: 24px; }
#triliton .topstone_icon.over { background: url("../images/topstone_icon_on.png") no-repeat top left; }
#triliton .leftstone_icon { background: url("../images/leftstone_icon_off.png") no-repeat top left; width: 115px; height: 95px; display: inline-block; }
#triliton .leftstone_icon.over { background: url("../images/leftstone_icon_on.png") no-repeat top left; }
#triliton .leftstone_icon img { position: relative; left: 24px; top: 2px; }
#triliton .rightstone_icon { background: url("../images/rightstone_icon_off.png") no-repeat top left; width: 115px; height: 95px; display: inline-block; }
#triliton .rightstone_icon img { position: relative; left: 28px; top: 2px; }
#triliton .rightstone_icon.over { background: url("../images/rightstone_icon_on.png") no-repeat top left; }

#arrange_stone h2, #arrange_stone h3 { padding: 0px 50px 0 30px; }
#arrange_stone .stone_plan { background-image: url("../images/rotate_stone_planner_new.png"), url("../images/rotate_stone_background2.png"); background-repeat: no-repeat; background-position: 46px 112px,center 5px; width: 726px; height: 414px; }
#arrange_stone .sunray_correct { position: relative; display: inline-block; left: 228px; top: -297px; }
#arrange_stone .sunray_correct.hide { display: none; }
#arrange_stone #sun_dial { display: block; width: 404px; height: 404px; position: relative; top: -23px; left: 163px; z-index: 8; }
#arrange_stone #sun_dial .dial { background-image: url("../images/new_sundial.png"); background-repeat: no-repeat; background-position: center 4px; width: 404px; height: 404px; position: relative; }
#arrange_stone #sun_dial .arrange_hotspot { display: inline-block; position: absolute; }
#arrange_stone #sun_dial #arrangeA { left: 305px; top: 165px; }
#arrange_stone #sun_dial #arrangeB { left: 215px; top: 308px; }
#arrange_stone #sun_dial #arrangeC { left: 119px; top: 89px; }

.interaction_panel_options { width: 100%; display: block; background-size: 100% auto; padding: 30px 20px 20px; text-align: left; font-family: "seriesorbitregular"; font-weight: normal; }
.interaction_panel_options p { padding: 0; margin: 0; display: block; font-size: 36px; color: white; }
.interaction_panel_options span.block_options { font-size: 18px; color: #ffcb1b; line-height: 20px; position: relative; top: -44px; z-index: 2; padding: 0 6px 0px 30px; display: inline-block; margin-left: .5em; }

#join_stones .join_panel_options { background: url("../images/joinstone_panel.png") no-repeat center center; height: 133px; max-width: 356px; }
#join_stones .join_panel_options.over { background: url("../images/joinstone_panel_highlight.png") no-repeat center center; }
#join_stones .small-6 img { margin-left: 8%; }

#upright_stones .small-4, #raise_stones .small-4 { text-align: center; }

#upright_stones h2 { text-align: center; }
#upright_stones .raise_panel { background: url("../images/raisingstone_panel_off.png") no-repeat center center; max-width: 236px!important; height: 134px; margin: 0 auto; }
#upright_stones .raise_panel.over { background: url("../images/raisingstone_panel_on.png") no-repeat center center; }
#upright_stones .row { padding-top: 50px; }
#upright_stones .columns { padding: 0px; margin: 0px; }
#upright_stones .small-4 { width: 31%; }

#raise_stones .splint_panel { padding-top: 8px; }
#raise_stones .lifter_panel { padding-top: 32px; }
#raise_stones .lifter_panel img { margin-bottom: 20px; }
#raise_stones .small-4 { margin-left: -5%; }
#raise_stones .small-4:first-child { margin-left: 2%; }
#raise_stones .raise_panel { background: url("../images/raisingstone_panel_off.png") no-repeat center center; max-width: 236px!important; height: 134px; }
#raise_stones .raise_panel.over { background: url("../images/raisingstone_panel_on.png") no-repeat center center; }
#raise_stones span.block_options { font-size: 16px; }

#raiseend { width: 975px !important; display: block; }
#raiseend .feasttime_panel { width: 975px !important; margin: 0px; padding: 8% 40px 0%; padding-right: 10%; position: relative; left: 0px; background: url("../images/feasttime_background.jpg") no-repeat top left; height: 630px; display: block; }
#raiseend .raiseFailedBackground { width: 975px !important; margin: 0px; padding: 0px; position: relative; left: -1px; height: 630px; display: block; }
#raiseend .raiseSuccessBackground { width: 975px !important; margin: 0px; padding: 0px; position: relative; left: -1px; background: url("../images/task_fail_background1_animation.jpg") no-repeat top left; height: 630px; display: block; }

.raisefailedtask { text-align: center; }
.raisefailedtask img { width: 25%; height: 25%; margin-right: 6px; }
.raisefailedtask img:last-child { margin-right: 0px; }
.raisefailedtask .reduceImageSize { width: 20%; height: 20%; }

.scoreboard { text-align: center; padding-top: 32px; }

.scoreboard_ray { background: url("../images/scoreboard_sunrays.png") no-repeat center center; width: 284px; height: 275px; position: relative; display: block; }

.scoreboard_panel { background: url("../images/scoreboard1.png") no-repeat center center; width: 245px; height: 220px; position: relative; z-index: 4; display: inline-block; top: -244px; left: 10px; text-align: center; color: #ffcb1b; padding-top: 100px; font-family: "seriesorbitregular"; font-weight: normal; font-size: 3em; padding: 84px 0px 0px 10px; }

.scoreboard_message { background-color: rgba(21, 83, 87, 0.8); width: 197px; min-height: 110px; display: inline-block; -webkit-border-radius: 6px 6px; -moz-border-radius: 6px / 6px; border-radius: 6px / 6px; text-align: center; color: #ffe7b0; top: -269px; left: 17px; position: relative; font-size: .813em; line-height: 1.1em; padding: 0px 10px 0px; }

@media only screen and (max-width: 768px) { .row { width: 768px; } }
