Add styles for hpcguix-web.

* static/css/main.css: Add styles for hpcguix-web.

static/css/main.css

@@ -29,6 +29,7 @@
 }
 
 @media all {html {font-size: 20px;}}
+@media all and (max-width:1260px){html {font-size: 20px;}}
 @media all and (max-width:1000px){html {font-size: 20px;}}
 @media all and (max-width:960px){html {font-size: 19px;}}
 @media all and (max-width:920px){html {font-size: 18px;}}
@@ -44,15 +45,15 @@ body,html {
     width: 100%;
     height: 100%;
     line-height: 1.4em;
-    padding: 0pt;
-    margin: 0pt;
+    padding: 0px;
+    margin: 0px;
     font-family: 'Roboto', sans-serif;
 }
 
 pre {
     border-style: none;
     border-radius: 0.3em;
-    background-color: #F2EFE4;
+    background-color: #f2efe4;
     border-width: thin;
     color: #423;
     font-size: 0.9em;
@@ -65,21 +66,22 @@ pre {
 
 code {
     font-family: 'FiraMono', monospace;
+    border-radius: 0.3em;
 }
 
 .width-control {
-    max-width: 1000px;
+    max-width: 1260px;
     width: 90%;
 }
 
 p {
-    max-width: 50rem;
+    max-width: 70rem;
     margin-bottom: 0;
 }
 
 p + p {
-    text-indent: 0.5rem;
-    margin-top: 0.4rem;
+    /*text-indent: 0.5rem;*/
+    margin-top: 1.0rem;
 }
 
 #header {
@@ -148,8 +150,8 @@ p + p {
 
 
 #collaboration {
-    border-top: solid 3pt #aaaaaa;
-    border-bottom: solid 3pt #aaaaaa;
+    border-top: solid 4px #aaaaaa;
+    border-bottom: solid 4px #aaaaaa;
     background: #ffffff;
     width: 100%;
     bottom: 0px;
@@ -157,7 +159,7 @@ p + p {
 #collaboration-inner { margin: 10px auto 10px auto; }
 #collaboration .members { text-align: center; }
 #collaboration p { padding: 0px 10px 0px 10px; }
-#collaboration .members ul { display: inline-block; padding: 0pt; margin: 0pt; }
+#collaboration .members ul { display: inline-block; padding: 0px; margin: 0px; }
 #collaboration .members li { display: inline-block; padding: 0px 10px; 0px 0px; }
 
 .post {
@@ -176,7 +178,11 @@ hr {
 }
 
 .post h1 { color: #433; }
+<<<<<<< HEAD
+.post h2 { padding: 0px; margin: 0px; }
+=======
 .post h2 { color: #433; padding: 0pt; font-size: 1.3rem; }
+>>>>>>> 53a0f896f619977fb1d83c014cde093326296393
 
 .post-about {
     color: #4D4D4D;
@@ -184,20 +190,15 @@ hr {
     margin-top: -3em;
 }
 
-#menubar ul { display: inline-block; padding: 0pt; margin: 0pt; }
+#menubar ul { display: inline-block; padding: 0px; margin: 0px; }
 #menubar li {
     display: inline-block;
-    /* background: #dddddd; */
     color: #000000;
-    height: 24pt;
-    line-height: 24pt;
+    height: 32px;
+    line-height: 32px;
     list-style-type: none;
-    margin: 0pt;
-    margin: 0pt 10pt 0pt 0pt;
-    /* padding: 3pt 5pt 3pt 5pt; */
-    /* -webkit-border-radius: 0pt 0pt 4pt 4pt; */
-    /* -moz-border-radius: 0pt 0pt 4pt 4pt; */
-    /* border-radius: 0pt 0pt 4pt 4pt; */
+    margin: 0px;
+    margin: 0px 13px 0px 0px;
     text-transform: uppercase;
     text-decoration: none;
     font-size: small;
@@ -216,6 +217,36 @@ hr {
     padding: 0px;
 }
 
+#content .search-field {
+    border: solid thin #aaaaaa;
+    width: 100%;
+    padding: 7px;
+    -webkit-border-radius: 5px;
+    -moz-border-radius: 5px;
+    border-radius: 5px;
+}
+
+#content table {
+    border-spacing: 0px;
+    padding: 0px;
+}
+
+#content table td { padding: 3px 5px 3px 5px; height: 25px; }
+
+#packages-table-wrapper {
+    font-size: 16px;
+}
+
+#stand-by {
+    background: #decd87;
+    -webkit-border-radius: 5px;
+    -moz-border-radius: 5px;
+    border-radius: 5px;
+    font-size: 16px;
+}
+
+#stand-by p { padding: 7px }
+
 #footer-box {
     width: 100%;
     margin: auto;
@@ -224,12 +255,17 @@ hr {
     font-size: 0.8rem;
 }
 
+#footer-box p {
+    max-width: 100%;
+    text-align: center;
+}
+
 h1 {
     clear: both;
     line-height: 125%;
     margin-top: 1.3rem;
     margin-bottom: .3rem;
-    padding: 0pt;
+    padding: 0px;
     display: block;
     font-size: 1.6rem;
     font-weight: 800;