#tooltip3d{display:none}#controls-reminder{position:relative;color:#fff;font-size:12px;padding-left:30px;padding-bottom:8px}#controls-reminder img{position:absolute;top:0;left:2px;width:22px;height:30px}.mode_3d,html{background:#0b3975}.mode_3d #game_play_area_wrap{transform-style:preserve-3d;-webkit-transform-style:preserve-3d;transform-origin:50% 50%;pointer-events:none;overflow:hidden;height:100vh}#game_play_area{will-change:transform}.grabbinghand{cursor:grabbing!important;cursor:-webkit-grabbing!important;cursor:moz-grabbing!important}.mode_3d #game_play_area_background{display:none}#bg-anchor{position:absolute;background:url(img/bg.jpg) no-repeat;width:1024px;height:825px;top:-439px;left:-506px;backface-visibility:hidden}#playArea{margin:15px;height:850px;width:100%;display:block;background-position:50%;background-repeat:no-repeat;pointer-events:visible}#playArea div{transform-style:preserve-3d;-webkit-transform-style:preserve-3d}#count_remain{position:absolute;right:3px;top:3px;transform:translateZ(10px);z-index:200;width:50px;height:50px;background:url(img/tile-back.png);background-size:contain;background-repeat:no-repeat;text-align:center;color:#f6f5f4;font:700 25px/52px Roboto,Arial,sans-serif;text-shadow:1px 1px 10px rgba(0,0,0,.8)}#map_container{position:relative;width:100%;height:100%;overflow:visible}.mode_3d #playArea{height:1200px}#map_scrollable,#map_scrollable_oversurface{position:absolute;top:50%;left:50%;width:100%;height:100%;overflow:visible}#map_surface{position:absolute;top:0;left:0;width:100%;height:100%}#map_footer{text-align:center}@keyframes fade-in{0%{opacity:0}}@keyframes fade-out{to{opacity:0}}.fade-out{animation:fade-out .35s ease-in-out forwards!important}.face{width:84px;height:97px;background-size:100% 100%;border-radius:30%;will-change:transform,animation}.face,.facelabel{position:absolute;backface-visibility:hidden}.facelabel{left:0;right:0;text-align:center;line-height:97px;font-size:35px;font-weight:700;color:#fff;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;text-shadow:1px 1px 5px #000;transform:translateZ(1px);transition:transform .35s ease-in-out}.has-bldg .facelabel{display:none}#possible_rotator .facelabel{font-size:60px}.face-1 .facelabel{color:#689b34}.face-2 .facelabel{color:#abd62d}.face-3 .facelabel{color:#eee5b2}.face-4 .facelabel{color:#b7cbd1}.face-5 .facelabel{color:#94eaea}.rotate60 .facelabel{transform:rotate(-60deg) translateZ(1px)}.rotate120 .facelabel{transform:rotate(-120deg) translateZ(1px)}.rotate180 .facelabel{transform:rotate(-180deg) translateZ(1px)}.rotate240 .facelabel{transform:rotate(-240deg) translateZ(1px)}.rotate300 .facelabel{transform:rotate(-300deg) translateZ(1px)}.face.possible{position:absolute;transform:translateZ(1px) scale(.8);cursor:pointer;animation:fade-in .35s ease-in-out}#buildPalette .rotator .facelabel,#cancelator span,.face.possible{background-image:url(img/hex-possible.png)}.face.face-1{background-image:url(img/hex-1.png)}.face.face-2{background-image:url(img/hex-2.png)}.face.face-3{background-image:url(img/hex-3.png)}.face.face-4{background-image:url(img/hex-4.png)}.face.face-5{background-image:url(img/hex-5.png)}.face.face-6{background-image:url(img/hex-6.png)}.bldg-container.level1,.level1 .face,.level1 .sides{transform:translateZ(20px)}.bldg-container.level2,.level2 .face,.level2 .sides{transform:translateZ(40px)}.bldg-container.level3,.level3 .face,.level3 .sides{transform:translateZ(60px)}.bldg-container.level4,.level4 .face,.level4 .sides{transform:translateZ(80px)}.bldg-container.level5,.level5 .face,.level5 .sides{transform:translateZ(100px)}.bldg-container.level6,.level6 .face,.level6 .sides{transform:translateZ(120px)}.level1.possible{transform:translateZ(23px) scale(.8)}.level2.possible{transform:translateZ(43px) scale(.8)}.level3.possible{transform:translateZ(63px) scale(.8)}.level4.possible{transform:translateZ(83px) scale(.8)}.level5.possible{transform:translateZ(103px) scale(.8)}.level6.possible{transform:translateZ(123px) scale(.8)}#playArea .tile .face:after{content:"";position:absolute;width:84px;height:97px;background-size:100% 100%;transform:translateZ(-17px);backface-visibility:hidden;z-index:-200;border-radius:20%;background-image:url(img/hex-bg.png)}#playArea .side1{transform:translatez(-.5px) rotate(90deg) translatex(103px) translatey(22px) rotatex(90deg);z-index:-100}#playArea .side2{transform:translatez(-.5px) rotate(30deg) translatex(68px) translatey(121px) rotatex(90deg);z-index:-100}#playArea .side3{transform:translatez(-.5px) rotate(30deg) translatex(139px) translatey(79px) rotatex(90deg);z-index:-100}#playArea .side4{transform:translatez(-.5px) rotate(-30deg) translatex(-35px) translatey(140px) rotatex(90deg);z-index:-100}#playArea .side5{transform:translatez(-.5px) rotate(90deg) translatex(32px) translatey(-20px) rotatex(90deg);z-index:-100}#playArea .side6{transform:translatez(-.5px) rotate(-30deg) translatex(36px) translatey(181px) rotatex(90deg);z-index:-100}#playArea .side1:after,#playArea .side2:after{transform:translatez(164px)}#playArea .side1:after,#playArea .side2:after,#playArea .side3:after{content:"";width:48px;height:17px;background:inherit;position:absolute}#playArea .side3:after{transform:translatez(81px)}#playArea .side4:after{transform:translatez(82px)}#playArea .side4:after,#playArea .side5:after{content:"";width:48px;height:17px;background:inherit;position:absolute}#playArea .side5:after{transform:translatez(80px)}#playArea .side6:after{content:"";transform:translatez(164px);width:48px;height:17px;background:inherit;position:absolute}#playArea .tile .side{width:48px;height:17px;background:url(img/texture_side.jpg);background-size:48px 17px}#playArea .possible .side,#playArea .tile .side{box-sizing:border-box;position:absolute;transform-origin:bottom center}#playArea .possible .side{border-left:3px solid #acc1de;border-right:3px solid #acc1de;width:97px;height:20px;display:block}.tile{transform-origin:84px 97px;transition:transform .35s ease-in-out;border-radius:50% 50% 35% 35%;will-change:transform}.tile,.tile:after{position:absolute;width:168px;height:168px;backface-visibility:hidden}.tile:after{content:"";background:no-repeat url(img/tile-mask.png);background-size:cover;top:1px;transform:translateZ(.1px);pointer-events:none}.tile:hover:after{background-position:100% 0}.tile.level1:after{transform:translateZ(20.1px)}.tile.level2:after{transform:translateZ(40.1px)}.tile.level3:after{transform:translateZ(60.1px)}.tile.level4:after{transform:translateZ(80.1px)}.tile.level5:after{transform:translateZ(100.1px)}.tile.level6:after{transform:translateZ(120.1px)}.tile.rotate60{transform:translate(-43px,-25px) rotate(60deg)}.tile.rotate120{transform:translate(-43px,-73px) rotate(120deg)}.tile.rotate180{transform:translateY(-97px) rotate(180deg)}.tile.rotate240{transform:translate(43px,-73px) rotate(240deg)}.tile.rotate300{transform:translate(43px,-25px) rotate(300deg)}.tile .face.subface0{top:.5px;left:42px}.tile .face.subface1{top:71.5px;left:.5px}.tile .face.subface2{top:71.5px;right:.5px}.counters{float:left;margin-left:15px;font-size:18px;font-weight:700;text-align:center}.counters div{display:flex;align-items:center;margin-bottom:2px}.pieceicon{background-image:url(img/sides-hd-w.png);background-size:66px;display:inline-block;height:40px;width:24px;margin-right:5px}.pieceicon.towericon{background-position:0 0}.pieceicon.towericon.brown{background-position:0 20%}.pieceicon.towericon.white{background-position:0 40%}.pieceicon.towericon.red{background-position:0 60%;z-index:30}.pieceicon.towericon.black{background-position:0 39.5px}.pieceicon.templeicon{background-position:-26px 0;width:21px;margin-top:-13px;z-index:40}.pieceicon.templeicon.brown{background-position:-26px 20%}.pieceicon.templeicon.white{background-position:-26px 40%}.pieceicon.templeicon.red{background-position:-26px 60%}.pieceicon.templeicon.black{background-position:-26px 101%}.pieceicon.huticon{background-position:-48px 0;width:18px;margin-top:-20px;z-index:10}.pieceicon.huticon.brown{background-position:-48px 20%}.pieceicon.huticon.white{background-position:-48px 40%}.pieceicon.huticon.red{background-position:-48px 60%}.pieceicon.huticon.black{background-position:-48px 100%}.preview{height:100px;margin-left:70px;display:block}.preview.unknown{background:url(img/tile-back.png) 50% 50% no-repeat}.preview .tile{transform:scale3d(.6,.6,.6);transform-origin:50% 0}.dijitTooltip .pieceicon{float:right}.dijitTooltip .bldgname{text-transform:uppercase}.dijitTooltip .bldgpoints{display:inline-block;padding:0 6px;color:#fff;background:#333;border-radius:4px;font-size:12px;font-weight:400;vertical-align:middle}.dijitTooltip li{list-style:square outside;margin:0 0 .5em 2em}.prior-building{color:#fff}.prior-building.white{color:#000}.hut{position:absolute;width:28px;height:28px;transform-style:preserve-3d;box-shadow:inset 0 0 0 16px rgba(0,0,0,.65),0 0 6px 2px rgba(0,0,0,.65);will-change:transform}.hutside{transform-style:preserve-3d;transform-origin:bottom center;transform:rotateX(-90deg) translateZ(0)}.hutside,.hutside:after{position:absolute;width:28px;height:32px;background-image:url(img/sides-hd-w.png);background-size:104px 350px;background-position:133px -29px}.hutside:after{content:"";transform-style:preserve-3d;transform:translateZ(-28px)}.hutroof{transform-style:preserve-3d;transform-origin:bottom center;transform:translateZ(2px) translatey(-10px) rotate(90deg) translateZ(-7.5px) rotateX(-50deg) translateZ(18px)}.hutroof,.hutroof:after{position:absolute;width:28px;height:28px;background:linear-gradient(#fedf3f,#f9b131 22%,#f29100 81%,#fedf3f 87%,#f29100 94%,#f9b131)}.hutroof:after{content:"";transform-style:preserve-3d;transform:translateZ(-6px) rotateX(-79deg) translateZ(-7px)}.prior-building .hutroof:after,.prior-building .hutroof:before{content:"\2022";position:absolute;width:28px;height:28px;text-align:center;font-size:35px;line-height:28px}.temple{height:40px;transform-style:preserve-3d;box-shadow:inset 0 0 0 20px rgba(0,0,0,.65),0 0 6px 2px rgba(0,0,0,.65)}.temple,.templeside{position:absolute;width:40px}.templeside{transform-style:preserve-3d;transform-origin:bottom center;transform:translateY(-10px) rotateX(-90deg)}.templeside,.templeside:after{height:50px;background-image:url(img/sides-hd-w.png);background-size:116.5px 420px;background-position:73px -22px}.templeside:after{content:"";position:absolute;width:40px;transform-style:preserve-3d;transform-origin:bottom center;transform:translateZ(-40px)}.templeroof{transform-style:preserve-3d;transform-origin:bottom center;transform:translatey(-30px) rotate(-90deg) translatey(18px) rotateX(-68deg)}.templeroof,.templeroof:after{position:absolute;width:40px;height:50px;background:linear-gradient(#f29100,#f9b131 5%,#f9b131 12%,#f29100 21%,#fedf3f 24%,#f9b131 32%,#f9b131 37%,#f29100 46%,#fedf3f 49%,#f9b131 56%,#f9b02e 62%,#f29100 70%,#fedf3f 73%,#f9b131 77%,#f9b02e 84%,#f39600 89%,#fedf3f 91%,#f9b02e)}.templeroof:after{content:"";transform-style:preserve-3d;transform-origin:top center;transform:translatez(4px) rotateX(-44deg) translatey(2px)}.prior-building .templeroof:after,.prior-building .templeroof:before{content:"\2022";position:absolute;width:40px;height:50px;text-align:center;font-size:35px;line-height:50px}.tower{height:40px;transform-style:preserve-3d;border-radius:50%;box-shadow:inset 0 0 0 20px rgba(0,0,0,.53),0 0 6px 2px rgba(0,0,0,.65)}.tower,.towerside{position:absolute;width:40px}.towerside{transform-style:preserve-3d;transform-origin:bottom center;transform:translateY(-50px) rotateX(-90deg)}.towerside,.towerside:after{height:70px;background-image:url(img/sides-hd-w.png);background-size:116.5px 420px;background-position:-1px 0}.towerside:after{content:"";position:absolute;width:40px;transform-style:preserve-3d;transform-origin:bottom center;transform:rotateY(-90deg)}.prior-building .towerside:after,.prior-building .towerside:before{content:"\2022";position:absolute;width:40px;height:70px;text-align:center;font-size:35px;line-height:28px}.towerroof{transform-style:preserve-3d;transform-origin:center center;transform:translatez(25px)}.towerroof,.towerroof:after{position:absolute;width:40px;height:40px;border-radius:50%;background:radial-gradient(#f29100 6%,#f9b131 62%,#fedf3f 64%,#f29100 75%)}.towerroof:after{content:"";transform-style:preserve-3d;transform-origin:center center;transform:translatez(-18px)}.towerroof:before{content:"";position:absolute;width:36px;height:36px;border-radius:70%;background:radial-gradient(#f29100 6%,#f9b131 62%,#fedf3f 64%,#f29100 75%);transform-style:preserve-3d;transform-origin:50% 50%;transform:translate3D(2px,2px,20.5px)}.brown>.templeside,.brown>.templeside:after{background-position:73px -92px}.brown>.templeroof,.brown>.templeroof:after{background:linear-gradient(#472300,#643200 5%,#643200 12%,#472300 21%,#7b3d00 24%,#643200 32%,#643200 37%,#472300 46%,#7b3d00 49%,#643200 56%,#643200 62%,#472300 70%,#7b3d00 73%,#643200 77%,#643200 84%,#472300 89%,#7b3d00 91%,#643200)}.brown>.towerside,.brown>.towerside:after{background-position:-1px -70px}.brown>.towerroof{background:#964b32;background:radial-gradient(#472300 0,#643200 62%,#7b3d00 64%,#472300 75%)}.brown>.towerroof:after,.brown>.towerroof:before{background:radial-gradient(#472300 0,#643200 62%,#7b3d00 64%,#472300 75%)}.brown>.hutside,.brown>.hutside:after{background-position:133px -88px}.brown>.hutroof,.brown>.hutroof:after{background:linear-gradient(#7b3d00,#643200 22%,#472300 81%,#7b3d00 87%,#472300 94%,#643200)}.red>.hutside,.red>.hutside:after{background-position:133px 146px}.red>.hutroof,.red>.hutroof:after{background:linear-gradient(#e73b37,#e41b0b 22%,#b21509 81%,#e73b37 87%,#b21509 94%,#e41b0b)}.red>.templeside,.red>.templeside:after{background-position:73px -232px}.red>.templeroof,.red>.templeroof:after{background:linear-gradient(#b21509,#e41b0b 5%,#e41b0b 12%,#b21509 21%,#e73b37 24%,#e41b0b 32%,#e41b0b 37%,#b21509 46%,#e73b37 49%,#e41b0b 56%,#e41b0b 62%,#b21509 70%,#e73b37 73%,#e41b0b 77%,#e41b0b 84%,#b21509 89%,#e73b37 91%,#e41b0b)}.red>.towerside,.red>.towerside:after{background-position:-1px -210px}.red>.towerroof,.red>.towerroof:after,.red>.towerroof:before{background:radial-gradient(#b21509 0,#e41b0b 62%,#e73b37 64%,#b21509 75%)}.white>.hutside,.white>.hutside:after{background-position:133px -146px}.white>.hutroof,.white>.hutroof:after{background:linear-gradient(#fefefe,#f2f2f2 22%,#e5e5e5 81%,#fefefe 87%,#e5e5e5 94%,#f2f2f2)}.white>.templeside,.white>.templeside:after{background-position:73px -162px}.white>.templeroof,.white>.templeroof:after{background:linear-gradient(#e5e5e5,#f2f2f2 5%,#f2f2f2 12%,#e5e5e5 21%,#fefefe 24%,#f2f2f2 32%,#f2f2f2 37%,#e5e5e5 46%,#fefefe 49%,#f2f2f2 56%,#f2f2f2 62%,#e5e5e5 70%,#fefefe 73%,#f2f2f2 77%,#f2f2f2 84%,#e5e5e5 89%,#fefefe 91%,#f2f2f2)}.white>.towerside,.white>.towerside:after{background-position:-1px -140px}.white>.towerroof,.white>.towerroof:after,.white>.towerroof:before{background:radial-gradient(#e5e5e5 0,#f2f2f2 62%,#fefefe 64%,#e5e5e5 75%)}.tempbuilding>.hutside,.tempbuilding>.hutside:after{background-position:133px -262px}.tempbuilding>.hutroof,.tempbuilding>.hutroof:after{background:rgba(209,255,173,.5);box-shadow:inset 0 0 1px 1px #637f53}.tempbuilding>.templeside,.tempbuilding>.templeside:after{background-position:73px -302px}.tempbuilding>.templeroof,.tempbuilding>.templeroof:after{background:linear-gradient(rgba(209,255,173,.5),rgba(209,255,173,.5),rgba(209,255,173,.5),rgba(209,255,173,.5),#637f53,rgba(209,255,173,.5),rgba(209,255,173,.5),#637f53,rgba(209,255,173,.5),rgba(209,255,173,.5),#637f53,rgba(209,255,173,.5),rgba(209,255,173,.5),rgba(209,255,173,.5),rgba(209,255,173,.5));box-shadow:inset 0 0 1px 2px #637f53}.tempbuilding>.towerside,.tempbuilding>.towerside:after{background-position:-1px -280px}.tempbuilding>.towerroof,.tempbuilding>.towerroof:after,.tempbuilding>.towerroof:before{background:rgba(209,255,173,.5);box-shadow:inset 0 0 1px 2px #637f53}.black>.hutside,.black>.hutside:after{background-position:133px 29px}.black>.hutroof,.black>.hutroof:after{background:linear-gradient(#c8c8c8,#2c2c2c 4%,#2c2c2c 40%,#5a5959 63%,#2c2c2c 80%)}.black>.templeside,.black>.templeside:after{background-position:73px 50px}.black>.templeroof,.black>.templeroof:after{background:linear-gradient(#2c2c2c,#2c2c2c,#2c2c2c,#2c2c2c,#b1aeae,#2c2c2c,#2c2c2c,#b1aeae,#2c2c2c,#2c2c2c,#b1aeae,#2c2c2c,#2c2c2c,#2c2c2c,#2c2c2c)}.black>.towerside,.black>.towerside:after{background-position:-1px 70px}.black>.towerroof,.black>.towerroof:after,.black>.towerroof:before{background:radial-gradient(#2c2c2c 0,#2c2c2c 50%,#636363 85%)}#playArea .tile.prior-move-white .face:after{background-image:url(img/hex-white.png)}#playArea .tile.prior-move-white .side,#playArea .tile.prior-move-white .side:after{box-shadow:inset 0 0 0 10px hsla(0,0%,93.3%,.56)}#playArea .tile.prior-move-yellow .face:after{background-image:url(img/hex-yellow.png)}#playArea .tile.prior-move-yellow .side,#playArea .tile.prior-move-yellow .side:after{box-shadow:inset 0 0 0 10px rgba(255,168,17,.56)}#playArea .tile.prior-move-red .face:after{background-image:url(img/hex-red.png)}#playArea .tile.prior-move-red .side,#playArea .tile.prior-move-red .side:after{box-shadow:inset 0 0 0 10px rgba(204,0,0,.56)}#playArea .tile.prior-move-brown .face:after{background-image:url(img/hex-brown.png)}#playArea .tile.prior-move-brown .side,#playArea .tile.prior-move-brown .side:after{box-shadow:inset 0 0 0 10px rgba(109,52,33,.56)}#playArea .tile.prior-move-black .face:after{background-image:url(img/hex-black.png)}#playArea .tile.prior-move-black .side,#playArea .tile.prior-move-black .side:after{box-shadow:inset 0 0 0 10px rgba(17,17,17,.56)}.bldg-container .temple,.bldg-container .tower{top:30px!important;left:25px!important}.bldg-container>.hut:only-child{top:30px;left:25px}.bldg-container>.hut:not(:only-child):first-child{top:48px;left:2px;transform:rotate(-30deg)}.bldg-container>.hut:nth-child(2){top:20px;left:49px;transform:rotate(-30deg)}.bldg-container>.hut:nth-child(3){top:8px;left:10px;transform:rotate(60deg)}.bldg-container>.hut:nth-child(4){top:60px;left:42px;transform:rotate(60deg)}.bldg-container>.hut:nth-child(5){top:34px;left:26px;transform:rotate(-30deg)}.bldg-container>.hut:nth-child(6){top:30px;left:25px;transform:translateZ(25px) rotate(60deg)}.level2 .bldg-container>.hut:not(:only-child):first-child{top:28px;left:8px}.level2 .bldg-container>.hut:nth-child(2){top:28px;left:45px}.level3 .bldg-container>.hut:first-child{top:20px;left:9px;transform:rotate(0deg)}.level3 .bldg-container>.hut:nth-child(2){top:20px;left:45px;transform:rotate(0deg)}.level3 .bldg-container>.hut:nth-child(3){top:55px;left:25px;transform:rotate(-90deg)}.bldg-container{position:absolute;backface-visibility:hidden}.palette{transform-origin:50% 50%;transition:all 1s;position:absolute;border-radius:50%;height:60px;width:60px;transform:translate3d(12px,16px,10px);animation:flipanim .5s ease 1 forwards;box-shadow:inset 0 0 5px 35px rgba(209,255,173,.68)}#cancelator{width:42px;height:47px;position:absolute;left:0;margin:auto}#cancelator span{width:84px;height:97px;position:absolute;font-size:40px!important;background-size:100% 100%;transform:translateX(-10px) scale(.5)!important;transform-origin:top center;color:#fff;left:0;top:-5px;user-select:none}#buildPalette>:first-child{animation:rotator1 1.5s ease 1 forwards}#buildPalette>:nth-child(2){animation:rotator2 1.5s ease 1 forwards}#buildPalette>:nth-child(3){animation:rotator3 1.5s ease 1 forwards}#buildPalette>:nth-child(4){animation:rotator4 1.5s ease 1 forwards}#buildPalette>:nth-child(5){animation:rotator5 1.5s ease 1 forwards}#buildPalette>:nth-child(6){animation:rotator6 1.5s ease 1 forwards}#buildPalette .rotator .facelabel{width:84px;height:97px;position:absolute;font-size:60px;background-size:100% 100%;transform:translateX(-50px) scale(.25);transform-origin:top center;left:0;top:-5px;color:#fff}.rotator{position:absolute;height:40px;width:90px;transform-origin:center right;transform:rotate(0deg);left:0;margin-top:40%;transition:all 3s;will-change:transform}@keyframes rotator1{to{transform:rotate(60deg)}}@keyframes rotator2{to{transform:rotate(120deg)}}@keyframes rotator3{to{transform:rotate(180deg)}}@keyframes rotator4{to{transform:rotate(240deg)}}@keyframes rotator5{to{transform:rotate(300deg)}}@keyframes rotator6{to{transform:rotate(1turn)}}@keyframes flipanim{to{height:180px;width:180px;transform:translate3d(-45px,-40px,90px)}}