body {
            margin: 0;
            padding: 0;
            font-family: "Noto Sans", sans-serif;
            line-height: 1.6;
        }

        .container {
            display: flex; /* Make container a flexbox */
            padding-top: 60px;
        }

        .article-list {
            width: 25%; /* Set width to 30% */
            background-color: #eee; /* Light grey background */
            padding: 1rem; /* Add padding inside */
        }

        .articles {
            width: 70%; /* Set width to 70% */
            padding: 1rem; /* Add padding inside */
        }

        .article {
            background-color: #ddd; /* Grey background for each article */
            padding: 1rem; /* Add padding inside */
            width: 95%; /* Set width to 95% of parent div */
        }
        .dateofpublishing {
            color: #333; 
        }
          .update-list li::marker {
            content: "\f022  "; /* FontAwesome Unicode */
            font-family: FontAwesome;
          }
        
        @media (max-width: 768px) {
            .container {
                flex-direction: column; /* Change to column layout */
                width: 100%;
            }
        
            .article-list {
                width: 90%;
                margin: 0 auto;
            }
        
            .articles {
                width: 90%;
                margin: 0 auto;
            }
        
            .article {
                width: 95%;
            }
        }
        
        .article img {
         width: 80%;
         margin: 10px auto;
         display: block;
        }

        footer {
            background: linear-gradient(0deg, rgba(102,102,102,1) 0%, rgba(153,153,153,1) 100%);
            color: white;
            padding: 1rem; /* Add padding inside */            
            text-align: center;
            bottom: 0;
            left: 0;
        }