image up

static/page.css

@@ -354,9 +354,8 @@ body{
     font-weight: 600;
     margin-left: 60px;
 }
-.img-pagestyle{
+/* .img-pagestyle{
     margin: 20px auto 20px;
-    /* width and height of pictures! */
     width: 50%;
     height: 50%;
     overflow: hidden;
@@ -365,6 +364,19 @@ body{
     width: 100%;
     height: 100%;
     object-fit: contain;
+} */
+.img-pagestyle {
+    margin: 10px 0;  /* Reduce space between image and text */
+    width: 80%;      /* Keep the width as per your preference */
+    height: auto;    /* Let the height adjust automatically */
+    overflow: hidden;
+    padding: 0;      /* Ensure no padding around the image */
+}
+
+.img-pagestyle img {
+    width: 100%;
+    height: auto;
+    object-fit: contain;  /* Maintain aspect ratio */
 }
 .pagecontent p {
     margin-top: 20px;

wiki/pages/description.html

@@ -24,7 +24,7 @@
             <div class="h1">Background</div>
             <p>The Netherlands has been facing a pressing <strong>nitrogen crisis</strong> for several years. This crisis is largely attributed to the <strong>agriculture sector</strong>, with over 80% of ammonia (a nitrogenous compound) emissions coming from manure <a href="https://www.wur.nl/en/newsarticle/Nitrogen-crisis-in-the-Netherlands.htm" style="color: #C6EBE8;">[NitrogenWUR]</a> and chemical fertilizers <a href="https://www.government.nl/topics/nitrogen-crisis" style="color: #C6EBE8;">[TheGovernment.nl]</a>.</p>
             <p>The over-use of fertilizers has a detrimental effect on the environment through the deposition of excess nitrogen oxides and ammonia in the ground, excessively enriching the environment with nutrients promoting uncontrolled plant and algal growth, or eutrophication, a form of nutrient imbalance <a href="https://oceanservice.noaa.gov/facts/eutrophication.html" style="color: #C6EBE8;">[US Department of Commerce What is Eutrophication]</a> that negatively impacts the local biodiversity. This highlights the need of the hour: <strong>tackle the nitrogen crisis without negatively affecting food production</strong>, which still depends highly on fertilizers.</p>
-            <div class="img-pagestyle" style="width:80%; margin-top: 10px; margin-bottom: 0;">
+            <div class="img-pagestyle">
               <img src="https://static.igem.wiki/teams/5054/background.svg" alt="">
             </div>
             </div>