/* 1. タグセレクター：ページ全体のフォントや背景を設定 */

h1 {
  color: white;
  border-bottom: 3px solid #3498db;
  display: inline-block;
}

video {
  width: 400px;
}

div {
  border: 2px solid #ddd;
  border-radius: 8px;
  padding: 15px;
  margin-bottom: 20px;
}

img {
  width: 200px;
  border-radius: 50px; /* 写真の角を丸くする */
  border: 5px solid #fff;
  box-shadow: 0 4px 8px rgba(0,0,0,0.5);
}


/* 2. クラスセレクター：特定のグループ（枠線や余白）を指定 */
.love {
	background-color: lightpink;
}

.will {background-color: lightgreen;}

.msg {
	background-color: lightyellow;
}



/* 3. IDセレクター：特定の1か所（写真）だけに適用 */
/* HTML側を <img id="profile-img" ...> に書き換えて使用 */
#profile-img {
  width: 200px;
  border-radius: 50%; /* 写真を丸くする */
  border: 5px solid #fff;
  box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

/*3個目の画像の背景色*/
.test {
background-color:white;
}

/*1つ目の画像の背景色*/
.shimaenaga {
background-color:#AAD6EC;
}


.images {
background-color:black;
}

body {
background-color:black;
}

.festival{
background-color:#E8CA18;
}