html,body
{
	height:100%;
}
body
{
	padding: 0px;
	margin: 0px;
}
.bgimg
{
	background-image: url(bgimg.png);
    background-size: contain;
    background-position: center;
    background-repeat: space;
    background-blend-mode: screen;
    background-color: #e1e8ec;
}
header
{
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: 12px;
}
header>section:nth-of-type(1)
{
	flex: 1;
	display: flex;
	align-items: center;
}
header nav button
{
	border-width: 0;
	border-color: #e5e7eb;
	font-family: inherit;
	font-size: 16px;
	background-color: transparent;
	cursor: pointer;
}
body h1:nth-child(1)
{
	color:  white;
	margin: 0px;
	padding: 18px;
	background :  #e68a00; 
    font-size: 24px;
	text-align: center;
}
main
{
	padding: 0 8px;
}

form
{
	text-align: center;
}
form input[type="number"],form input[type="text"],form select
{
	border: 1px solid black;
}
.g_slides_pub
{
	--g_slides_pub_width: 86vw;
	width: var(--g_slides_pub_width);
	height: calc( var(--g_slides_pub_ratio)*var(--g_slides_pub_width) );
}
.histogram_data
{
	text-align: center;
	border-collapse: collapse;
}
.histogram_data td,.histogram_data th
{
	border: 1px solid;
	padding: 5px;
}


@media (max-width: 767px)
{
	header
	{
		flex-direction: column;
	}
}
@media (min-width: 768px) and (max-width: 991px)
{
	.bgimg
	{
		background-size: 50%;
	}
}
@media (min-width: 992px)
{
	.bgimg
	{
		background-size: 33%;
	}
	.g_slides_pub
	{
		--g_slides_pub_width: 75vw;
	}
}