body {
  background-color: rgb(87, 171, 228);
  background-repeat: no-repeat;
  background-attachment: fixed;  
  background-size: contain;
  background-position: center;
  margin: 0;
}

.navbar { 
  display: flex; 
  justify-content: center; /* This centers the navbar items horizontally */ 
  background-color: navy; 
  position: fixed; 
  top: 0; 
  width: 100%; 
} 
.navbar a { 
  color: white; 
  text-align: center; 
  padding: 16px 25px; 
  text-decoration: none; 
  font-size: 20px; 
}


.navbar a:hover {
  background-color: #ffff66;
  color: black;
}



 h1	{ 	
  font-family: "times new roman", arial, courier, sans-serif;
	font-size: 40px;          /* em is recommended by W3C. 1em = default text size 16px. 40px/16 = 2.5em. Pixels/16 = EM */ 
	text-align: center;
	text-decoration:underline; 
	color: black; 
	}



p 		{                 
		font-family: "times new roman", arial, courier, sans-serif;
		font-size: 28px;
		color: black;            /* color of text */
		text-align: left; 
		padding-left: 1em; 
    font-weight: bold;
		}


.center { text-align: center; }    /* <p class="center"> */

        
ul li {
text-align:center;
    font-size: 28px;
    list-style-type: none;
    font-weight: bold;
}



/* ===============================
   Article List (File 2)
   =============================== */
.article-list {
  max-width: 1000px;
  margin: 40px auto;
}

.article-item {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 15px;
  margin-bottom: 12px;
  background: #addef5;
  border-radius: 16px;
  text-decoration: none;
  color: black;
}

a.article-item:hover {
  background: #bee653;
}

.article-item img {
  width: 160px;
  height: 120px;
  object-fit: cover;
  border-radius: 14px;
}

.article-text h2 {
  margin: 0 0 6px 0;
  font-size: 2rem;

}

.article-text p {
  margin: 0;
  color: #130101;
  font-size: 1.4rem;

}