﻿#content .panel.left {
	/* Flexbox */
	flex: 0 11em;
}
#content .main {
	/* Flexbox */
	flex: 1 calc(100% - 11em);
}
form {
	width: 100%;
	margin: 0;
	padding: 0;
	display: block;
}
form p.message {
	color: #CC0000;
	display: none !important;
	font-size: 1.2em;
	letter-spacing: 0.1em;
}
form table {
	width: 100%;
	margin: 0.5em 0 0 0;
	empty-cells: show;
	border-spacing: 0;
}
form table td {
	width: 90%;
	padding: 0.25em;
	line-height: 1.2em;
}
form table td.text {
	width: 10%;
	text-align: right;
	font-size: 0.85em;
	padding-top: 0.5em;
	padding-left: 0;
	vertical-align: top;
}
form table input, 
form table textarea {
	color: #333333;
	border: 0px none #808080;
	padding-top: 0.2em;
	padding-bottom: 0.2em;
	border-radius: 4px;
	background-color: #E1E1E1;
}
form table input[type=text] {
	width: calc(100% - 1em);
	max-width: calc(100% - 1em);
	padding-left: 0.3em;
	padding-right: 0.3em;
}
form table textarea {
	width: calc(100% - 0.5em);
	max-width: 100%;
	min-height: 4.5em;
	max-height: 9em;
	padding: 0.1em;
}
form table input[type=submit] {
	color: #333333;
	cursor: pointer;
	padding: 0.3em 0.7em;
	background-color: #C0C0C0;
}
form table input[type=submit]:hover {
	color: #DCF499;
	background-color: #666666;
}
form table input.error, 
form table textarea.error {
	color: #800000;
	background-color: #FF9696;
}
@media screen and (max-width: 768px) {
	#content .panel.left {
		border-right-style: none;
		border-bottom-style: solid;
		/* Flexbox */
		flex: 0 100%;
	}
	#content main {
		/* Flexbox */
		flex: 0 100%;
	}
	#content main > p:first-child {
		margin-top: 1em !important;
	}
	form p.message {
		margin-top: 0.5em;
	}
}