UNPKG

magcore-app-2048

Version:

2048 is one of the world’s most popular puzzles. The rules are simple: you need to shuffle all the bars to one side of the game field. Your goal is to reach 2048.

3 lines (2 loc) 7.92 kB
#pageInit{display:table}#pageInit>.cell{display:table-cell;position:relative;text-align:center;vertical-align:middle;font-size:150%}html,body{margin:0;padding:0;background:#CBBA9D !important;color:#ffffff;font-family:"Clear Sans", "Helvetica Neue", Arial, sans-serif}#pLeft{color:#776e65;width:25%;float:left;height:480px;position:relative}#pCenter{color:#776e65;width:50%;float:left;height:480px;position:relative}#pRight{color:#776e65;padding-right:20px;width:21%;float:left;height:480px;text-align:center}#pRight h1{font-size:48px;margin:0;margin-top:70px}#pRight h2{font-size:12.8px;font-weight:normal;margin:0}#pRight h3{font-size:22.4px;text-transform:uppercase;margin:0;margin-top:16px}#howTo{font-size:12.8px}#keyNote{margin-top:16px}#game{width:720px;height:480px;padding:0;margin:0;background:inherit}#leftKey{position:absolute;width:0;height:0;border-style:solid;border-width:13.75px 13.75px 13.75px 0;border-color:transparent #776e65 transparent transparent;left:-27.5px;top:120.25px}#leftKey::after{display:block;content:'';position:absolute;width:0;height:0;border-style:solid;border-width:11px 11px 11px 0;border-color:transparent #CBBA9D transparent transparent;left:1.65px;top:-11px}#leftKey.click::after{border-color:transparent #776e65 transparent transparent}#rightKey{position:absolute;width:0;height:0;border-style:solid;border-width:13.75px 0 13.75px 13.75px;border-color:transparent transparent transparent #776e65;right:-27.5px;top:120.25px}#rightKey::after{display:block;content:'';position:absolute;width:0;height:0;border-style:solid;border-width:11px 0 11px 11px;border-color:transparent transparent transparent #CBBA9D;right:1.65px;top:-11px}#rightKey.click::after{border-color:transparent transparent transparent #776e65}#topKey{position:absolute;width:0;height:0;border-style:solid;border-width:0 13.75px 13.75px 13.75px;border-color:transparent transparent #776e65 transparent;left:114px;top:-27.5px}#topKey::after{display:block;content:'';position:absolute;width:0;height:0;border-style:solid;border-width:0 11px 11px 11px;border-color:transparent transparent #CBBA9D transparent;left:-11px;bottom:-12.65px}#topKey.click::after{border-color:transparent transparent #776e65 transparent}#botKey{position:absolute;width:0;height:0;border-style:solid;border-width:13.75px 13.75px 0 13.75px;border-color:#776e65 transparent transparent transparent;left:114px;bottom:-27.5px}#botKey::after{display:block;content:'';position:absolute;width:0;height:0;border-style:solid;border-width:11px 11px 0 11px;border-color:#CBBA9D transparent transparent transparent;left:-11px;top:-12.65px}#botKey.click::after{border-color:#776e65 transparent transparent transparent}#pageMain{-webkit-box-sizing:border-box}#pageMain .gameModal{z-index:8;background:rgba(22,22,22,0.9)}#pageMain .gameModal .body{background:#CBBA9D;text-align:center;min-width:35%}#pageMain .gameModal .body .modalTitle{background:inherit;color:#776e65}#pageMain .gameModal .button{display:inline-block;min-width:35%;background:#776e65;color:#ffffff;margin:16px;margin-top:16px;border:3px solid #776e65}#pageMain .gameModal .button.focus{border:3px solid #ffffff}#pageMain #scores-container{float:left;text-align:right;height:112px;position:absolute;margin:auto;top:0;left:0;right:0;bottom:0;width:128px}#pageMain #score-container,#pageMain #best-container{position:relative;background:#B1A18C;padding:19.2px 24px;font-size:16px;height:48px;line-height:32px;font-weight:bold;border-radius:5px;color:white;margin-top:8px;text-align:center}#pageMain #score-container:after,#pageMain #best-container:after{position:absolute;width:100%;top:10px;left:0;text-transform:uppercase;font-size:12.8px;line-height:16px;text-align:center}#pageMain #score-container:after{content:"Score";color:#776e65}#pageMain #best-container:after{content:"Best";color:#776e65}@-webkit-keyframes fade-in{0%{opacity:0}100%{opacity:1}}@keyframes fade-in{0%{opacity:0}100%{opacity:1}}#pageMain .game-container{padding:8px;cursor:default;background:#97897C;border-radius:6px;width:260px;height:260px;box-sizing:border-box;float:left;position:absolute;margin:auto;top:0;left:0;right:0;bottom:0}#pageMain .grid-container{position:absolute;z-index:1}#pageMain .grid-row{margin-bottom:8px}#pageMain .grid-row:last-child{margin-bottom:0}#pageMain .grid-row:after{content:"";display:block;clear:both}#pageMain .grid-cell{width:55px;height:55px;margin-right:8px;float:left;border-radius:3px;background:rgba(238,228,218,0.35)}#pageMain .grid-cell:last-child{margin-right:0}#pageMain #tile-container{position:absolute;z-index:2}#pageMain .tile,#pageMain .tile .tile-inner{width:55px;height:55px;line-height:55px}#pageMain .tile.tile-position-1-1{-webkit-transform:translate(0px, 0)}#pageMain .tile.tile-position-1-2{-webkit-transform:translate(0px, 63px)}#pageMain .tile.tile-position-1-3{-webkit-transform:translate(0px, 126px)}#pageMain .tile.tile-position-1-4{-webkit-transform:translate(0px, 189px)}#pageMain .tile.tile-position-2-1{-webkit-transform:translate(63px, 0)}#pageMain .tile.tile-position-2-2{-webkit-transform:translate(63px, 63px)}#pageMain .tile.tile-position-2-3{-webkit-transform:translate(63px, 126px)}#pageMain .tile.tile-position-2-4{-webkit-transform:translate(63px, 189px)}#pageMain .tile.tile-position-3-1{-webkit-transform:translate(126px, 0)}#pageMain .tile.tile-position-3-2{-webkit-transform:translate(126px, 63px)}#pageMain .tile.tile-position-3-3{-webkit-transform:translate(126px, 126px)}#pageMain .tile.tile-position-3-4{-webkit-transform:translate(126px, 189px)}#pageMain .tile.tile-position-4-1{-webkit-transform:translate(189px, 0)}#pageMain .tile.tile-position-4-2{-webkit-transform:translate(189px, 63px)}#pageMain .tile.tile-position-4-3{-webkit-transform:translate(189px, 126px)}#pageMain .tile.tile-position-4-4{-webkit-transform:translate(189px, 189px)}#pageMain .tile{position:absolute}#pageMain .tile .tile-inner{border-radius:3px;background:#eee4da;text-align:center;font-weight:bold;z-index:10;font-size:30px}#pageMain .tile.tile-2 .tile-inner{background:#eee4da}#pageMain .tile.tile-4 .tile-inner{background:#ede0c8}#pageMain .tile.tile-8 .tile-inner{color:#f9f6f2;background:#f2b179}#pageMain .tile.tile-16 .tile-inner{color:#f9f6f2;background:#f59563}#pageMain .tile.tile-32 .tile-inner{color:#f9f6f2;background:#f67c5f}#pageMain .tile.tile-64 .tile-inner{color:#f9f6f2;background:#f65e3b}#pageMain .tile.tile-128 .tile-inner{color:#f9f6f2;background:#edcf72;font-size:24px}#pageMain .tile.tile-256 .tile-inner{color:#f9f6f2;background:#edcc61;box-shadow:0 0 30px 10px rgba(243,215,116,0.31746),inset 0 0 0 1px rgba(255,255,255,0.19048);font-size:24px}#pageMain .tile.tile-512 .tile-inner{color:#f9f6f2;background:#edc850;box-shadow:0 0 30px 10px rgba(243,215,116,0.39683),inset 0 0 0 1px rgba(255,255,255,0.2381);font-size:24px}#pageMain .tile.tile-1024 .tile-inner{color:#f9f6f2;background:#edc53f;box-shadow:0 0 30px 10px rgba(243,215,116,0.47619),inset 0 0 0 1px rgba(255,255,255,0.28571);font-size:19.5px}#pageMain .tile.tile-2048 .tile-inner{color:#f9f6f2;background:#edc22e;box-shadow:0 0 30px 10px rgba(243,215,116,0.55556),inset 0 0 0 1px rgba(255,255,255,0.33333);font-size:19.5px}#pageMain .tile.tile-super .tile-inner{color:#f9f6f2;background:#3c3a32;font-size:16.5px}@-webkit-keyframes appear{0%{opacity:0;-webkit-transform:scale(0);-moz-transform:scale(0);transform:scale(0)}100%{opacity:1;-webkit-transform:scale(1);-moz-transform:scale(1);transform:scale(1)}}@keyframes appear{0%{-webkit-transform:scale(0)}100%{-webkit-transform:scale(1)}}#pageMain .tile-new .tile-inner{-webkit-animation-fill-mode:backwards;animation-fill-mode:backwards}@-webkit-keyframes pop{0%{-webkit-transform:scale(0)}50%{-webkit-transform:scale(1.2)}100%{-webkit-transform:scale(1)}}#pageMain .tile-merged .tile-inner{z-index:20;-webkit-animation-fill-mode:backwards;animation-fill-mode:backwards} /*# sourceMappingURL=app.480.map */