@font-face {
    font-family: "Muli";
    src: url("./fonts/muli.woff") format('woff');
}

@media screen and (min-width: 1024px) {
	html	{
		height: 100%;
		margin: 0;
		padding: 0;
		height: 100%;
	}
	img	{
		border:0;
	}
	body	{
		height: 100%;
		margin: 0;
		padding: 0;
		color: #333;
		font-family: 'Muli', sans-serif;
	}
	#hero	{
		position: relative;
		margin: 0;
		padding: 0;
		background: url(../images/pyawbgbw.jpg) no-repeat;
		height: 100%;
		color: #fff;
		z-index: 1;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-ms-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
		-webkit-transition: none !important;
		-moz-transition: none !important;
		-ms-transition: none !important;
		-o-transition: none !important;
		transition: none !important;
	}
	#gyro	{
		position: relative;
		margin: 0;
		padding: 0;
		background: url(../images/pyawbg.jpg) no-repeat;
		height: 85%;
		color: #fff;
		z-index: 1;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-ms-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
		-webkit-transition: none !important;
		-moz-transition: none !important;
		-ms-transition: none !important;
		-o-transition: none !important;
		transition: none !important;
	}
	#logo	{
		position: absolute;
		top: 50px;
		left: 50px;
	}

	#mainheader	{
		position: absolute;
		top:50%;
		width: 100%;
		text-align: center;
		z-index: 5;
	}
	#mainheader h1	{
		margin: 0;
		padding: 0;
		color: #fff;
		font-size: 6em;
		letter-spacing: -.05em;
		text-shadow: 0px 0px 7px rgba(0, 0, 0, .7);
	}
	h2	{
		width: 100%;
		text-align: center;
		margin: 0;
		padding-top: .25em;
		font-size: 4em;
		text-shadow: 0px 0px 7px rgba(0, 0, 0, .7);
	}

	hr {
		padding: 0;
		width: 50%;
		border: none;
		border-top: thin solid #666;
		color: #999;
		text-align: center;
	}
	hr:after {
		content: url("http://www.positiveyaw.com/images/positiveYawhr.png");
		background: #fff;
		margin: 0 25px;
		display: inline-block;
		position: relative;
		top: -0.5em;
		font-size: 2.3em;
		padding: 0 0.25em;
	}

	#curves, #safety	{
	margin-top: 3em;
	width: 100%;
	height: 30em;
	background: #fff;
	color: #333;
	z-index: 1;
	}

	#curves p, #safety p	{
		position: absolute;
		font-size: 1em;
		text-align: justify;
		line-height: 2em;
		width: 30%;
		right: 50%;
	}

	#data, #signup	{
		margin-top: 3em;
		width: 100%;
		height: 30em;
		background: #fff;
		color: #333;
		z-index: 1;
	}
	#data p, #signup p	{
		position: absolute;
		font-size: 1em;
		line-height: 2em;
		text-align: justify;
		width: 30%;
		left: 50%;
	}

	.attribution	{
		float: right;
	}

	#emailsignup	{
		margin-top: 3em;
		margin-bottom: 3em;
		text-align: center;
		width: 50%;
		margin-left: 25%;
	}

	.noborder	{
		border: none;
	}

	a:link{color:#4282d3;text-decoration:underline}
	a:active{color:#33f;text-decoration:underline}
	a:visited{color:#333;text-decoration:underline}
	a:hover{color:#00a67c;text-decoration:none}

	#footer	{
		height: 1.5em;
		width: 100%;
		background: #333;
		color: #fff;
		text-align: right;

	}
  #footer a:visited {
    color: #4282d3;
    text-decoration:underline;
  }


/*.likebox{background:url("images/facebook32.png") no-repeat scroll left center transparent!important;display:block;float:right;height:32px;padding:0 5px 0 33px;width:233px;z-index:98;position:fixed;right:-240px;top:20%}.likebox div{border:0;position:relative;display:block}.likebox span{bottom:12px;font:8px "lucida grande",tahoma,verdana,arial,sans-serif;position:absolute;right:6px;text-align:right;z-index:99999}.likebox span a{color:#808080;text-decoration:none}.likebox span a:hover{text-decoration:underline}
*/
}

@media screen and (max-width: 1024px) {
	html	{
		margin: 0;
		padding: 0;
		height: 100%;
	}
	img	{
		border:0;
	}
	body	{
		height: 100%;
		margin: 0;
		padding: 0;
		color: #333;
		font-family: 'Muli', sans-serif;
		font-size: 100%;
	}
	#hero	{
		position: relative;
		margin: 0;
		padding: 0;
		background: url(../images/pyawbgbw.jpg) no-repeat;
		height: 100%;
		color: #fff;
		z-index: 1;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-ms-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
		-webkit-transition: none !important;
		-moz-transition: none !important;
		-ms-transition: none !important;
		-o-transition: none !important;
		transition: none !important;
	}
	#gyro	{
		position: relative;
		margin: 0;
		padding: 0;
		background: url(../images/pyawbg.jpg) no-repeat;
		height: 50%;
		color: #fff;
		z-index: 1;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-ms-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
		-webkit-transition: none !important;
		-moz-transition: none !important;
		-ms-transition: none !important;
		-o-transition: none !important;
		transition: none !important;
	}
	#logo	{
		position: absolute;
		top: 50px;
		margin: auto;
		padding-left: 1em;
		padding-right: 1em;
	}
	#mainheader	{
		position: absolute;
		top:50%;
		width: 100%;
		text-align: center;
		z-index: 5;
	}
	#mainheader h1	{
		font-size: 3rem;
		margin: 0;
		padding: 0;
		color: #fff;
		letter-spacing: -.05em;
		text-shadow: 0px 0px 7px rgba(0, 0, 0, .7);
	}
	#curves	{
		margin-top: 5rem;
	}
	h2	{
		font-size: 2.2rem;
		text-align: center;
	}
	hr	{
		display: none;
	}
	#curves p	{
		margin: 2rem;
		text-align: justify;
		font-size: 1.6rem;
	}
	#safety	{
		margin-top: 5rem;
	}
	#safety p	{
		margin: 2rem;
		text-align: justify;
		font-size: 1.6rem;
	}
	#data	{
		margin-top: 5rem;
	}
	#data p	{
		margin: 2rem;
		text-align: justify;
		font-size: 1.6rem;
	}
	#signup	{
		margin-top: 5rem;
	}
	#signup p	{
		margin: 2rem;
		text-align: justify;
		font-size: 1.6rem;
	}
	#emailsignup	{
		margin: 2rem;
		text-align: justify;
		font-size: 1.6rem;
	}
	.noborder	{
		border: none;
	}
	a:link{
		color:#4282d3;
		text-decoration:underline;
	}
	a:active{
		color:#33f;
		text-decoration:underline;
	}
	a:visited{
		color:#333;
		text-decoration:underline;
	}
	a:hover{
		color:#00a67c;
		text-decoration:none;
	}
	#footer	{
		font-size: 1rem;
	}
  #footer a:visited{
    color: #4282d3;
    text-decoration:underline;
  }
}