@charset "utf-8";
/* CSS Document */

body {
	background: yellow;
	padding: 0;
	margin: 0;
}

h1 {
	font-family: 'Koulen', cursive;
	color: black;
	font-size: 60px;
}

h2 {
	font-family: 'Koulen', cursive;
	color: black;
	font-size: 40px;
}

h4 {
	font-family: 'Koulen', cursive;
	color: yellow;
	font-size: 40px;
}

h4 {text-align: left;
	
	
}

h3, h5 {
	font-family: 'Koulen', cursive;
	color: yellow;
}

h5 {text-align: right;
	
	
}

p{
	font-family: 'Koulen', cursive;
	font-size: 1.5em;
	color: black;
}

.navi{
	background-color: black;
	min-height: 120px;
	list-style: none;
	display: flex;
	column-gap: 2%;
	justify-content: center;
	align-items: center;
}

.navi a:link, a:active{
	font-family: 'Koulen', cursive;
	color: yellow;
	text-decoration: none;	
}

.navi a:hover{
	color: darkorange;
	text-decoration: none;
}

.box{
	background-color: white;
	min-height: 120px;
	list-style: none;
	display: flex;
	column-gap: 2%;
	justify-content: center;
	align-items: center;
}

.box2{
	background-color: black;
	min-height: 120px;
	list-style: none;
	display: flex;
	column-gap: 2%;
	justify-content: center;
	align-items: center;
}

.box3{
	background-color: white;
	min-height: 120px;
	list-style: none;
	display: flex;
	column-gap: 2%;
	justify-content: center;
	align-items: center;
}

.box4{
	background-color: yellow;
	min-height: 120px;
	list-style: none;
	display: flex;
	column-gap: 2%;
	justify-content: center;
	align-items: center;
}

footer{
	min-height: 120px;
	background-color: black;
	padding: 2%;
}

footer2{
	min-height: 120px;
	background-color: black;
	padding: 2%;
}