*.#{$prefix}viewport {

	margin: 0;
    overflow: auto;
    font-family: tahoma, arial, verdana, sans-serif;
	text-align: left;
	font-weight: normal;

	@import "icons.scss";
	@import "tooltip.scss";

	div, input, td, th, select {
		min-height: fit-content;

		@if $touchscreen {
			font-size: 16pt;
		}
		@else {
			font-size: 9pt;
	    }
	}
}
div.#{$prefix}loader {
	font-size: 16pt;
	font-style: italic;
	text-align: center;
}
div.#{$prefix}loader-spinner {
	width: 40px;
	height: 40px;
	border: 10px solid;
	border-radius: 100%;
	border-color: $panel-border-color $panel-border-color $panel-border-color $select-base-color;
	margin: auto auto;
	animation: #{$prefix}rotation .8s infinite linear;
}
@keyframes #{$prefix}rotation {
	from { transform: rotate(0deg); }
	to { transform: rotate(359deg); }
}

.#{$prefix}vcontainer, .#{$prefix}hcontainer {
    display: flex;
    align-items: flex-start;
}
.#{$prefix}vcontainer {
    flex-direction: column;
}
.#{$prefix}hcontainer {
    flex-direction: row;
    flex-shrink: 0;
}
.#{$prefix}wrapping-horizontal {
	flex-shrink: 0;
	min-width: fit-content;
	* {
		min-width: fit-content;
	}
}
.#{$prefix}wrapping-vertical {
	flex-shrink: 0;
	min-height: fit-content;
	* {
		min-height: fit-content;
	}
}
