Html clean up

Author: zzzachzzz

run.py

@@ -1,4 +1,4 @@
 from toonkit import app
 
 if __name__ == '__main__':
-    app.run(debug=True)
+    app.run(debug=True, host='100.115.92.197')

toonkit/static/css/zach.css

@@ -15,6 +15,11 @@ body {
     background:#fafafa;
 }
 
+.my-container {
+    display: flex;
+    justify-content: center;
+}
+
 h1 {
     font-family: 'Architects Daughter', cursive;
 }
@@ -75,13 +80,14 @@ header div img {
 }
 
 .main-content {
+    max-width: 1150px;
     position: relative;
     margin: 5%;
     overflow:hidden;
-    padding-top: 2%;
-    padding-left: 5%;
+    padding: 3%;
+    /*padding-left: 5%;
     padding-right: 5%;
-    padding-bottom: 5%;
+    padding-bottom: 5%;*/
     border-radius: 20px;
     box-shadow: 0px 0px 20px 2px lightgrey;
     background: #fdfdfd;

toonkit/templates/layout.html

@@ -92,8 +92,10 @@
     </header>
     {% endblock header %}
 
+    <div class="my-container">
     {% block content %}
     {% endblock content %}
+    </div>
 
     {% endblock body %}
 

toonkit/templates/staff.html

@@ -5,7 +5,7 @@
 {% endblock head %}
 
 {% block content %}
-  <div class="main-content">
+  <div id="main" class="main-content">
     <h1>Toonkit Contributors</h1>
     <!-- Vice -->
     <div class="contributor">
@@ -33,26 +33,25 @@ <h2>Founder, Web Development / Backend</h2>
       <div class="main-content">
         <h1>Contributor - Zach</h1>
         <h2>Pythonista / Backend / Web Development</h2>
-        <p><b>Zach</b>, also known as zzzachzzz, is a contributor of Toonkit.und Discord as Bin#7773, is a founder of Toonkit. His main interests are software development, game design, cybersecurity, and cryptography. His primary language is English, born in the United States. He prefers to </p>
+        <p><b>Zach</b>, also known as zzzachzzz, is a contributor of Toonkit.</p>
         <a href="https://github.com/zzzachzzz"><i class="fab fa-github fa-1.5x" style="color:black"></i></a>
       </div>
     </div>
   </div>
 
 <style>
+  #main {
+    padding-top: 2%;
+    padding-left: 0%;
+    padding-right: 0%;
+  }
   .contributor {
-
-    display: inline-block;
-    /*flex-direction: row;
+    display: flex;
+    flex-direction: row;
     align-items: center;
     justify-content: center;
-    height: 100%;*/
-    height: 100%;
-    /*position: relative;*/
-    overflow: hidden;
   }
   .contributor div {
-     float: right;
      width: 68%;
      margin: 2%;
   }
@@ -61,8 +60,6 @@ <h2>Pythonista / Backend / Web Development</h2>
     display: inline-block;
     width: 200px;
     height: 200px;
-    float: left;
-    /*transform: translateY(25%);*/
   }
 </style>
 {% endblock content %}