@charset "UTF-8";

body, html
{
	height: 100%;
	min-height: 100%;
	
	width:100%;
	margin: 0;
}

.container_form
{
	text-align: center;
	vertical-align: middle;
}

@supports (display: grid)
{
	@media (orientation: landscape){
		.containerAll
		{
			height: 75%;
			width: 100%;
			display:grid;
			grid-template-columns: 1fr 1fr;
			grid-template-rows: 100%;
			grid-template-areas:
				'body-left body-right';
		}
		
		.container_fieldsetForm
		{	
			display: inline-grid;
			grid-gap: 10px;
			grid-template-columns: auto auto;
			justify-self: end;
		}
	}


	@media (orientation: portrait){
		.containerAll
		{
			height: 100%;
			width: 100%;
			display:grid;
			grid-template-columns: 1fr 1fr;
			grid-template-rows: 50% 50%;
			grid-template-areas:
				'body-left body-left'
				'body-right body-right';
		}
	
		.container_fieldsetForm
		{	
			display: inline-grid;
			grid-gap: 10px;
			grid-template-columns: auto auto;
			justify-self: center;
		}
	}
	
	.button
	{
		height: 80%;
		margin-left: 12px;
		margin-right: 12px;
		border-radius: 4px;
	}
	
	.select
	{
		border-radius: 4px;
	}

	.container_fieldsetStatistics
	{	
		display: inline-grid;
		grid-gap: 10px;
		grid-template-columns: auto auto;
		text-align: left;
	}
	
	.container_bodyLeft
	{
		grid-area: body-left;
		justify-self: center;
		align-self: start;
	}

	.container_bodyRight
	{
		grid-area: body-right;
		justify-self: center;
	}	
}

@supports not (display: grid)
{
	.containerAll
	{
		height: 100%;
		width: 100%;
	}
	
	.button
	{
		height: 10%;
		margin-left: 12px;
		margin-right: 12px;
	}
	
	.container_fieldsetForm
	{
	}

	.container_fieldsetStatistics
	{	
	}
	
	.container_bodyLeft
	{
		float: left;
	}

	.container_bodyRight
	{
	}
}
