* {
	line-height: 24px;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}
body {
	color: #5D6063;
	background-color: #EAEDF0;
	font-family: "Helvetica", "Arial", sans-serif;
	font-size: 16px;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.frameToolHeader {
	text-align: center;
	background-color: #F6F7F8;
	border: 1px solid #D6D9DC;
	border-radius: 3px;

	width: 90%;
	max-width: 600px;
	margin: 20px 0;
	padding: 50px;
}

.frameToolHeader h1 {
	font-size: 30px;
	margin-bottom: 24px;
}

body p {
	max-width: 600px;
	margin-bottom: 24px;
}

canvas {
	margin-bottom: 24px;
}

#theForm {
	background-color: #F6F7F8;
	border: 1px solid #D6D9DC;
	border-radius: 3px;

	width: 90%;
	max-width: 600px;
	padding: 50px;
	margin: 0 0 20px 0;
}

fieldset {
	margin-top: 24px;
	margin-bottom: 24px;
	border-top: 1px solid #D6D9DC;
	border-bottom: none;
	border-left: none;
	border-right: none;
	border-radius: 0px;
	/*background-color: rgba(0,0,0,0.2);*/
}

fieldset legend {
	margin-left: 45px;
	padding-left: 5px;
	padding-right: 5px;
	margin-bottom: 6px;
}

.formRow {
	margin-bottom: 12px;
	/*display: flex;*/
	/*justify-content: flex-start;*/
	/*flex-direction: column;*/
	/*flex-wrap: wrap;*/
	/*background-color: rgba(0,0,0,0.2);*/

}

.formRow:last-of-type {
	margin-bottom: 0px;
}

.formRow button {
	background-color: #AAAAAA;
	border: 1px solid #303030;
}

.formRow select,
.formRow input[type='text'] {
	background-color: #FFFFFF;
	border: 1px solid #D6D9DC;
}

.formRow select,
.formRow button,
.formRow input[type='text'] {
	border-radius: 5px;
	width: 100%;
	padding: 5px;
	font-size: 16px;
}


.formRow label {
	margin-bottom: 6px;
	/*width: 100%;*/
	display: inline-block;
}


input[type='text']:disabled {
	color: #505050;
	background-color: #DDD;
}

.formBlock {
	margin-left: auto;
	margin-right: auto;
	display: inline-block;
	/*background-color: rgba(0,0,255,0.1);*/
}
.oneWide .formBlock {
	width: 100%;
}
.twoWide .formBlock {
	width: calc(100%/2 - 3px);
}
.threeWide .formBlock {
	width: calc(100%/3 - 3px);
}
.fourWide .formBlock {
	width: calc(100%/4 - 4px);
}
/*
.formRow input[type='number']:invalid {
	border: 1px solid #D55C5F;
color: #D55C5F;
box-shadow: none; /* Remove default red glow in Firefox
*/


label {
	/*background-color: rgba(0,0,0,0.2);*/
}

fieldset .arLabel {
	/*font-style: italic;*/
}

fieldset .arVal1,
fieldset .arVal2 {
	/*font-style: italic;*/
	display: inline-block;
	margin-left: 0.5em;
	margin-right: 0.5em;
	color: #333;
}

fieldset legend {
	color: #000;

}