make home buttons align horizontaly for big screens

Author: pettiboy

index.html

@@ -170,12 +170,12 @@
 
           </address>
 
-          <div style="margin-bottom: 25px;">
+          <div class="home-buttons-container">
             <!-- discord community ka button -->
-            <div style="margin-bottom: 25px;">
+            <div style="margin-right: 25px; margin-bottom: 30px;">
               <a class="wow animated fadeInUp blog-link btn-blog" target="_blank" data-wow-delay="1.5s"
                 href="https://discord.com/invite/UBbSuw7swW">
-                Join Our Community
+                Discord Server
                 <img style="margin-left: 6px; margin-right: 5px;"  class="beta" src="./static/images/discord-logo-white.png"></img>
               </a>
             </div>

static/styles/styles.css

@@ -810,8 +810,19 @@ only screen and (min-resolution: 2dppx) {
   margin-bottom: 32px;
 }
 
+.home-buttons-container {
+  display: flex; 
+  justify-content: center;
+}
+
+@media(max-width: 860px) {
+  .home-buttons-container {
+    flex-direction: column;
+  }
+}
+
 .section-header .blog-link {
-  font-size: 40px;
+  font-size: 30px;
   color: white;
   background-color: #003955;
   margin-bottom: 50px;
@@ -845,8 +856,8 @@ only screen and (min-resolution: 2dppx) {
 
 .beta {
   margin-bottom: 10px;
-  width: 40px;
-  height: 40px;
+  width: 30px;
+  height: 30px;
 }
 
 .intro-holder {