Added Presskit

css/index.css

@@ -574,3 +574,7 @@ body
 	clear: both;
 }
 
+.center
+{
+	text-align: center;
+}

index.html

@@ -14,12 +14,12 @@
 
   <meta http-equiv="Content-type" content="text/html;charset=UTF-8"/>
   <meta name="generator" content="2014.2.0.284"/>
-  <link rel="shortcut icon" href="images/space-game-favicon.ico?352280701"/>
   <title>Space Game: The Eternal Journal</title>
   <link media="only screen and (max-device-width: 370px)" rel="alternate" href="http://www.thepaperpilot.org/phone/index.html"/>
   <!-- CSS -->
   <link rel="stylesheet" type="text/css" href="css/site_global.css?365011649"/>
   <link rel="stylesheet" type="text/css" href="css/index.css?3790693796" id="pagesheet"/>
+  <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
   <!-- Other scripts -->
   <script type="text/javascript">
    document.documentElement.className += ' js';
@@ -39,22 +39,22 @@
          <div class="popup_anchor" id="u122popup">
           <div class="SlideShowContentPanel rgba-background clearfix" id="u122"><!-- stack box -->
            <div class="SSSlide clip_frame grpelem" id="u127"><!-- image -->
-            <img class="block ImageInclude" id="u127_img" data-src="images/snap1.jpg" src="images/blank.gif" alt="" data-width="480" data-height="270"/>
+            <img class="block ImageInclude" id="u127_img" data-src="images/snap1.png" src="images/blank.gif" alt="" data-width="1920" data-height="1080"/>
            </div>
            <div class="SSSlide invi clip_frame grpelem" id="u216"><!-- image -->
-            <img class="block ImageInclude" id="u216_img" data-src="images/snap2.jpg" src="images/blank.gif" alt="" data-width="480" data-height="270"/>
+            <img class="block ImageInclude" id="u216_img" data-src="images/snap2.png" src="images/blank.gif" alt="" data-width="1920" data-height="1080"/>
            </div>
            <div class="SSSlide invi clip_frame grpelem" id="u225"><!-- image -->
-            <img class="block ImageInclude" id="u225_img" data-src="images/snap3.jpg" src="images/blank.gif" alt="" data-width="480" data-height="270"/>
+            <img class="block ImageInclude" id="u225_img" data-src="images/snap3.png" src="images/blank.gif" alt="" data-width="1920" data-height="1080"/>
            </div>
            <div class="SSSlide invi clip_frame grpelem" id="u234"><!-- image -->
-            <img class="block ImageInclude" id="u234_img" data-src="images/snap4.jpg" src="images/blank.gif" alt="" data-width="480" data-height="270"/>
+            <img class="block ImageInclude" id="u234_img" data-src="images/snap4.png" src="images/blank.gif" alt="" data-width="1920" data-height="1080"/>
            </div>
            <div class="SSSlide invi clip_frame grpelem" id="u243"><!-- image -->
-            <img class="block ImageInclude" id="u243_img" data-src="images/snap5.jpg" src="images/blank.gif" alt="" data-width="480" data-height="270"/>
+            <img class="block ImageInclude" id="u243_img" data-src="images/snap5.png" src="images/blank.gif" alt="" data-width="1920" data-height="1080"/>
            </div>
            <div class="SSSlide invi clip_frame grpelem" id="u252"><!-- image -->
-            <img class="block ImageInclude" id="u252_img" data-src="images/snap6.jpg" src="images/blank.gif" alt="" data-width="480" data-height="270"/>
+            <img class="block ImageInclude" id="u252_img" data-src="images/snap6.png" src="images/blank.gif" alt="" data-width="1920" data-height="1080"/>
            </div>
           </div>
          </div>
@@ -132,6 +132,8 @@
     </div>
     <div class="rounded-corners colelem" id="u182"><!-- simple frame --></div>
     <div class="verticalspacer"></div>
+    <div class="center"><a href="http://www.thepaperpilot.org/presskit.html"><Strong>See my Presskit!</Strong></a></div>
+    <div class="verticalspacer"></div>
     <div class="clearfix colelem" id="u406"><!-- group -->
      <a class="nonblock nontext clip_frame grpelem" id="u409" href="https://www.google.com/+AnthonyLawnThePaperPilot"><!-- image --><img class="block" id="u409_img" src="images/google-plus.png" alt="" width="48" height="48"/></a>
      <a class="nonblock nontext clip_frame grpelem" id="u413" href="mailto:thepaperpilot@gmail.com"><!-- image --><img class="block" id="u413_img" src="images/email-outline.png" alt="" width="48" height="48"/></a>

presskit.html

@@ -0,0 +1,164 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<meta charset="utf-8">
+		<meta name="viewport" content="width=device-width, initial-scale=1">
+
+		<title>Space Game: The Eternal Journal</title>
+		<link href="http://cdnjs.cloudflare.com/ajax/libs/uikit/1.2.0/css/uikit.gradient.min.css" rel="stylesheet" type="text/css">
+		<link href="style.css" rel="stylesheet" type="text/css">
+		<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
+	</head>
+
+	<body>
+		<div id="space">
+		  <div class="stars"></div>
+		  <div class="stars"></div>
+		  <div class="stars"></div>
+		  <div class="stars"></div>
+		  <div class="stars"></div>
+		</div>
+		<div class="uk-container uk-container-center">
+			<div class="uk-grid">
+				<div id="navigation" class="uk-width-medium-1-4">
+					<h1 class="nav-header">Space Game: The Eternal Journal</h1>
+					<a class="nav-header" href="http://thepaperpilot.org">thepaperpilot.org</a>
+					<ul class="uk-nav uk-nav-side">
+						<li>
+							<a href="#factsheet">Factsheet</a></li>
+						<li>
+							<a href="#description">Description</a></li>
+						<li>
+							<a href="#history">History</a></li>
+						<li>
+							<a href="#projects">Projects</a></li>
+						<li>
+							<a href="#trailers">Videos</a></li>
+						<li>
+							<a href="#images">Images</a></li>
+						<li>
+							<a href="#logo">Logo &amp; Icon</a></li>
+						<li>
+							<a href="#quotes">Selected Articles</a></li>
+						<li>
+							<a href="#links">Additional Links</a></li>
+						<li>
+							<a href="#credits">Team</a></li>
+						<li>
+							<a href="#contact">Contact</a></li>
+					</ul>
+				</div>
+				<div id="content" class="uk-width-medium-3-4">
+					<img src="images/header.png" class="header">
+					<div class="uk-grid">
+						<div class="uk-width-medium-2-6">
+							<h2 id="factsheet">Factsheet</h2>
+							<p>
+								<strong>Developer:</strong><br/>
+								<a href="">The Paper Pilot</a>
+							</p>
+							<p>
+								<strong>Website:</strong><br/>
+								<a href="http://thepaperpilot.org">thepaperpilot.org</a>
+							</p>
+							<p>
+								<strong>Press / Business contact:</strong><br/>
+								<a href="mailto:thepaperpilot@gmail.com">thepaperpilot@gmail.com</a>
+							</p>
+							<p>
+								<strong>Social:</strong><br/>
+								<a href="http://twitter.com/ThePaperPilot">Twitter</a><br/>
+								<a href="http://github.com/thepaperpilot">Github</a><br/>
+							</p>
+							<p>
+								<strong>Phone:</strong><br/>
+								(321) 426-8770
+							</p>
+						</div>
+						<div class="uk-width-medium-4-6">
+							<h2 id="description">Description</h2>
+							<p>
+								Space Game is a game of mystery and discovery. You play the role of a scientist, who has found themself in an endless loop of death and rebirth, with only your notes to link you to your previous experiences. As you play, your player writes everything you discover in a journal. So truly, survival is optional, as death is pretty meaningless. Instead, the game focuses on discovery and exploration, encouraging the player to try new things and experiment. From upgrading your ship to leveling up to making towers, every mechanic is built from the ground up to become progressively clearer. But beware, because, as the player learns, so do the enemies. </p>
+							<p>
+								Space Game features an advanced note system around which everything else is based. Enjoy countless hours of experimenting and trying out new strategies, various guns, upgrades, and towers. </p>
+ 							<p>
+								This game is currently on version beta 1.5, released on 2/15/15. It is in active development. Purchasing from Itch.io or Desura guarantees you will receive all future updates. </p>
+ 							<p>
+								I'm The Paper Pilot, an Eagle Scout on my way to University next year to study Computer Science. I've been making games for years, and programming even longer. However, lacking a formal computer science education, I’ve been keeping most of my programs to myself. But, as I’ve gotten better I’m starting to release some things, starting with Space Game. </p>
+						</div>
+					</div>
+					<hr>
+					<h2 id="trailers">Videos</h2>
+					<p>
+						<strong>Space Game Beta 1.5 Trailer</strong>
+						&nbsp;<a href="http://www.youtube.com/watch?v=L7LPhxCTn2Y">YouTube</a>
+						<div class="uk-responsive-width iframe-container">
+							<iframe src="http://www.youtube.com/embed/L7LPhxCTn2Y" frameborder="0" allowfullscreen></iframe></div></p>
+					<hr>
+					<h2 id="images">Images</h2>
+					<div class="uk-grid images">
+						<div class="uk-width-medium-1-2">
+							<a href="images/snapshot.png">
+								<img src="images/snapshot.png" alt="snapshot.png" /></a></div>
+						<div class="uk-width-medium-1-2">
+							<a href="images/snap6.png">
+								<img src="images/snap6.png" alt="snap6.png" /></a></div>
+						<div class="uk-width-medium-1-2">
+							<a href="images/snap4.png">
+								<img src="images/snap4.png" alt="snap4.png" /></a></div>
+						<div class="uk-width-medium-1-2">
+							<a href="images/snap5.png">
+								<img src="images/snap5.png" alt="snap5.png" /></a></div>
+						<div class="uk-width-medium-1-2">
+							<a href="images/snap2.png">
+								<img src="images/snap2.png" alt="snap2.png" /></a></div>
+						<div class="uk-width-medium-1-2">
+							<a href="images/snap3.png">
+								<img src="images/snap3.png" alt="snap3.png" /></a></div>
+						<div class="uk-width-medium-1-2">
+							<a href="images/snap1.png">
+								<img src="images/snap1.png" alt="snap1.png" /></a></div></div>
+					<br> <p class="images-text">There are far more images available for Space Game: The Eternal Journal, but these are the ones we felt would be most useful to you. If you have specific requests, please do <a href="#contact">contact us</a>!</p>
+					<hr>
+					<h2 id="logo">Logo &amp; Icon</h2>
+					<div class="uk-grid images">
+						<div class="uk-width-medium-1-2">
+							<a href="images/logo.png">
+								<img src="images/logo.png" alt="logo" /></a></div></div>
+					<hr>
+					<h2 id="quotes">Selected Articles</h2>
+					<ul>
+						<li>"This is an awesome, awesome game... deceptively easy, exceptionally interesting"<br/>
+							<cite>- HighSight, <a href="http://cocgn.com/">Community of Chaos Game Network</a></cite></li></li></ul>
+					<hr>
+					<h2 id="links">Additional Links</h2>
+					<p>
+						<strong>Itch.io store page:</strong>
+						<br/>
+						<a href="http://thepaperpilot.itch.io/space-game" alt="thepaperpilot.itch.io/space-game">itch.io</a>.</p>
+					<p>
+						<strong>Desura store page:</strong>
+						<br/>
+						<a href="http://desura.com/games/space-game" alt="desura.com/games/space-game">desura.com</a>.</p>
+					<p>
+						<strong>Review code request form:</strong>
+						<br/>
+						<a href="https://dodistribute.com/access/YP4DDxaaxa/" alt="https://dodistribute.com/access/YP4DDxaaxa/">dodistribute.com</a>.</p>
+					<hr>
+					<div class="uk-grid">
+						<div class="uk-width-medium-1-2">
+							<h2 id="credits">Team</h2>
+							<p>
+								<strong>The Paper Pilot</strong>
+								<br/>
+								Developer, Artist, etc.</p></div>
+						<div class="uk-width-medium-1-2">
+							<h2 id="contact">Contact</h2>
+							<p>
+								<strong>Inquiries</strong>
+								<br/>
+								<a href="mailto:thepaperpilot@gmail.com">thepaperpilot@gmail.com</a></p>
+							<p>
+								<strong>Twitter</strong>
+								<br/>
+								<a href="http://twitter.com/ThePaperPilot">twitter.com/ThePaperPilot</a></p>

style.css

@@ -0,0 +1,143 @@
+body {
+	padding: 15px 0;
+	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
+	color: #E0E0E0;
+	font-size: 0.9em;
+	line-height:1.6em;
+	background: #000;
+}
+
+img {
+	width: 100%;
+}
+
+#navigation h1.nav-header {
+	padding: 0 15px;
+	margin-bottom: 0;
+}
+
+#navigation a.nav-header {
+	padding: 5px 15px;
+	font-weight: bold;
+}
+
+#navigation ul.uk-nav {
+	padding: 15px 0;
+}
+
+#navigation p {
+	padding-bottom: 10px;
+}
+
+#navigation li.language-select select {
+	float: right;
+}
+
+#content h2 {
+	font-family: Georgia, "Times New Roman", Times, serif;s
+}
+
+#content img.header {
+	margin-bottom: 20px;
+}
+
+#content ul {
+	list-style-type: square;
+}
+
+#content li.done {
+	color: #E160E0;
+	text-decoration: line-through;
+}
+
+#content div.images div {
+	padding-bottom: 25px;
+}
+
+#content p.images-text {
+	margin-top: -15px;
+}
+
+#content .iframe-container {
+	position: relative;
+	/* Magic! Makes sure the container is high enough to show the entire iframe
+	 * Thanks to http://andmag.se/2011/11/responsive-embeds/ */
+	padding-bottom: 56.5%;
+}
+
+#content iframe {
+	position: absolute;
+	top: 0;
+	left: 0;
+	width: 100%;
+	height: 100%;
+}
+
+@media (max-width: 767px) {
+	h2 {
+		margin-top: 25px;
+	}
+}
+
+/* Stars
+ * Thanks to http://codepen.io/keithclark/pen/zqcEd */
+#space, .stars {
+  overflow: hidden;
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+}
+
+.stars {
+  background-image:
+    radial-gradient(2px 2px at 20px 30px, #eee, rgba(0,0,0,0)),
+    radial-gradient(2px 2px at 40px 70px, #fff, rgba(0,0,0,0)),
+    radial-gradient(2px 2px at 50px 160px, #ddd, rgba(0,0,0,0)),
+    radial-gradient(2px 2px at 90px 40px, #fff, rgba(0,0,0,0)),
+    radial-gradient(2px 2px at 130px 80px, #fff, rgba(0,0,0,0)),
+    radial-gradient(2px 2px at 160px 120px, #ddd, rgba(0,0,0,0));
+  background-repeat: repeat;
+  background-size: 200px 200px;
+  animation: zoom 10s infinite;
+  opacity: 0;
+}
+
+.stars:nth-child(1) {
+  background-position: 50% 50%;
+  animation-delay: 0s;
+}
+.stars:nth-child(2) {
+  background-position: 20% 60%;
+  animation-delay: 2s;
+}
+.stars:nth-child(3) {
+  background-position: -20% -30%;
+  animation-delay: 4s;
+}
+.stars:nth-child(4) {
+  background-position: 40% -80%;
+  animation-delay: 6s;
+}
+.stars:nth-child(5) {
+  background-position: -20% 30%;
+  animation-delay: 8s;
+}
+
+@keyframes zoom {
+  0% {
+    opacity: 0;
+    transform: scale(0.5);
+    animation-timing-function: ease-in;
+  }
+  85% {
+    opacity: 1;
+    transform: scale(2.8);
+    animation-timing-function: linear;
+  }
+  100% {
+    opacity: 0;
+    transform: scale(3.5);
+  }
+}