@charset "UTF-8";
@import url(_Reset.css);
@import url(_Keyframes.css);

/* @kinslowdian simonkinslow.com */


/* Generated by Font Squirrel (http://www.fontsquirrel.com) on March 4, 2013 03:30:15 AM America/New_York */

@font-face 
{
    font-family: 'SigmarRegular';
    src: url('../_font/_S/SigmarOne-webfont.eot');
    src: url('../_font/_S/SigmarOne-webfont.eot?#iefix') format('embedded-opentype'),
         url('../_font/_S/SigmarOne-webfont.woff') format('woff'),
         url('../_font/_S/SigmarOne-webfont.ttf') format('truetype'),
         url('../_font/_S/SigmarOne-webfont.svg#SigmarRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

a:link, a:visited, a:hover
{
	text-decoration: none;
	outline: none;
	border: none;
	
	color: rgb(60, 60, 60); 
}


html, body
{
	height: 100%;
	width: 100%;
	padding: 0;
	margin: 0;
	
	overflow: hidden;
}

:root
{
	background: url(../_img/top_x1.png) repeat-x center top, #3cbcfd;
}


#wrapper
{
	position: relative;
	margin: 0 auto;
	padding: 0;
	
	width: 320px;
	height: 100%;
}

#content
{
	width:320px;
	
	height: 530px;
	
	position: absolute;
	
	left: 0; right: 0; top: 0; bottom: 0;
	
	margin: auto;
}


#super_mario_brothers
{
	width: 320px;
	
	margin: 20px 0 0 0;
	
	position: relative;
	
	z-index: 1;
}

.tween_super_mario_brothers
{
	-webkit-animation: tweenSuperMarioBrothersFrames 2s ease-in-out infinite;
	animation: tweenSuperMarioBrothersFrames 2s ease-in-out inherit;
}

@-webkit-keyframes tweenSuperMarioBrothersFrames
{
	0%		{ -webkit-transform: translateY(0px); }
	50%		{ -webkit-transform: translateY(-20px);}
	100%	{ -webkit-transform: translateY(0px);}
}

@keyframes tweenSuperMarioBrothersFrames
{
	0%		{ transform: translateY(0px); }
	50%		{ transform: translateY(-20px);}
	100%	{ transform: translateY(0px);}
}

@media only screen and (min-device-width : 320px) and (max-device-width : 480px) 
{
	#content
	{
		margin: 0 auto;
	}
	
	@-webkit-keyframes tweenSuperMarioBrothersFrames
	{
		0%		{ -webkit-transform: translateY(0px); }
		50%		{ -webkit-transform: translateY(-10px);}
		100%	{ -webkit-transform: translateY(0px);}
	}
	
	@keyframes tweenSuperMarioBrothersFrames
	{
		0%		{ transform: translateY(0px); }
		50%		{ transform: translateY(-10px);}
		100%	{ transform: translateY(0px);}
	}
}

.pixel
{
    width:20px;
    height:20px;
    
    position: relative;
    
    display:block;
    
    overflow: hidden;
    
    float:left;
    
    -webkit-perspective: 1000;
    -webkit-backface-visibility: hidden;
    
    -moz-perspective: 1000;
    -moz-backface-visibility: hidden;
    
    -ms-perspective: 1000;
    -ms-backface-visibility: hidden;
    
    -o-perspective: 1000;
    -o-backface-visibility: hidden;
    
    perspective : 1000;
    backface-visibility: hidden;
    
    -webkit-touch-callout: none;
    
    -ms-touch-action: none;
    
    touch-callout: none;
}

.pixel img
{
    position: absolute;
    
    left: 0;
    top: 0;
    
    background: #fff;
    
    pointer-events: none;
}

.pixel .pixelDisplay
{
    width:20px;
    height:20px;
    
    -webkit-transform	: translateY(20px);
    -moz-transform 		: translateY(20px);
    -ms-transform 		: translateY(20px);
    -o-transform 		: translateY(20px);
    transform			: translateY(20px);	
    
    position: absolute;
    
    left: 0;
    top: 0;
    
    pointer-events: none;
}

.R
{
	background: #d1231a;
}

.S
{
	background: #eebf8b;
}

.B
{
	background: #824226;
}

.D
{
	background: #141414;
}

.T
{
	background: #474ed0;
}

.Y
{
	background: #ffed1f;	
}

.NEW
{
	clear:left;   
}

#cta
{
	width: 320px;
	
	position: absolute;
	
	z-index: 0;
	
	-webkit-transform	: translateY(120px);
	-moz-transform		: translateY(120px);
	-ms-transform		: translateY(120px);
	-o-transform		: translateY(120px);
	transform			: translateY(120px);	
}

#cta_sprite
{
	width: 78px;
	height: 41px;
	
	margin: 0 auto;
	
	position: relative;
	
	background: url(../_img/press.png) no-repeat left bottom;
}

#details
{
	width: 320px;
	
	position: relative;
	
	-webkit-transform	: translateY(20px);
	-moz-transform		: translateY(20px);
	-ms-transform		: translateY(20px);
	-o-transform		: translateY(20px);
	transform			: translateY(20px);

	font-family: 'SigmarRegular';
	font-weight: normal;
	font-style: normal;
	
	text-shadow: 0 1px 1px rgba(255, 255, 255, 0.4);
	text-align: center;
	
	color: rgb(60, 60, 60);
}

#details h1 
{
	font-size: 1.6em;
	
	margin: 0 0 20px 0;
}

#details h2 
{
	font-size: 1em;
	
	margin: 0 0 10px 0;
}

#details p
{
	font-size: 0.6em;
}

#social
{
	width: 320px;
	
	margin: 60px 0 0 0;
	
	padding-bottom: 60px;
} 


#famicoms
{
	width: 100px;
	
	margin: 0 auto;
}

.famicom_social
{
	width: 24px;
	height: 40px;
	
	border: 0;
	outline: 0;
	
	float: left;
	
	cursor: pointer;
	
	pointer-events: all;
}

.famicom_speech
{
	width: 24px;
	height: 20px;
	
	background: url(../_img/socialSprite_x1.png) no-repeat;
}

.famicom_disk
{
	width: 24px;
	height: 20px;
	
	background: url(../_img/socialSprite_x1.png) no-repeat left top;
}

#famicom_t
{
	margin-right: 14px;
}

#famicom_t .famicom_speech
{
	background-position: -68px 0px;
}


#famicom_f
{
	margin-right: 14px;
}

#famicom_f .famicom_speech
{
	background-position: -46px 0px;
}

#famicom_r
{

}

#famicom_r .famicom_speech
{
	background-position: -24px 0px;
}

.famicom_type_A
{
	-webkit-animation	: famicom_type_A_FRAMES 0.4s ease infinite;
	-moz-animation		: famicom_type_A_FRAMES 0.4s ease infinite;
	-ms-animation		: famicom_type_A_FRAMES 0.4s ease infinite;
	-o-animation		: famicom_type_A_FRAMES 0.4s ease infinite;
	animation			: famicom_type_A_FRAMES 0.4s ease infinite;
}

.famicom_type_B
{
	-webkit-animation	: famicom_type_B_FRAMES 0.4s ease infinite;
	-moz-animation  	: famicom_type_B_FRAMES 0.4s ease infinite;
	-ms-animation		: famicom_type_B_FRAMES 0.4s ease infinite;
	-o-animation		: famicom_type_B_FRAMES 0.4s ease infinite;
	animation			: famicom_type_B_FRAMES 0.4s ease infinite;
}

/* pixel retina */

@media all and (-webkit-min-device-pixel-ratio: 2), all and (min-device-pixel-ratio: 2)
{
	:root
	{
		background: url(../_img/top_x2.png) repeat-x center top, #3cbcfd;
		background-size: 320px 140px;
	}

	.famicom_speech
	{
		background: url(../_img/socialSprite_x2.png) no-repeat;
		background-size: 92px 20px;
	}
	
	.famicom_disk
	{
		background: url(../_img/socialSprite_x2.png) no-repeat left top;
		background-size: 92px 20px;
	}
	
	#cta_sprite
	{
		background-position: right top;
		background-size: 117px 41px;
	}
}