body{
	background-image:url("../img/cork-board.png");
	color:white;
	font-size:24px;
}
h1{margin-bottom: 1px;}
#container{
	margin:auto;
	max-width:70vw;
	min-width:850px;
}
iframe{
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 1vh;
	width:48vw;
	height:30vw;
}
fieldset{
	border:5px double white;
}
legend{
	
	font-size:26px;
}
.navigation {
  font-weight:bold;
  /* flexboxで要素を真ん中に指定 */
  display: flex;
  justify-content: center;
  align-items: center;
  text-align:center;
  width:100%;
  padding: 0;
  margin: 0;
  height: 60px;
  /* ポジションを相対的な位置に指定 */
  position:relative;
}
.navigation ul {
  display: block;
  width:100%;
  background:transparent;
  /* リストの無駄なスタイルを削除 */
  list-style:none;
  padding:0 20px;
  margin: 0;
  height: 60px;
}
.navigation ul li {
  display: inline-block;
  background: crimson;
  border: 4px groove crimson;
  border-radius:3%;
}
.navigation ul li a {
  color:white;
  display:block;
  padding:0px 40px;
  /* リンク指定した要素のスタイルを削除 */
  text-decoration:none;
  float: left;
  height: 50px;
  line-height: 50px;
}
.navigation ul li:hover {
  /* ナビゲーションをマウスオーバーした際のアニメーションと速度を指定 */
  transition: .7s;
  background: firebrick;
}
.navigation ul li:hover > a{
  /* ナビゲーションの文字をマウスオーバーした際のアニメーションと速度を指定 */
  transition: .5s;
  color:lightcyan;
}