Backdrop, graphical placeholder

index.html

@@ -37,7 +37,8 @@
     <![endif]-->
 
     <div>
-      PLACEHOLDER
+      <img src="/images/bdp4logo.png" alt="Brutal Doom Platinum logo" class="placeholder">
+      <div class="placeholder">Coming Soon</div>
     </div>
 
     <!-- <script src="" async defer></script> -->

styles/main.css

@@ -1,12 +1,53 @@
+@import url('https://fonts.googleapis.com/css?family=DotGothic16');
+
 :root {
 	color-scheme: dark;
 }
 
 body {
 	color: #eee;
-	background: #121212;
+	background-color: #121212;
+	background-image: url("/images/SKYSPACE.png");
+	background-size: 1024px 512px;
+
+	-webkit-animation-name: slidein;
+	animation-name: slidein;
+
+	-webkit-animation-duration: 240s;
+	animation-duration: 480s;
+
+	-webkit-animation-fill-mode: both;
+	animation-fill-mode: both;
+
+	-webkit-animation-iteration-count: infinite;
+	animation-iteration-count: infinite;
+
+	-webkit-animation-timing-function: linear;
+	animation-timing-function: linear;             
+}
+
+@-webkit-keyframes slidein {
+from {background-position: 0px 0px;}
+to {background-position: 1024px 2048px;}
+}
+
+@keyframes slidein {
+from {background-position: 0px 0px;}
+to {background-position: 1024px 2048px;}
+
 }
 
 a {
 	color: #809fff;
 }
+
+.placeholder {
+	display: block;
+	margin: 2.5% auto;
+	max-height: 320px;
+	max-width: 400px;
+	width: 50%;
+	font-family: "DotGothic16", sans-serif;
+	font-size: 200%;
+	text-align: center;
+}