@charset "utf-8";

.body {
	width: 100%;
	height: 100%;
	display: flex;
}
.header {
	height: 10%;
	font-size: large;
	text-align: center;
}
.main {
	height: auto;
	width: auto;
	display: flex;
	flex-direction:row;
	flex-grow: 1;
}
.aside {
	width: auto;
	min-width: 15%;
	height: 100%;
	display: flex;
	flex-direction: column;
	flex-grow: 1;
	background-color: aqua;
	border-width: thin;
	border-style: solid;
	border-color: darkgray;
	font-size: large;
	margin-bottom: 8%;
	text-align: center;
}
.button_year{
	width: 100%;
	display: flex;
	flex-direction: column;
	flex-grow: 1;
	font-size: large;
}
button {
	font-size: large;
	padding: 10%;
	height: auto;
}

.button_in_case {
	background-color: #ECF55C;
}

.content {
	height: 100%;
	width:100%;
	display: flex;
	flex-grow: 1;
}
.footer {
	display: none;
}

@media screen and (max-width:1000px) and (min-width:768px){
	
	.header {
		font-size: small;
		height: auto;
	}
	
	.aside {
		font-size: small;
	}
	
	.button_year{
		height: auto;
		font-size: small;
	}
	button {
	font-size: small;
	padding: 4%;
	height: auto;
}
}


@media screen and (max-width : 767px ){
	
	.header {
		font-size: x-small;
		height: auto;
	}
	
	.aside {
		display: none;
	}
	
	.content {
		height: auto;
		min-height: 540px;
	}
	
	.footer {
		height: auto;
		display: block;
		background-color: aqua
	}
	
	.button_year{
		height: auto;
		display: block;
		font-size: small;
	}
	button {
		font-size: small;
		padding: 2%;
	}


}