﻿.fui-form 
{
	margin: 0;
	padding: 0;
}
.fui-formbox 
{
	border: 1px solid #000000;
	border-radius: 0.75em;
	padding: 1em;
	margin: 0.5em auto;
	width: 40vw;
}
@media ( max-width: 800px )
{
	.fui-formbox 
	{
		width: auto;
		max-width: 96vw;
	}
}
.fui-groupbox 
{
	border: solid 1px #000000;
	border-radius: 0.5em;
	padding: 0.5em;
	margin: 0.5em auto;
}
.fui-formrow 
{
	/*
	display: block;
	margin: 0.5em;
	*/
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	width: 100%;
	margin: 0.5em auto;
}
.fui-formrow-wrapped 
{
	display: block;
	margin: 0.5em;
}
.fui-formlabel
{
	display: inline-block;
	font-weight: bold;
	font-size: 0.9em;
	line-height: 1em;
	padding: 0.375em 0;
	margin-top: 0.75em;
}
.fui-formlabel-nowrap
{
	display: inline-block;
	font-weight: bold;
	font-size: 0.9em;
	line-height: calc(1.5em + 0.5rem + 2px);
	height: calc(1.5em + 0.5rem + 2px);
}
.fui-formrow > .fui-formlabel 
{
	min-width: 10%;
}
.fui-formrow-wrapped > .fui-formlabel 
{
	display: block;
	padding: 0;
}
.fui-control 
{
	display: inline-block;
	line-height: 1em;
	padding: 0.375em 0.25em;
	border: 1px solid #ced4da;
	border-radius: 0.25em;
	height: calc(1.5em + 0.5rem + 2px );
	width: 100%;
}
.fui-control:focus
{
	border-color: #80bdff;
	outline: 0;
	box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25)
}
.fui-checkbox-wrapper 
{
	display: inline-block;
	font-size: 1em;
	padding-right: 0.33em;
	height: auto;
}
.fui-checkbox 
{
	display: inline-block;
	position: relative;
	xxxtop: 0.25em;
	font-size: 1em;
	width: 1.5em;
	height: 1.5em;
	line-height: 1em;
	margin: 0.33em 0 0 0.33em;
}
.fui-checkbox-caption 
{
	display: inline-block;
	xxxbackground-color: rgba( 255,0,255,0.5 );
	position: relative;
	top: -0.33em;
	font-size: 1em;
	line-height: 1.5em;
	padding: 0;
	margin: 0 0 0 0.25em;
}
.fui-formrow > .fui-control 
{
	flex: 1 1 auto;
	margin: 0 0.5em;
	width: auto;
}
.fui-button 
{
	flex: 1 1 auto;
	width: auto;
}