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

body{
	padding: 0;
	margin: 0;
	font-family: 'Exo 2', sans-serif;
}

.container{
	width:80%;
	border: 1px solid black;
	margin: 0 auto;
}

.navi{
	list-style: none;
	display: flex;
	gap:3%;
	justify-content: center;
	align-content: center;
	padding: 20px 0;
}

.navi a:link{
	color: #764041;
	text-decoration: none;
	font-size: 1.5em;
}

.navi a:hover{
	color: #5575A2;
	text-decoration: underline;
}

.main{
	display: flex;
	min-height: 750px;
	background: #F5E1B6;
}

.aside-left{
	min-width: 60%;
	min-height: 450px;
	padding: 1%;
	box-sizing: border-box;
}
	
.aside-right{
	min-width: 40%;
	min-height: 450px;
	padding: 1%;
	box-sizing: border-box;
}

.img{
	width: 100%;
	height: auto;
}

.row{
	display: flex;
	justify-content: center;
	align-content: center;
	gap: 2%;
	margin-top: 50px 0;
	min-height: 200px;
}

.column > h2{
	text-align:center;
	color: #7A5454;
}

.column{
	min-width: 30%;
	min-height: 200px;
	padding: 5%;
	box-sizing: border-box;
}

.column-color{
	background: #ECB6B6;
	border-radius: 10px;

}

.footer{
	min-height: 250px;
	background: #8FC0EE;
	color: #393939;
	padding: 30px;
}

@media (max-width:992px){
	.row{
		display: block;
	}
	.column{
		width: 100%;
	}
	.main{
		display: block;
	}
	.aside-left{
		width: 100%;
	}
	.aside-right{
		width: 100%;
	}
}