@font-face {
	font-family: Survived;
	src: url(Font.ttf);
}
html,body,#gameContainer,canvas {
	width:100%;
	margin: 0;
	padding: 0;
	overflow:hidden;
}
html,body
{
	height: 100%;
}
body
{
	background-image:url('bg.png');
	background-size:cover;
	color:#fff;
	font-family:verdana;
	font-size: 13px;
}
a{
	color:#fff;
	font-family:Verdana;
}
#gameContainer{
	display:none;
}
#bananawrap
{
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
	display: none;
}
#banana
{
	z-index:9999999999;
}
#beta{
	display:none;
	height:20px;
	background-color:#f3ff8a;
	text-align:center;
	color:#000;
	font-family:arial;
	font-size:12px;
	line-height:20px;
}
#beta a{
	color: #ff6565;
	color:blue;
	font-weight: bold;
}
#bottom{
	display: block;
	color: #000;
	height: 34px;
	background-color: #1875ff;
	color: #fff;
	font-family: Survived;
	font-family: verdana;
	font-size: 20px;
	position: absolute;
	bottom: 0;
	width: 100%;
	line-height: 31px;
	vertical-align: middle;
}
#bottom-left
{
	float:left;
	padding-left:5px;
}
#bottom-left b
{
	float: left;
	padding-left: 10px;
}
#bottom-left a
{
}
#bottom-right
{
	float:right;
}
#fullscreen
{
	height:28px;
	padding:0 10px;
	padding-top:6px;
	//background-color:#000;
	//background-color: #ff4c4c;
	display:none;
}
#fullscreen:hover
{
	background-color: #000;
}
#closebar
{
	display:none;
	height:30px;
	padding:2px 10px 2px 13px;
	font-family:Survived;
	font-size:36px;
	text-decoration:none;
}
#closebar:hover
{
	background-color: #000;
}
#gameContainer
{
	height:100%;
	//height:calc(100% - 34px);
}
canvas
{
	height:100%;
}
#newsletter
{
	display:none;
}
#newsletterwrap
{
	display:none;
	position:relative;
	background-color: #0000009c;
	position: absolute;
	right: -3px;
	bottom: 200px;
	max-width: 200px;
	color: #fff;
	font-family: verdana;
	font-size: 14px;
	text-align: center;
	padding:10px;
	padding-top:23px;
}
#newslettertext
{
	width:175px;
	margin:0 auto;
	margin-bottom:10px;
}
#newsletterclose
{
	position:absolute;
	right:0;
	top:0;
	width:24px;
	height:20px;
	background-color:#fdff94;
	color:#000;
}
#newsletterclose:hover
{
	cursor:pointer;
}
#newsletterinput
{
	border:0;
	height:20px;
	padding-left:10px;
	width:115px;
}
#newsletterbtn
{
	background-color: #dc0000;
	color: #fff;
	border: 0;
	height: 22px;
	font-weight: bold;
	font-size: 13px;
}
#newsletterbtn:hover
{
	cursor:pointer;
}
.log-date{
	color: #fff87a;
	font-size: 13px;
	font-weight:bold;
}
.log{
	padding-bottom:5px;
}
#wrap
{
	width: 800px;
	/* margin:0 auto; */
	margin-top: -169px;
	height: 306px;
	position:  absolute;
	top: 50%;
	margin-left: -400px;
	left: 50%;
}
#leftwrap
{
	width:25%;
	float:left;
	display: none;
}
#left
{
	margin:10px;
	/* background-color:#00000075; */
	padding:10px;
}
#middlewrap
{
	width: 66%;
	float:left;
}
#middle
{
	margin: 10px;
	margin-right: 5px;
	background-color: rgba(0, 0, 0, 0.5);
	text-align: center;
	padding: 40px 60px;
	/* border-radius: 5px; */
}
#rightwrap
{
	width: 33%;
	float:left;
}
#right
{
	margin:10px;
	margin-left: 5px;
	background-color: rgba(0, 0, 0, 0.5);
	max-height: 177px;
	overflow:auto;
	padding:20px;
	/* border-radius: 5px; */
}
h1
{
	font-family: Survived;
	padding:0;
	margin: 0;
	margin-bottom: 20px;
	font-weight: normal;
	color: #fff654;
	font-size: 88px;
}
h2
{
	margin: 0;
	margin-top: 0px;
	margin-bottom: 8px;
	font-family:Survived;
	font-weight:normal;
	color: #ffffff;
}
#pitch
{
	font-family:Survived;
	font-size: 20px;
}
#controls
{
	text-align:left;
	display:none;
}
.control
{
	padding-bottom:6px;
}
#playbtn
{
	width: 78%;
	background-color: rgba(0, 0, 0, 0.75);
	height: 50px;
	line-height: 50px;
	color: #fff;
	font-family: Survived;
	padding: 0;
	border: 0;
	font-size: 25px;
	margin-top: 37px;
}
#playbtn:hover
{
	background-color:#d41111;
	cursor:pointer;
}

@media only screen and (max-width: 1000px) {
	#leftwrap
	{
		display:block;
	}
	#wrap
	{
		width:800px;
		margin-left: -400px;
	}
	#middlewrap{
		width:50%;
	}
	#rightwrap
	{
		width:25%;
	}
	#playbtn
	{
		width: 90%;
	}
	h1
	{
		//font-size:75px
	}
}

a#social {
    background-color: rgba(37, 74, 206, 0.72);
    margin: 10px;
    margin-top: 0;
    margin-left: 5px;
    padding: 10px;
    display:  inline-block;
    /* line-height: 20px; */
    vertical-align: middle;
    padding-bottom: 8px;
}

#social
{
	text-decoration:none;
}

#social:hover
{
	background-color: rgb(37, 74, 206);
}

#social img{
	vertical-align:middle;
	padding-right:3px;
}
#addictlogo img
{
	margin:10px;
}