p label, .color-picker label {
				width: 10em;
				display: inline-block;
			}
			p.desc, #download {
				font-size: smaller;
			}
			p.desc {
				border-top: 1px solid #afafaf;
				padding-top: 1em;

			}
			.hide {
				display: none;
			}
			.controls {
				padding-bottom: 1em;
			}
			canvas {
				/* if canvas overflows body */
				margin-right: 1em;
			}
			.color-picker {
			}
			.color-sample {
				width: 1em;				
				margin: 0 .2em;				
				height: 16px;
				float: left;
				position: relative;
				top: 6px;				
				
			}
			.color-picker {
				margin-left: 5px;
			}
			.palette {
				margin: 0px 0 0 0em;
				width: 270px;
				background: #efefef;
				border: 1px solid #bcbcbc;
				border-radius: 1px;
				display: none;
				padding: 1px;
				position: absolute;
				z-index: 1000;
			}
			.palette div {
				width: 18px;
				height: 18px;
				margin: 3px;
				cursor:pointer;
				display: inline-block;
			}
			.palette div:focus {
				outline-width: 2px;
				outline-style: dashed;
			}
			.screen-reader-text {
				border: 0;
				clip: rect(1px, 1px, 1px, 1px);
				-webkit-clip-path: inset(50%);
				clip-path: inset(50%);
				height: 1px;
				margin: -1px;
				overflow: hidden;
				padding: 0;
				position: absolute;
				width: 1px;
				word-wrap: normal !important; /* many screen reader and browser combinations announce broken words as they would appear visually */
			}

			noscript p {
				border: 1px solid red;
				padding: 1em;
			}

			#generate {
				border-top: 1px solid #afafaf;
				padding-top: 1em;
			}

			button {
				font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
				padding:5px 1em;
				margin-right: .5em;
				font-size: .9em;
				background:#3377ff;
				color: #fff;
				border:0 none;
				cursor:pointer;
				-webkit-border-radius: 3px;
				border-radius: 5px;
			}
			button:hover {
				background:#0055ff;
			}