body {
	background: radial-gradient(rgb(169, 214, 255), rgb(0, 80, 159));
}

div {
	max-width: 800px;
	margin: 0 auto;
	padding: 10px 30px;
	border: 1px solid #0000ff;
	background-color: #e4f0a6;
	color:rgb(14, 119, 76)
	font-family: Arial, sans-self:
}

p {
	font-size: 18px;
	text-align: center;
	color: #fff;
	background-color: rgb(0, 57, 26);
}





/* ヘッダー全体のスタイリング */
.site-header {
  display: flex; /* 子要素を横並びにする */
  align-items: center; /* 子要素を上下中央揃えにする */
  justify-content: space-between; /* ロゴとナビを左右に配置 */
  padding: 5px 20px; /* ヘッダーの内側の余白 */
  background-color: #fff; /* ヘッダーの背景色 */
  border-bottom: 1px solid #000; /* ヘッダーの下線 */
}

/* ロゴ部分のスタイリング */
.logo img {
  height: 40px; /* ロゴの高さ */
}

/* ナビゲーション部分のスタイリング */
.main-nav ul {
  list-style: none; /* リストの点（●）を消す */
  margin: 0;
  padding: 0;
  display: flex; /* メニュー項目を横並びにする */
}

.main-nav li {
  margin-left: 20px; /* メニュー項目の左余白 */
}

.main-nav a {
  text-decoration: none; /* リンクの装飾（下線など）を消す */
  color: #333; /* リンクの文字色 */
  font-weight: bold;
}

/* マウスが乗った時のホバー効果 */
.main-nav a:hover {
  color: #007bff; /* ホバー時の文字色を変化させる */
}