change style of latest news - seil

Author: seilk

css/style.css

@@ -1,4 +1,4 @@
-body {
+/* body {
   font-family: Arial, sans-serif;
   background-color: #f8f9fa;
   color: #333;
@@ -63,4 +63,4 @@ body {
 .img-fluid {
   max-width: 100%;
   height: auto;
-}
+} */

css/wowchemy.css

@@ -574,6 +574,32 @@ pre {
   flex: 0 0 91.66666667%;
   max-width: 91.66666667%; }
 
+
+.centered-block {
+    margin: 0 auto;
+    max-width: 1200px;
+    padding: 1rem 10rem 1rem 10rem;
+}
+
+@media (max-width: 1199px) {
+    .centered-block {
+        max-width: 100px;
+    }
+}
+
+@media (max-width: 991px) {
+    .centered-block {
+        max-width: 800px;
+    }
+}
+
+@media (max-width: 767px) {
+    .centered-block {
+        max-width: 90%;
+    }
+}
+
+
 .col-12 {
   flex: 0 0 100%;
   max-width: 100%; }

index.html

@@ -23,6 +23,7 @@
   <script src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-chtml.js" integrity=""
           crossorigin="anonymous" async></script>
   <link rel="stylesheet" href="/css/wowchemy.css" />
+  <link rel="stylesheet" href="styles.css">
   <link rel="stylesheet" href="/css/libs/chroma/github-light.min.css" title="hl-light" media="print"
         onload="this.media='all'">
   <link rel="stylesheet" href="/css/libs/chroma/dracula.min.css" title="hl-dark" media="print"
@@ -444,7 +445,7 @@ <h3>Xingchen Zhao</h3>
         <div class="col-12 text-center">
           <h1>Research Topics</h1>
         </div>
-        <div class="col-12">
+        <div class="col-12 centered-block">
           <h2 id="medical-imaging">Medical imaging analysis</h2>
           <ul>
             <li>Alzheimer's Disease Analysis with MRI/PET/DTI</li>