/*! normalize.css v1.0.0 | MIT License | git.io/normalize */
article,aside,details,figcaption,figure,footer,header,hgroup,nav,section,summary{display:block}audio,canvas,video{display:inline-block;*display:inline;*zoom:1}audio:not([controls]){display:none;height:0}[hidden]{display:none}html{font-size:100%;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}html,button,input,select,textarea{font-family:sans-serif}body{margin:0}a:focus{outline:thin dotted}a:active,a:hover{outline:0}h1{font-size:2em;margin:.67em 0}h2{font-size:1.5em;margin:.83em 0}h3{font-size:1.17em;margin:1em 0}h4{font-size:1em;margin:1.33em 0}h5{font-size:.83em;margin:1.67em 0}h6{font-size:.75em;margin:2.33em 0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:bold}blockquote{margin:1em 40px}dfn{font-style:italic}mark{background:#ff0;color:#000}p,pre{margin:1em 0}code,kbd,pre,samp{font-family:monospace,serif;_font-family:'courier new',monospace;font-size:1em}pre{white-space:pre;white-space:pre-wrap;word-wrap:break-word}q{quotes:none}q:before,q:after{content:'';content:none}small{font-size:75%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-0.5em}sub{bottom:-0.25em}dl,menu,ol,ul{margin:1em 0}dd{margin:0 0 0 40px}menu,ol,ul{padding:0 0 0 40px}nav ul,nav ol{list-style:none;list-style-image:none}img{border:0;-ms-interpolation-mode:bicubic}svg:not(:root){overflow:hidden}figure{margin:0}form{margin:0}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0;white-space:normal;*margin-left:-7px}button,input,select,textarea{font-size:100%;margin:0;vertical-align:baseline;*vertical-align:middle}button,input{line-height:normal}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer;*overflow:visible}button[disabled],input[disabled]{cursor:default}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;*height:13px;*width:13px}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}textarea{overflow:auto;vertical-align:top}table{border-collapse:collapse;border-spacing:0}

.cf:before,
.cf:after {
    content: " ";
    display: table;
}

.cf:after {
    clear: both;
}

.cf {
    *zoom: 1;
}
html,body {
	background-color: #000;
	color: #373737;
	font-family: 'Play', sans-serif;
	margin: 0;
	padding: 0;
	font-size: 1em;

}
body.mobile {


}
.strokeB {
  text-shadow: 1px 1px 0 #373737, 1px -1px 0 #373737, 0 1px 0 #373737, 1px 0 0 #373737, -1px 1px 0 #373737, -1px -1px 0 #373737, 0 -1px 0 #373737, 0 1px 0 #373737, -1px 0 0 #373737;
}
.logo {
	position: absolute;
	left: 50%;
	margin-left:-460px;
	top:46px;
}
.social {
	float: right;
}
.social li {
  float: left;
  list-style: none;
  margin-right: 5px;
  cursor: pointer;
  line-height: 15px;
}
h1 {
  color: #FDCF00;
  font-size: 2em;
  margin: 0;
  text-transform: capitalize;
  position: relative;
  z-index: 100;
  width:480px;
  margin:10px auto;
}
.banner {
	position: absolute;
	width:160px;
	height: 600px;
	background: #fff;
	padding: 3px;
	border-radius: 5px;
}
.home-button {
    color: #666;
  background: #fff;
  margin: -3px -10px 0 0;
  border: 1px solid #fff;
  border-radius: 5px 5px 0 0;
  float: right;
  padding: 5px;
}
.banner.left{
	left:50%;
	top: 247px;
	margin-left:-432px;
}
.banner.right{
	left: 50%;
  	top: 58px;
  	margin-left: 268px;
}
.pc #canvasContainer{
	height: 720px!important;
	width: inherit;
}
.pc .main{
	/*border: 10px solid #fff;*/
	background: #fff;
	border-radius: 5px;
	width: 480px;
	margin:0 auto;
	-webkit-box-shadow: 0 15px 8px -5px #9B9B9B;
	-moz-box-shadow: 0 15px 8px -5px #9B9B9B;
	box-shadow: 0 15px 8px -5px #9B9B9B;
	border: 10px solid #fff;
	border-radius: 10px 0 10px 10px;
	box-shadow: 6px 6px 0 rgba(0, 0, 0, 0.25);
}
.mobile #canvasContainer{
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;			
	width:auto;
	height: 100%;
}
.mobile canvas {
	position: absolute;
  	left: 0;
  	right: 0;
  	top: 0;
  	bottom: 0;
  	margin: auto;
  -ms-touch-action: none;
}
.instructions {
	float: left;
}
.instructions span {
	font-size: 20px;
}
.tab-game {
  margin: -35px auto 0 auto;
  height: 36px;
  position: relative;
  z-index: 2000;
}

.mobileLandscape {
	background: url('../media/rotationScreen.png') no-repeat center center #000!important;
	width: 100%;
	height: 100%;
	background-size: 80%!important;
}
.mobileLandscape #canvas {
	display: none;
}

/* @media screen and (orientation:landscape) {
	body {
		background: url('../humpty-rotation.png') no-repeat center center #000!important;
	}
    #canvasContainer, #canvas {
    	display: none;
    }
} */