Fix footer.

Goutte
1 parent 81c9b2e8
Showing 1 changed file with 47 additions and 0 deletions Show diff stats
web/static/css/main.css
@@ -41,6 +41,16 @@ footer {
     text-align: center;
 }
  
+#page-container {
+    display: flex;
+    min-height: 100vh;
+    flex-direction: column;
+}
+
+#content {
+    flex: 1;
+}
+
 /** HEADER ********************************************************************/
  
 .header {
@@ -167,6 +177,43 @@ ul li {
     /*padding: 10px 0;*/
 /*}*/
  
+/** LOADER ********************************************************************/
+
+
+.loader {
+  transform: translate(50vw, 50vh);
+  height: 200px;
+  width: 200px;
+}
+
+.loader .hole {
+  margin: -50%;
+  height: 100%;
+  width: 100%;
+  border-radius: 50%;
+  box-shadow: 0px 0px 30px #88ffff, 0px 0px 100px #000000 inset, 0px 0px 50px #55ffff inset, -20px -10px 100px #000000 inset;
+  background: #f08301;
+  -webkit-animation: shadowmove 8s infinite linear;
+}
+
+@-webkit-keyframes shadowmove {
+  0% {
+    box-shadow: 0px 0px 30px #88ffff, 0px 0px 100px #000000 inset, 0px 0px 50px #55ffff inset, -20px -10px 100px #000000 inset;
+  }
+  50% {
+    box-shadow: 0px 0px 30px #88ffff, 0px 0px 100px #000000 inset, 0px 0px 50px #55ffff inset, -220px -110px 100px #000000 inset;
+  }
+  50.01% {
+    box-shadow: 0px 0px 30px #88ffff, 0px 0px 100px #000000 inset, 0px 0px 50px #55ffff inset, 220px 110px 100px #000000 inset;
+  }
+  75% {
+    box-shadow: 0px 0px 30px #111111, 0px 0px 100px #000000 inset, 0px 0px 50px #55ffff inset, 220px 110px 100px #000000 inset;
+  }
+  90% {
+    box-shadow: 0px 0px 30px #88ffff, 0px 0px 100px #000000 inset, 0px 0px 50px #55ffff inset, 10px 20px 100px #000000 inset;
+  }
+}
+
 /** MEDIA QUERIES *************************************************************/
  
 @media all and (max-width: 980px) {