﻿/*Stylesheet*/
BODY, HTML 
{
    -webkit-tap-highlight-color: rgba(0,0,0,0); 
    -webkit-touch-callout: none;                
    -webkit-text-size-adjust: none;             
    -webkit-user-select: none;                  
	margin: 			0;
	padding: 			0;
	font-family: 		Arial, Verdana, sans-serif;
	font-size: 			12px;
	font-weight:		normal;
	color: 				#ccc;
	background-color:	#4aa4c2;
	background-image: url(assets/art/tile.png);
}

canvas
{
    box-shadow: 0px 0px 20px #000000;
}
jss32 {
    margin: 0;
    box-sizing: border-box;
	}
	.jss51 {
    justify-content: space-around;
}
	.jss31 {
    width: 100%;
    display: flex;
    z-index: 1;
    flex-wrap: wrap;
    box-sizing: border-box;
	}
	.jss39 {
    align-items: center;
}
	.jss1 {
    color: #ffcd00;
	}
	.jss125 {
    text-shadow: 2px 2px 2px #00476c;
    font-weight: bold;
}
body{padding:0;margin:0;font-family:'Open Sans', sans-serif}
#game-container{z-index:0;position:absolute;left:0;right:0;top:0;bottom:28px;background-color:#5a7371;box-shadow:0px 5px 5px #888888}
#game-container.fullscreen{bottom:0}
.game-footer{/* z-index:0; */position:absolute;bottom:0;left:0;right:0;height:28px;}
.game-btn{background:3CC0DC;background:linear-gradient(to bottom,#259cd8 0%,#3CC0DC 100%);cursor:pointer;-webkit-border-radius:15px;-moz-border-radius:15px;border-radius:15px;text-shadow:1px 1px 3px #666666;color:#ffffff;font-size:20px;font-weight:bold;text-decoration:none;border:solid #d0e0ea 2px;text-transform:uppercase;padding:10px;display:block;margin:0 auto}
.game-btn:hover{background:#00a6e7;background-image:linear-gradient(to bottom, #00a6e7, #1a91cf);text-decoration:none}
.game-btn-link:hover{text-decoration:none}
.game-footer{-webkit-user-select:none;-moz-user-select:none;box-sizing:content-box}
.game-footer .game-footer-logo{height:28px;font-size:24px;line-height:28px;padding:0 10px;margin:0}
.game-footer .game-footer-logo a,
.game-footer .game-footer-logo a:hover,
.game-footer .game-footer-logo a:active{text-decoration:none;color:inherit}
.game-footer .game-footer-btn{color:white;height:28px;overflow-y:hidden;margin-left:5px;cursor:pointer;font-weight:bold;}
.game-footer .game-footer-btn.game-footer-logo{margin:0}
.game-footer .game-footer-btn:hover{background-color:#ffcd00;}
.game-footer .game-footer-btn a.game-footer-link{line-height:28px;height:28px;display:inline-block;}
.game-footer .game-footer-btn a.game-footer-link:link,
.game-footer .game-footer-btn a.game-footer-link:visited{color:inherit;text-decoration:none;}
.game-footer .game-footer-more{text-transform:uppercase;padding:0 15px;font-size:16px;background-color: #44BFA3;border: 2px solid #fff;}
.game-footer .game-footer-img-button{width:70px;overflow-x:hidden;height:28px;cursor:pointer}
.game-footer .game-footer-img-button div{height:28px;text-align:center}
.game-footer .game-footer-img-button div a{font-size:0;height:28px;width:70px;line-height:62px}
.gameloader{-webkit-user-select:none;-moz-user-select:none;overflow:hidden}
.gameloader .gameloader-game-name{font-size:20px;font-weight:bold;text-transform:uppercase;color:white;margin-left:auto;margin-right:auto;text-align:center;text-shadow:1px 1px 1px #00476c}
.gameloader .gameloader-logo{margin-left:auto;margin-right:auto;margin:8px 0 15px 0;width:300px}
.gameloader .gameloader-logo img{width:100%;border-radius:5px;box-shadow:0 2px 5px 0 rgba(0, 0, 0, 0.3)}
.gameloader .gameloader-progressbar{width:300px;height:1.2vh;border-radius:0.6vh;background-color:#fff;flex-grow:1;transition:0.2s ease-out all;}
.gameloader .gameloader-progressbar .gameloader-progressbar-progress{width:0;height:100%;border-radius:0.6vh;background-color:#3CF7DC;transition:0.2s ease-out all;animation-name:fillColor;animation-duration:3.5s;animation-iteration-count:infinite;animation-fill-mode:both;}
.gameloader .gameloader-progress-info{margin-left:auto;margin-right:auto;margin-top:6px;font-size:14px;color:#fff;text-align:center;text-shadow:1px 1px 1px #00476c}
.loader-hidden{display:none}
.loader-active{display:block}
a{text-decoration:none}
a:hover{text-decoration:none}
.ball-beat,.ball-beat > div{position:relative;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.ball-beat{display:block;font-size:0;color:#fff}.ball-beat > div{display:inline-block;float:none;background-color:currentColor;border:0 solid currentColor}.ball-beat{width:108px;height:36px}.ball-beat > div{width:20px;height:20px;margin:8px;border-radius:100%;-webkit-animation:ball-beat .7s -.15s infinite linear;-moz-animation:ball-beat .7s -.15s infinite linear;-o-animation:ball-beat .7s -.15s infinite linear;animation:ball-beat .7s -.15s infinite linear}.ball-beat > div:nth-child(2n-1){-webkit-animation-delay:-.5s;-moz-animation-delay:-.5s;-o-animation-delay:-.5s;animation-delay:-.5s}@-webkit-keyframes ball-beat{50%{opacity:.2;-webkit-transform:scale(.75);transform:scale(.75)}100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}@-moz-keyframes ball-beat{50%{opacity:.2;-moz-transform:scale(.75);transform:scale(.75)}100%{opacity:1;-moz-transform:scale(1);transform:scale(1)}}@-o-keyframes ball-beat{50%{opacity:.2;-o-transform:scale(.75);transform:scale(.75)}100%{opacity:1;-o-transform:scale(1);transform:scale(1)}}@keyframes ball-beat{50%{opacity:.2;-webkit-transform:scale(.75);-moz-transform:scale(.75);-o-transform:scale(.75);transform:scale(.75)}100%{opacity:1;-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1)}