more stuff. yay.

index.php

@@ -15,14 +15,16 @@
             Empire
         </div>
         <div class="box">
-            <div class="title-left">
-                Daniel Ascarion <a href="#" title="Logout"><span class="fa fa-sign-out"></span></a>
-            </div>
-            <!--<div class="title-left">
-                IRMS Login <a href="#" title="Login"><span class="fa fa-sign-in"></span></a>
-            </div>-->
-            <div class="title-right">
-                Year 17, Day 123 12:34:56
+            <div class="titles">
+                <div class="left">
+                    Daniel Ascarion <a href="#" title="Logout"><span class="fa fa-sign-out"></span></a>
+                </div>
+                <!--<div class="title-left">
+                    IRMS Login <a href="#" title="Login"><span class="fa fa-sign-in"></span></a>
+                </div>-->
+                <div class="right">
+                    Year 17, Day 123 12:34:56
+                </div>
             </div>
             <div class="body">
                 <ul class="top-menu">

stylesheets/sass/_content.scss

@@ -11,7 +11,7 @@
   }
 
   ul, ol {
-    list-style: disc inside;
+    list-style: disc outside;
     padding-left: $pad;
   }
 

stylesheets/sass/screen.scss

@@ -65,7 +65,8 @@ body {
 #title-bar {
   margin: 20px;
   
-  background: radial_gradient(transparent 5%, transparentize($cMainBG, .2) 50%, $cMainBG 60%), url("../bg-army.png") no-repeat center;
+  background: radial_gradient(transparent, transparentize($cMainBG, .2) 60%, $cMainBG 70%) no-repeat center, url("../bg-army.png") no-repeat center;
+  background-size: 853px, auto;
 
   .logo {
     text-align: center;
@@ -77,44 +78,49 @@ body {
     img {
       height: 70px;
       vertical-align: middle;
+      background: radial_gradient($cMainBG, transparent);
     }
   }
 
-  .title-left {
-    padding-left: 5px;
-    padding-right: 5px;
-    border-bottom: 20px solid $cMenuOutline;
-    border-right: 15px solid rgba(0,0,0,0);
-    display: inline-block;
-    height: 0;
-    line-height: 22px;
+  .titles {
+    display: flex;
+    justify-content: space-between;
 
-    //font-family: $fSerif;
-    //font-variant: small-caps;
-    font-size: smaller;
+    .left {
+      padding-left: 5px;
+      padding-right: 5px;
+      border-bottom: 20px solid $cMenuOutline;
+      border-right: 15px solid rgba(0,0,0,0);
+      display: inline-block;
+      height: 0;
+      line-height: 22px;
 
-    //text-shadow: 1px 1px 2px #111;
-    color: $cBoxHeading;
-   }
+      font-size: smaller;
 
-  .title-right {
-    padding-left: 5px;
-    padding-right: 5px;
-    border-bottom: 20px solid $cMenuOutline;
-    border-left: 15px solid rgba(0,0,0,0);
-    display: inline-block;
-    height: 0;
-    line-height: 22px;
+      //text-shadow: 1px 1px 2px #111;
+      color: $cBoxHeading;
+    }
 
-    /*font-family: $fSerif;
-    font-variant: small-caps;*/
-    font-size: smaller;
+    .right {
+      padding-left: 5px;
+      padding-right: 5px;
+      border-bottom: 20px solid $cMenuOutline;
+      border-left: 15px solid rgba(0,0,0,0);
+      display: inline-block;
+      height: 0;
+      line-height: 22px;
+
+      /*font-family: $fSerif;
+      font-variant: small-caps;*/
+      font-size: smaller;
 
-    //text-shadow: 1px 1px 2px #111;
-    color: $cBoxHeading;
-    float: right;
+      //text-shadow: 1px 1px 2px #111;
+      color: $cBoxHeading;
+      float: right;
+    }
   }
 
+
   .body {
     display: block;
   }

stylesheets/screen.css

@@ -183,7 +183,7 @@ body {
 }
 /* line 13, sass/_content.scss */
 #content ul, #content ol {
-  list-style: disc inside;
+  list-style: disc outside;
   padding-left: 20px;
 }
 
@@ -258,9 +258,10 @@ body {
 /* line 65, sass/screen.scss */
 #title-bar {
   margin: 20px;
-  background: radial-gradient(rgba(0, 0, 0, 0) 5%, rgba(17, 17, 17, 0.8) 50%, #111111 60%), url("../bg-army.png") no-repeat center;
+  background: radial-gradient(rgba(0, 0, 0, 0), rgba(17, 17, 17, 0.8) 60%, #111111 70%) no-repeat center, url("../bg-army.png") no-repeat center;
+  background-size: 853px, auto;
 }
-/* line 70, sass/screen.scss */
+/* line 71, sass/screen.scss */
 #title-bar .logo {
   text-align: center;
   font-family: serif;
@@ -268,13 +269,19 @@ body {
   text-transform: uppercase;
   text-shadow: 1px 1px 2px #111;
 }
-/* line 77, sass/screen.scss */
+/* line 78, sass/screen.scss */
 #title-bar .logo img {
   height: 70px;
   vertical-align: middle;
+  background: radial-gradient(#111111, rgba(0, 0, 0, 0));
 }
-/* line 83, sass/screen.scss */
-#title-bar .title-left {
+/* line 85, sass/screen.scss */
+#title-bar .titles {
+  display: flex;
+  justify-content: space-between;
+}
+/* line 89, sass/screen.scss */
+#title-bar .titles .left {
   padding-left: 5px;
   padding-right: 5px;
   border-bottom: 20px solid silver;
@@ -285,8 +292,8 @@ body {
   font-size: smaller;
   color: #111;
 }
-/* line 100, sass/screen.scss */
-#title-bar .title-right {
+/* line 104, sass/screen.scss */
+#title-bar .titles .right {
   padding-left: 5px;
   padding-right: 5px;
   border-bottom: 20px solid silver;
@@ -300,16 +307,16 @@ body {
   color: #111;
   float: right;
 }
-/* line 118, sass/screen.scss */
+/* line 124, sass/screen.scss */
 #title-bar .body {
   display: block;
 }
-/* line 122, sass/screen.scss */
+/* line 128, sass/screen.scss */
 #title-bar .top-menu {
   display: flex;
   width: 100%;
 }
-/* line 126, sass/screen.scss */
+/* line 132, sass/screen.scss */
 #title-bar .top-menu li {
   flex-grow: 1;
   padding: 5px;
@@ -321,18 +328,18 @@ body {
   font-variant: small-caps;
   text-shadow: 1px 1px 2px #111;
 }
-/* line 137, sass/screen.scss */
+/* line 143, sass/screen.scss */
 #title-bar .top-menu li a {
   text-decoration: none;
   color: #ccc;
   display: block;
 }
-/* line 143, sass/screen.scss */
+/* line 149, sass/screen.scss */
 #title-bar .top-menu li:hover {
   background-color: #444;
 }
 
-/* line 152, sass/screen.scss */
+/* line 158, sass/screen.scss */
 .menu a {
   text-decoration: none;
   font-style: italic;
@@ -340,12 +347,12 @@ body {
   color: #ccc;
   display: block;
 }
-/* line 160, sass/screen.scss */
+/* line 166, sass/screen.scss */
 .menu li {
   padding: 7px 0 5px 5px;
   transition: all .3s ease;
 }
-/* line 164, sass/screen.scss */
+/* line 170, sass/screen.scss */
 .menu li:before {
   content: "\f054";
   font-family: FontAwesome, serif;
@@ -355,26 +362,26 @@ body {
   transition: all 0.3s cubic-bezier(0.68, -0.55, 0.27, 1.55);
   color: transparent;
 }
-/* line 173, sass/screen.scss */
+/* line 179, sass/screen.scss */
 .menu li:hover {
   background-color: #444;
 }
-/* line 176, sass/screen.scss */
+/* line 182, sass/screen.scss */
 .menu li:hover:before {
   color: inherit;
   width: 12px;
 }
-/* line 182, sass/screen.scss */
+/* line 188, sass/screen.scss */
 .menu li.title {
   font-weight: bold;
 }
 
-/* line 188, sass/screen.scss */
+/* line 194, sass/screen.scss */
 .content-header {
   text-align: center;
   border-bottom: 2px solid silver;
 }
-/* line 192, sass/screen.scss */
+/* line 198, sass/screen.scss */
 .content-header .pageTitle {
   text-align: center;
   margin: 0 auto;
@@ -390,13 +397,13 @@ body {
   color: #111;
 }
 
-/* line 210, sass/screen.scss */
+/* line 216, sass/screen.scss */
 .content-footer {
   text-align: center;
   border-top: 1px solid silver;
   clear: both;
 }
-/* line 215, sass/screen.scss */
+/* line 221, sass/screen.scss */
 .content-footer .copy {
   text-align: center;
   border-top: 15px solid silver;
@@ -410,13 +417,13 @@ body {
   font-size: x-small;
   color: #111;
 }
-/* line 227, sass/screen.scss */
+/* line 233, sass/screen.scss */
 .content-footer .copy div {
   position: relative;
   top: -14px;
 }
 
-/* line 234, sass/screen.scss */
+/* line 240, sass/screen.scss */
 .content-body {
   background-color: #222;
   padding: 20px;