
:root
{
	--scrollbar-width: 13px;
}

iframe
{
	width: 100%;
	height: 100%;
	border: 0px;
}

body
{
	min-height: -webkit-fill-available;
	margin: 0px;
}

body main.shrink
{
  align-items: center;
}

body main > div
{
	display: flex;
  flex-direction: column;
	width: -webkit-fill-available;
}

body main:not(.shrink) > div
{
	flex-grow: 1;
	/* max-height: 500px; */
	max-height: 100vh;
	max-width: 800px;
}

.content-body
{
	flex-grow: 1;
	display: flex;
	flex-direction: column;
	padding: 2px;
}

.close-dialog
{
	text-align: right;
	height: 16px;
	
	margin: 1% 0px;
}

svg
{
	cursor: pointer;
}

svg.cross
{
	height: 16px;
}

svg.cross:hover
{
	fill: red;
}

.custom-button
{
	display: flex;
	justify-content: center;
	margin: 5px;
}

.custom-button input
{
  box-shadow: 0px 0px 5px 0px black;
  padding: 5px 10px;
  border-radius: 3px;
  color: black;
  background-color: greenyellow;
  cursor: pointer;
}

.custom-button input:hover
{
	background-color: yellow;
}

@media print
{
	body main:not(.shrink) > div
	{
		max-height: none;
		max-width: none;
	}
}

@media screen and (pointer: fine)
{
	.custom-scroll-bar::-webkit-scrollbar
	{
		width: var(--scrollbar-width);
	}
	
	.custom-scroll-bar::-webkit-scrollbar-track
	{
		background-color: rgba(255, 255, 255, 0.2);
	}

	.custom-scroll-bar::-webkit-scrollbar-track:hover
	{
		background-color: rgba(255, 255, 255, 0.8);
	}

	.custom-scroll-bar::-webkit-scrollbar-thumb
	{
		background-color: #154a74;
	}

	.custom-scroll-bar::-webkit-scrollbar-thumb:hover
	{
		background-color: #22679d;
	}

	.custom-scroll-bar::-webkit-scrollbar-track,
	.custom-scroll-bar::-webkit-scrollbar-thumb
	{
		box-shadow: inset 0px 0px 0px 1px gray;
	}
}