/*
	Styles for www.earthlingpriorities.com
	Date: May 2014
	Version: 1.0
	Author: Daniele Giardini
*/

/*  INDEX ::::::
	Imports
	Defaults
	Main
	Alternate Layouts
*/

/* Imports */

@import url("reset.css");
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400italic,700italic,400,700);
@import url(http://fonts.googleapis.com/css?family=Press+Start+2P);


/* Defaults */

* {
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
}
html, body { height: 100%; }
body {
	min-width: 465px;
	font-family: 'Open Sans', sans-serif;
	font-size: 15px;
	color: #fff;
	background: #948870 url(../../_imgs/bg.png) repeat-x top;
}
strong { font-weight: bold; }
em { font-style: italic; color: #b9b9b9; }
p, dl, h2, h3, h4, h5 {
	line-height: 1.4;
	text-align: left;
}
p { margin-top: 10px; }
p:first-of-type { margin-top: 0; }
a { color: #22afd5; text-decoration: none; }
a:hover, a:hover span {
	color: #de7b0b;
	transition: none;
	-webkit-transition: none;
	-moz-transition: none;
	-o-transition: none;
}
a, a span {
	transition: none;
	-webkit-transition: none;
	-moz-transition: none;
	-o-transition: none;
}

.clear { clear: both; }

/* Main */

header h1, header p { display: none; }
header {
	width: 840px;
	min-height: 456px;
	margin: auto;
	background: url(../../_imgs/header.png) no-repeat;
}

#container {
	width: 870px;
	margin: auto;
	text-align: center;
}

h2 {
	position: relative;
	margin-top: -45px;
	padding: 30px 30px 16px;
	border-top: 60px solid #db3d19;
	font-family: 'Press Start 2P', cursive;
	font-size: 24px;
	color: #f9c02d;
	text-transform: uppercase;
	background-color: #ba3315;
	z-index: 0;
}
h3 {
	color: #f9c02d;
	margin-top: 10px;
	margin-bottom: 6px;
}

.bt {
	display: block;
	background: #22afd5;
	text-align: center;
	/*font-weight: bold;*/
	color: #ffffff;
	padding: 20px 12px 18px 12px;
	margin: 10px 10px 10px 0;
}
.bt-txtLogo { font-weight: bold; font-size: 130%; }
.bt-img { padding: 6px 10px; }
.bt-img-extra { padding: 12px 10px; }
a.bt:hover { background: #de7b0b; color: #ffffff; }
.bt:first-of-type { margin-top: 0; }
.bt:last-of-type { margin-bottom: 14px; }

#pageWrap { text-align: center; }

.content {
	position: relative;
	max-width: 840px;
	margin: auto;
	z-index: 1;
}
.text-content {
	max-width: 740px;
	padding: 26px 50px 30px;
	background-color: #45352f;
}
.download-content {
	display: block;
	float: left;
	text-align: left;
	padding-right: 10px;
	margin-bottom: -10px;
}
.download-right {
}
.download-right h3 { margin-top: 0; }

#synopsis div {
	padding: 26px 50px 30px;
	border-top: 10px solid #db3d19;
	background-color: #ba3315;
}

#credits dl { text-align: center; }
#credits dt {
	margin-top: 10px;
	font-size: 130%;
}
#credits dt:first-of-type { margin-top: 0; }

#wallpapers img {
	position: relative;
	z-index: 2;
}
.wallpaper { max-width: 420px; margin: auto; }
.wallpaper-bts {
	position: relative;
	margin-top: -10px;
	background: #ba3315;
	z-index: 0;
}
.wallpaper-bts a {
	display: inline-block;
	padding: 33px 10px 22px;
	color: #fff;
	background: #22afd5;
}
.wallpaper-bts a:hover { background: #de7b0b; }

#software {
	border-top: 1px dashed #22afd5;
	margin-top: 20px;
	margin-bottom: 20px;
	padding-top: 36px;
}
#software a { display:block; font-size: 150%; }
#software a span {
	display: block;
	margin-top: 20px;
	font-size: 60%;
}

.content { text-align: center; }
.bandcamp {
	width: 700px;
}

footer {
	position: relative;
	min-height: 80px;
	margin-top: -45px;
	padding: 30px 30px 16px;
	border-top: 60px solid #db3d19;
	background-color: #ba3315;
	z-index: 0;
}

/* Alternate Layouts */

@media only screen and (max-width: 900px),
only screen and (min-device-pixel-ratio:1.5) and (orientation:portrait),
only screen and (-webkit-min-device-pixel-ratio:1.5) and (orientation:portrait)
{

	#container { width: 435px; }
	header {
		width: 420px;
		min-height: 276px;
		background: url(../../_imgs/header_sml.png) no-repeat;
	}
	.content { max-width: 420px; }
	.text-content { max-width: 320px; }
	.download-content { margin-bottom: 10px;
}
	.bandcamp { width: 420px; }
}