/**
 * Author: Jordan Hemenway
 *
 * Based on Parallax Scrolling Tutorial
 * For NetTuts+ (definitely check this out if you're
 * interested in the crazy parallax effect):
 *
 * http://net.tutsplus.com/tutorials/html-css-techniques/simple-parallax-scrolling-technique/  
 *
 * Adapted from work by: Mohiuddin Parekh
 *	http://www.mohi.me
 * 	@mohiuddinparekh   
 */
 
@font-face {
    font-family: 'bebas_neueregular';
    src: url('../fonts/BebasNeue-webfont.eot');
    src: url('../fonts/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/BebasNeue-webfont.woff') format('woff'),
         url('../fonts/BebasNeue-webfont.ttf') format('truetype'),
         url('../fonts/BebasNeue-webfont.svg#bebas_neueregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'quicksand-regular';
    src: url('../fonts/quicksand-regular-webfont.eot');
    src: url('../fonts/quicksand-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/quicksand-regular-webfont.woff') format('woff'),
         url('../fonts/quicksand-regular-webfont.ttf') format('truetype'),
         url('../fonts/quicksand-regular-webfont.svg#quicksand-regular') format('svg');
    font-weight: normal;
    font-style: normal;
}

body{
	margin:0;
	padding:0;
	background-color: #000000;
}

.like_box
{
	position: absolute;
	left: 15px;
	top: 10px;
	z-index: 10000;
}

.sub_like_box
{
	position: fixed;
	left: 15px;
	top: 45px;
	z-index: 10000;
}

#home { 
	background: url(../images/home.jpg) 50% 0 no-repeat fixed; 
	height: 800px;  
	margin: 0 auto; 
    width: 100%; 
    max-width: 1920px; 
    position: relative; 
    box-shadow: 0 0 50px rgba(0,0,0,0.8);
}
#preorder { 
	background: url(../images/hexpreorder.png) 50% 0 no-repeat fixed;
	background-color: #000000;
	height: 525px;
	margin: 0 auto;
    width: 100%; 
    max-width: 1920px; 
    position: relative; 
    box-shadow: 0 0 50px rgba(0,0,0,0.8);
}
#about { 
	background: url(../images/about.jpg) 50% 0 no-repeat fixed; 
	height: 800px;
	margin: 0 auto; 
    width: 100%; 
    max-width: 1920px; 
    position: relative; 
    box-shadow: 0 0 50px rgba(0,0,0,0.8);
	background-position:right bottom; 
}

@media only screen and (max-width: 1024px) {
.like_box{display:none;}
.sub_like_box{display:none;}
.otherlinks{display:none;}
#home { 
	background: url(../images/home.jpg) repeat fixed 50% top !important;
	min-width: 1920px;
	min-height:768px;
}
#preorder { 
	background: url(../images/hexpreorder.png) repeat fixed 50% top !important;
	min-width: 1920px;
	min-height:525px;
}
#about { 
	background: url(../images/about.jpg) repeat fixed 50% top !important;
	min-width: 1920px;
	min-height:768px;
}
}

/* Introduction */

#home article
{
	background: url("../images/intro.png") no-repeat scroll center top transparent;
	position: absolute;
	text-indent: -9999px;
	top: 0px;
	width: 100%;
}

.humblewidgets
{
	position: absolute;
	left: 50%;
	top: 150px;
	margin-left: -550px;
	width: 1150px;
}

.subtitletext
{	
	padding-top:2px;
	padding-bottom:2px;
	padding-right:10px;
	padding-left:10px;
	
	background-image: url("../images/trans.png");
	background-repeat: repeat;
	
	position: absolute;
	left: 50%;
	top: 265px;
	margin-left: -380px;
	
	font-family: "bebas_neueregular", Arial, Helvetica, sans-serif;
    font-size: 32px;
    font-weight: normal;
    line-height: normal;
    text-transform: uppercase;
    letter-spacing: 1px;
	color: #FFFFFF;
}

#preordertext
{	
	position: absolute;
	left: 50%;
	top: 40px;
	margin-left: -330px;
}

#preordersubtext
{	
	position: absolute;
	left: 50%;
	top: 90px;
	margin-left: -523px;
	width: 1024px;
}

#sectioncontent
{	
	margin: 0px auto;
	width: 1150px;
	margin-bottom:0px;
	position:relative;	
}

#aboutleft
{	
	position:absolute;
	margin: 0px auto;
	width: 550px;
	float: left;
	top: 50px;
}

#aboutright
{	
	position:absolute;	
	margin: 0px auto;
	width: 550px;
	top: 50px;
	right: 0;
	float: left;
}

.smicon
{
	padding-left:5px;
	padding-right:5px;
}

.titletext
{	
	padding-top:2px;
	padding-bottom:2px;
	padding-right:10px;
	padding-left:10px;
	
	background-image: url("../images/trans.png");
	background-repeat: repeat;
	
	font-family: "bebas_neueregular", Arial, Helvetica, sans-serif;
    font-size: 35px;
    font-weight: normal;
    line-height: normal;
    text-transform: uppercase;
    letter-spacing: 1px;
	
	color: #FFFFFF;
}

.subtext
{	
	padding-top:10px;
	padding-bottom:10px;
	padding-right:10px;
	padding-left:15px;
	
	background-image: url("../images/trans.png");
	background-repeat: repeat;
	
	font-family: 'Gudea', sans-serif;
    font-size: 15px;
    font-weight: normal;
    line-height: 125%;
	//text-transform: uppercase;
    letter-spacing: 1px;
	
	color: #BBBBBB;
}

.subtextEmail
{	
	padding-top:10px;
	padding-bottom:10px;
	padding-right:10px;
	padding-left:10px;
	width: 210px;

	background-image: url("../images/trans.png");
	background-repeat: repeat;
	
	font-family: 'Gudea', sans-serif;
    font-size: 10px;
    font-weight: normal;
    line-height: 110%;
    letter-spacing: 1px;
	
	color: #BBB;
}

.highlight
{
	color: #CC5C43;
}

.subtextQuicksand
{	
	padding-top:10px;
	padding-bottom:10px;
	padding-right:10px;
	padding-left:10px;
	
	background-image: url("../images/trans.png");
	background-repeat: repeat;
	
	font-family: "quicksand-regular", Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-weight: normal;
    line-height: normal;
	//text-transform: uppercase;
    letter-spacing: 1px;
	text-align: center;
	
	color: #EEEEEE;
}

.infotext
{	
	padding-top:2px;
	padding-bottom:2px;
	padding-right:10px;
	padding-left:10px;
	
	background-image: url("../images/trans.png");
	background-repeat: repeat;
	
	position: absolute;
	left: 0;
	top: 450px;
	margin-left: 283px;
	width: 500px;
	
	font-family: "bebas_neueregular", Arial, Helvetica, sans-serif;
    font-size: 24px;
    font-weight: normal;
    line-height: normal;
    text-transform: uppercase;
    letter-spacing: 1px;
	color: #FFFFFF;
}

.smallimage
{
	background-image: url("../images/trans.png");
	background-repeat: repeat;

	float: left;
	text-align: center;
	margin: 3px;
	padding: 3px;
}

#arrow
{	
	position: absolute;
	left: 50%;
	top: 0px;
	margin-left: -25px;
}

#refractlogo
{	
	position: absolute;
	left: 50px;
	bottom: 10px;
}

.otherlinks
{
	position:absolute;
	right: 15px;
    top: 20px;
	z-index: 10000;
	
	padding-top:2px;
	padding-bottom:2px;
	padding-right:10px;
	padding-left:10px;
	
	background-image: url("../images/trans.png");
	background-repeat: repeat;
	
	font-family: "quicksand-regular", Arial, Helvetica, sans-serif;
    font-size: 13px;
    font-weight: normal;
    line-height: normal;
	//text-transform: uppercase;
    letter-spacing: 1px;
	
	color: #444;
}

#youtube
{	
	padding-top:7px;
	padding-bottom:7px;
	padding-right:7px;
	padding-left:7px;
	
	background-image: url("../images/trans.png");
	background-repeat: repeat;
	
	position: absolute;
	left: 50%;
	top: 360px;
	margin-left: -313px;
}

#about article
{
	//background: url("../images/parallax.png") no-repeat scroll center top transparent;
	position: absolute;
	text-indent: -9999px;
	top: 291px;
	width: 100%;
}